Skip to content

Instantly share code, notes, and snippets.

View whoisryosuke's full-sized avatar
👾
Going deep with game development

Ryosuke whoisryosuke

👾
Going deep with game development
View GitHub Profile
@whoisryosuke
whoisryosuke / fix-npm-permission.md
Last active August 13, 2021 19:38
NPM - Fix permission denied error when installing npm dependencies/modules
sudo chown -R `whoami` ~/.npm
sudo chown -R `whoami` /usr/local/lib/node_modules

Fixes this error

$ npm i -g npm
npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules/npm/node_modules/ansi-align
@whoisryosuke
whoisryosuke / windows-dev-setup-tips.md
Last active August 17, 2021 00:46
Windows - Computer Setup Tips

Cannot run node script (like CLIs)

If you get an error like this:

cannot be loaded because running scripts is disabled on this system. For more information, see about_Execution_Policies at

Run this command as an administrator in PowerShell:

@whoisryosuke
whoisryosuke / horizontal-skybox.shader
Created July 27, 2021 23:00
Unity / Shader - Horizontal Skybox
Shader "Custom/Horizontal Skybox"
{
Properties
{
_Color1 ("Top Color", Color) = (1, 1, 1, 0)
_Color2 ("Horizon Color", Color) = (1, 1, 1, 0)
_Color3 ("Bottom Color", Color) = (1, 1, 1, 0)
_Exponent1 ("Exponent Factor for Top Half", Float) = 1.0
_Exponent2 ("Exponent Factor for Bottom Half", Float) = 1.0
_Intensity ("Intensity Amplifier", Float) = 1.0
@whoisryosuke
whoisryosuke / develop.sh
Created July 15, 2021 19:28
Bash/Mac - Open new Terminal window for each command (e.g. 2 CLI scripts that need to stay running)
#!/bin/sh
parent_path=$( cd "$(dirname "${BASH_SOURCE[0]}")" ; pwd -P )
osascript -e 'tell app "Terminal"
do script "cd '$parent_path' && cd ../first-app && yarn start"
end tell'
osascript -e 'tell app "Terminal"
do script "cd '$parent_path' && cd ../second-app && yarn start"
end tell'
@whoisryosuke
whoisryosuke / broken-array.js
Last active October 18, 2022 16:10
JS - Broken array mapping -- need to use `[...new Array(16)]`
new Array(16)
.map((_, index) => {
console.log('first', index)
return index
})
.reverse()
.map((index) => console.log(index))
@whoisryosuke
whoisryosuke / dynamic-refs.jsx
Created May 3, 2021 21:07
ReactJS - Dynamically create Refs for children using useRef hook and createRef - @see: https://stackoverflow.com/questions/55995760/how-to-add-refs-dynamically-with-react-hooks
const {
useState,
useRef,
createRef,
useEffect
} = React;
const data = [
{
text: "test1"
@whoisryosuke
whoisryosuke / yup-form-validation.js
Created April 30, 2021 18:01
JS / Yup - Example of Yup form validation - @see: https://github.com/jquense/yup
import * as yup from 'yup';
// In your React component...
const checkFormData = async () => {
let schema = yup.object().shape({
testName: yup.string().required(),
name: yup.string().required(),
email: yup.string().email().required(),
});
@whoisryosuke
whoisryosuke / useMedia.jsx
Created April 15, 2021 14:58 — forked from cassidoo/useMedia.jsx
An example of checking on a media query with React Hooks
function useMedia(query) {
const [matches, setMatches] = useState(window.matchMedia(query).matches)
useEffect(() => {
const media = window.matchMedia(query)
if (media.matches !== matches) {
setMatches(media.matches)
}
const listener = () => {
setMatches(media.matches)
@whoisryosuke
whoisryosuke / shallow-equal.ts
Created April 9, 2021 18:41
JS - Shallow Equal -- If you're using React Redux, you can also `import { shallowEqual } from "react-redux";`.
type CompareObject = { [key: string]: any };
export default function shallowEqual(objA: CompareObject, objB: CompareObject) {
if (objA === objB) {
return true;
}
if (!objA || !objB) {
return false;
}
@whoisryosuke
whoisryosuke / useAnimation.tsx
Created April 6, 2021 16:38
AFrame / React / AnimeJS - useAnimation hook for animating A-Frame's Entities. Uses the ThreeJS Object3D properties for performance.
import React, { useLayoutEffect, useRef } from "react";
export type VectorCoordinate = {
x: number;
y: number;
z: number;
};
export type useAnimationProps = {
from: {
[key: string]: VectorCoordinate | number | string;