본문 바로가기

분류 전체보기

(204)
Recoil 새로고침 시 user 데이터 유지하기 로그인시 받는 유저 데이터 recoil state 는 새로고침시 날아감 새로고침시 마다 유저 정보를 API 요청 → XXXXXX recoil state 를 persist localStorage를 사용하는 방법이 있음 새로고침시 localStorage에 저장해둔 값을 state에 다시 입력 localStorageEffect.js function localStorageEffect(key) { return ({ setSelf, onSet }) => { const savedValue = localStorage.getItem(key); if (savedValue != null) { setSelf(JSON.parse(savedValue)); } else { // 로컬 스토리지에 저장된 값이 없으면 로그아웃 처리 l..
AWS amplify 로 React 배포하기 (+ blank 빈 페이지 보이는 에러 잡기) npx create-react-app create-react-app으로 설치한 리액트 앱 레포지토리는 빌드 설정을 webpack 을 따로 설정해 주지 않아도 된다. AWS amplify는 풀스택 애플리케이션 구축, 배송 및 호스팅 지원하는 솔루션이다 그동안 클라우드 컴퓨터 생성을 위해 리눅스 서버를 하나 생성하고, 서버를 관리하는 방식으로 배포를 했다면, 그냥 github page 나 vercel 등 과 같이 레포지토리만 지정하고, 빌드 스크립트만 등록하면 알아서 배포를 다해준다 작업 방식은 공식문서나 제야에 널려있으니 참고 https://aws.amazon.com/ko/amplify/ 풀 스택 개발 - 웹 및 모바일 앱 - AWS Amplify 실시간 및 오프라인 기능이 포함된 iOS, Android,..
freeCodeCamp - 1. Create a Basic JavaScript Object 한글 해석 [Object Oriented Programming] Create a Basic JavaScript Object https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object www.freecodecamp.org 사람들이 매일 보는 것들을 생각해보자, 자동차나, 상점, 새들 같은 것들.. 이런 것들이 객체이다 사람들이 관찰하고, 상호작용할 수 있는 명백한 것들. 이런 객체들에게는 어떤 특징(퀄리티)들이 있을까? 자동차는 바퀴가 있고, 상점은 물건을 팔고, 새는 날개가 있다 이러한 특징들 또는 특성들은 객체를 구성하는 것들을 정의한다. 비슷한 객체들은 같은 특성을 공유한다. 그..
freeCodeCamp - 16. Chunky Monkey 한글 해석 [Basic Algorithm Scripting] Chunky Monkey https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey www.freecodecamp.org 첫번째 arr을 주어진 size(숫자)의 길이를 갖는 배열로 잘라내는 함수를 작성하시오 그리고 그 짜갈른 결과를 어레이에 담아서 2차원 배열로 리턴하라 function chunkArrayInGroups(arr, size) { let trial = arr.length/size let anw = [] for(let t=0; t
freeCodeCamp - 15. Mutations 한글 해석 [Basic Algorithm Scripting] Mutations https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations www.freecodecamp.org 만약 주어진 arr의 첫번째 string이 두번째 string의 letter(철자)들을 모두 가지고 있다면 true를 리턴하라 예를 들어 ['hello', 'Hello'] 가 주어진다면, true를 리턴해야한다 대소문자는 무시한다 또, ['hello', 'hey'] 는 false를 리턴한다 hello에는 y 가 없기 때문이다 또, ['Alien', 'line']은 true를 리턴한다. Alien은 line을 모두 갖고 있기 때문이다 function m..
freeCodeCamp - 14. Where do I Belong 한글 해석 [Basic Algorithm Scripting] function getIndexToIns(arr, num) { arr.sort((a,b) => a-b) for(let i=0; i< arr.length; i++) { if(num
freeCodeCamp - 13. Falsy Bouncer 한글 해석 [Basic Algorithm Scripting] Falsy Bouncer https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer www.freecodecamp.org 모든 주어진 arr 에서 falsy 값을 지워라 주어진 arr을 mutate - 변화시키지 마라 (유지해라) js에서 falsy 값들은 false, null, 0, "", undefined, and NaN. 힌트 : 각각의 값을 boolean으로 바꿔봐라 function bouncer(arr) { let arr2 = [] for(let i of arr){ if(Boolean(i)){ arr2.push(i) } } return arr2; ..
freeCodeCamp - 12. Slice and Splice [Basic Algorithm Scripting] Slice and Splice https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice www.freecodecamp.org function frankenSplice(arr1, arr2, n) { let a2_1 = arr2.slice(0, n) let a2_2 = arr2.slice(n) let arr3 = [...a2_1, ...arr1, ...a2_2] return arr3; } frankenSplice([1, 2, 3], [4, 5, 6], 1);
freeCodeCamp - 11. Title Case a Sentence [Basic Algorithm Scripting] Title Case a Sentence https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence www.freecodecamp.org function titleCase(str) { let arr = str.split(' ') let anw = [] for (let i of arr){ anw.push(i[0].toUpperCase() + i.slice(1).toLowerCase()) } let w = anw.join(' ') return w; } titleCase("I'm a little tea pot");
freeCodeCamp - 10. Boo who [Basic Algorithm Scripting] Boo who https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who www.freecodecamp.org function booWho(bool) { if(typeof bool == 'boolean') return true return false } booWho(null);