Simple Explain

리액트 에러 You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0). npx create-react-app project_name : 에러발생 -> create-react-app@latest로 변경해주면 해결된다. 최신버전을 사용해달라는 의미인듯? npm ERR! Cannot read property 'pickAlgorithm' of null : 아우 왜 자꾸 앱 만드는데서 에러가 나는지 의문이다... -> 그냥 캐쉬 지우면 된다고 한다. The only thing that helped me was clearing cache: npm cache clear --force Uncaught Error: A is o..

21.09.09 ~ Firebase - 작은 프로젝트를 시험삼하 진행하고 싶을 때 사용하면 좋다. (아이디어 테스트용) - 이후 이 작은 프로젝트가 성공적으로 진행된다면 그때 큰 규모의 서버를 짜면 된다. - 즉, 비즈니스를 구상중인 단계에 사용하면 좋다. React - 앞서 많이 공부했으니 패스 1 // Set Up! 트위터 클론코딩은 firebase + react의 형태로 진행한다. npx create-react-app nwitter 그러니 일단 시작은 create-react-app!! 근데 이거 바뀌었단다.. npm install -g create-react-app create-react-app app_name Firebase같은 경우에는 공식 다큐먼트에 정리가 되어있다. 앱 생성하고 키 받으면 된..

사전학습 > what is Hooks? 음... 쉽게 말하면 react의 구조에도 귀찮음을 느낀 개발자가 react를 더욱 쉽게 사용할 수 있는 방법을 고안했다고 하면 될거같아. 본래 리액트는 클래스를 만들고, 스테이트를 설정하고 등등등... 번거로웠던 과정들을 하나의 함수로 선언할 수 있도록 하는 도구이다. 정말 간결하다! ​ 1.0 > useState() : item의 초기값을 설정해주는 함수 setState() : item의 값을 변경시켜주는 함수이다. ​ class 구조를 사용하게 되면, state, render 같은 구조를 사용해야 하지만 hook을 사용하면 함수로 선언하고 return만 해주면 끝난다. ㅁㅊ; 이거 ㄹ 쓰니까 리액트가 만만해졌어. 근데 이제야 리액ㅇ트의 클래스 구조가 이해됐는데..

Redux : Javascript application들의 상태를 관리하는 방법. JS를 사용하는 모든 프레임워크에서 사용가능하다. 단 react를 사용하는 사람들에 의해서 유명해진 탓에 react와 짝궁인 것 처럼 느껴진다. ​ 0.1 > what is Redux? 엥? 로드맵에는 hook 전에 있길래 이거부터 해야하나 했더니 hook 듣고오라그러네 ㅂㅂ~ [출처] 초보자를 위한 리덕스 101 (21.01.15/|작성자 winney

0.0 ~ > - Expo vs React CLI(Command Line Interface) react native의 작업방식이다. cli 는 더 순수한 react native라고 할 수 있다. 많은 기능을 사용할 수 있는데, 그만큼 다루기가 까다롭니다. Expo는 조금은 더 모듈화? 가 되어있는 react인데, 비교적 사용하기 편한만큼 기능이 제한적이다. 니코쌤은 Expo면 충분히 작업할 수 있다고 했으니까 믿어보자. (디테일을 보자면 react native file에 대한 직접적인 접근권한의 차이이다.) ​ qr코드를 통해서 연결하는데 여러 조건이 필요했다. 일단 와이파이를 동일 와이파이로 설정해야한다. 그래도 안되길래 이것저것 찾아봤더니 Tunnel 로 설정하면 된다고 하더라.. 덕분에 잘 되긴했는..

1.1 > Arrow Functions function some(event){ } 이렇게 쓰던 이전 방식 보다는 const some = event => ; 이렇게 함수를 선언하는게 더 좋다고 한다! (왜 때문인지는 아직 잘 모르겠음, 줄을 적게 차지해서 그런가?....) ​ 1.2 > Template Literals ```` -> backthicks, 잊지않았지? ​ 1.3 > Object Destructuring const name = human.name; const lastName = human.lastName; 이렇게 바꿔쓸 수 있단다.. ㅠㅜㅠㅜㅠㅜ신기해 const {name, lastName} = human; ​ const { name, lastName, nationality: difName, ..

오늘 안에 다 끝내고 내일부터 다른 코스 챌린지 들어가야 하는데 가능하겠지? -> 응 못함, ​ Nomad 강의 중에서 reactJS와 react native 코스의 차이가 정말 궁금했는데, reactJS에서는 ES6버전의 Javascript를 사용하는 경우가 많아서 이름이 저렇게 붙은거 같아. 이 정도도 안하고 react native 코스를 진행하려고 하니까 문제가 생기는건 어쩌면 당연한거 아닐까? ​ 기본적으로 nodeJS npm npx git 세팅이 필요해서 다 했구 그 다음, react-app을 만들기 위해서는 npx create-react-app movie_app 을 쳐주면 된다. (like Django) ​ 그 다음에 VSCode를 열어서 npm start를 terminal에 쳐주면 app이 ..

챌린지는 저번주 월요일부터 시작했지만, 두번째 보는거라서 딱히 기록할게 없었다. ​ 이제 좀 생겼어 ​ - JSON web driver의 localstorage는 string 밖에 저장하지 못해. 그래서 우리는 JS의 Data type들을 String로 변환해줄 필요가 있지 좋은 트릭 중에 하나가 JSON모듈을 이용하는건데 (*JavaScript Object Notation!) JSON.stringify(AnyJavascriptObject!); 하면 된다. 자세한 설명은 나중에 *역으로 하는 과정은 JSON.parse(); ​ - forEach array 모듈 중 환상적인 함수로 array.forEach(function(i){ console.log(i); }; ​ 아니면 array.forEach(func..

왜 어제걸 쓰냐면,, 어제 공부를 해보니까 일반 서비스 개발도 좀 로그를 작성할 필요가 있겠더라구,,, ​ 어제 내가 헷갈려 했던건 semantic tag. ​ semantic 은 단어의 의미 자체가 '의미론적'이라는 뜻인데,, ​ semantic tag면 특정 기능을 수행하는 태그인게 맞잖아 근데 왜 헷갈렸어, 왜!! ​ semantic tag VS non semantic tag ​ head -> configuration body -> contents ​ tag + attributes -> very powerful ​ 코딩 실습을 반복하면서 수많은 태그와 att들의 결합을 익히자! 암기하지마!! 절대!!! ​ //// 20.11.11 css 짧고 굵게 ​ # 3.2 cascadig style sheet..