출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! nomadcoders.co 오류를 해결하는데 도움이 된 사이트 : https://www.codegrepper.com/code-examples/javascript/frameworks/react/npm+ERR%21+enoent+ENOENT%3A+no+such+file+or+directory%2C+open Create React App 핵심 : 지금까지 우리는 import 형식을 통해서 리액트 어플리케이션을 만들었지만 이제부터는 create-react-app을 사용하여 ReactJS 어플리케이션을 만든다. . create..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! nomadcoders.co 전에 배웠던 것 복습 : 각각의 로직(기능)을 각자 다른 컴포넌트에 적고, 그 자식 컴포넌트들을 Rendering하는 큰 부모 컴포넌트를 가지는 방식을 통해서 분할 & 정복 방법을 사용할 수 있다. Props 핵심 : React JS의 Props에 대해 배워본다. Props는 부모 컴포넌트로부터 자식 컴포넌트에 데이터를 보낼 수 있게 해주는 방법이다. . 어떻게 리액트 컴포넌트를 재사용할 수 있게 만드는가? . 컴포넌트는 단지 어떤 JSX를 반환하는 함수이다. function Confirm..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! nomadcoders.co Understanding State 핵심 : React JS의 state에 대해 배워본다. . state는 기본적으로 데이터가 저장되는 곳이다. function handleClick() { counter = counter + 1; . 위의 counter 변수의 역할을 state로 대신할 수 있음. // 즉 값이 바뀌는 데이터들 1. 예전 방식으로 counter 만들기 const root = document.querySelector("#root"); let counter = 0; functi..

출처 : https://nomadcoders.co/ 오류를 고친 사이트 : https://stackoverflow.com/questions/64097973/uncaught-error-minified-react-error-200 Introduction 핵심 : React JS의 기초를 알아본다. . 뭔가를 배우는데, 이것이 어떤 문제를 해결하는지, 해결하려는 문제를 직접 겪어보며 이해를 해야한다. 그렇지않으면 우리는 어려움을 느끼고, 재미를 느끼지 못할 것이다. . React JS는 우리의 웹사이트에 간단하게 상호작용을 만들어준다. . 강의에서는 앞으로 바닐라 JS와 React JS를 비교하고, 왜 React JS가 더 좋은지를 설명해주실것임!!! Before React 핵심 : React JS의 기초를 ..

출처 : https://nomadcoders.co/ ReactJS 핵심 : ReactJS가 무엇인지 알아본다. . 프런트엔드에 무언가를 빌드하고, 웹사이트를 interactive하게 만들고, 아름다운 것들을 제작하고 사람들이 사용하는 무언가를 만들기 위해서는 ReactJS는 최고의 도구이다. . 왜 우리가 ReactJS를 배워야하나? - 개발자로서 가장 중요한 자원은 바로 시간임 cuz 우리가 무언가를 배워나가기 위해서는 필수적으로 시간이 투자되기 때문임. 그러나 우리가 시간을 투자하여 배우더라도 그 프레임워크나 라이브러리가 없어져버리면 시간만 버린 꼴이 된다. 이런 상황에서는 현재 ReactJs는 아주 좋은 선택이다. - 그 이유는 1. 우리가 신기술을 배울 때 중요한 것은 누가 이 기술을 사용하고있는..

출처 : https://nomadcoders.co/ Geolocation 핵심 : Geolocation를 위해 기본 환경을 세팅한다. 0. weather.js를 만들어주고, html에 import해준다. 1. weather JS에서 navigater 함수를 이용해서 사용자의 위치를 값으로 받는다. tip // navigator 함수는 첫번 째 인자로 위치를 받는데 성공했을 때의 함수를 받고, 두번째 인자로는 에러가 발생했을 때 실행될 함수를 받는다. // 위치를 받는데 성공했을 때의 함수 function onGeoOk(position) { // 위도 값을 저장함. const lat = position.coords.latitude; // 경도 값을 저장함. const lng = position.coords..