분류 전체보기
-
React JS_Router 2WEB/ReactJS 2020. 1. 27. 16:23
#6.2 ~ 6.3 아래 강의 중 'ReacJS로 웹 서비스 만들기'를 보고 배운 것과 모르는 것을 찾아 정리한 내용입니다. https://academy.nomadcoders.co/courses Academy % Complete academy.nomadcoders.co 1. 네비게이션 사용하기 /와 /about을 navigate 하기위해서는 네비게이션을 사용해야 한다. Navigation.js 파일에 네비게이션 컴포넌트를 다음과 같이 만든다. 코드 상의 Home, About 각각은 페이지에 대한 목록이라고 볼 수 있다. //src/components/Navigation.js import React from 'react'; import './Navigation.css'; function Navigation..
-
React JS_Router 1WEB/ReactJS 2020. 1. 27. 15:47
#6.0 ~ 6.1 아래 강의 중 'ReacJS로 웹 서비스 만들기'를 보고 배운 것과 모르는 것을 찾아 정리한 내용입니다. https://academy.nomadcoders.co/courses Academy % Complete academy.nomadcoders.co 1. React-Router 준비하기 웹페이지를 interactive(페이지 간 이동이 용이) 하게 만들기 위해서 네비게이션이라는 것을 사용할 것이다. 네비게이션을 사용하기 위해서는 라우터(react-router-dom)라는 것을 써야한다. react-router-dom은 네비게이션 만들어 주는 패키지이다. 리액트에는 라우팅이 내장되어 있지 않기 때문에 따러 설정해야 한다. 일단 설치하자. npm install react-router-do..
-
React JS_웹 페이지 클라우드에 올리기 by GithubWEB/ReactJS 2020. 1. 26. 05:53
#5.0 아래 강의 중 'ReactJS로 웹 서비스 만들기'를 보고 배운 것과 모르는 것을 찾아 정리한 내용입니다. https://academy.nomadcoders.co/courses Academy [풀스택] 인스타그램 클론 코딩 2.0 인스타그램 백엔드 + 프런트엔드 + 앱 + 서버 [중급] NodeJS, Prisma, GraphQL, Hooks, React Native % Complete academy.nomadcoders.co 1. GitHub page로 웹사이트 접속하기 1. gh-pages 설치하기 명령어: npm i gh-pages gh-pages는 내가 만든 웹사이트를 깃허브에 업로드하는 것을 허가해주는 모듈로, 웹사이트를 github의 github page 도메인에 나타나게 해준다. gi..
-
React JS_AxiosWEB/ReactJS 2020. 1. 22. 02:09
#4.0 ~ #4.5 아래 강의 중 'ReactJS로 웹 서비스 만들기'를 보고 배운 것과 모르는 것을 찾아 정리한 내용입니다. https://academy.nomadcoders.co/courses Academy [이론+실전] 코코아톡 클론 코딩 % Complete academy.nomadcoders.co 1. Axios 일반적으로 자바스크립트에서 데이터 fetch하는 방은 fetch를 사용하는 것이다. 하지만 더 좋은 방법인 axios가 있다. 왜 더 좋은지는 둘다 사용해봐야 알 것 같다. 일단 구글링에 의하면, axios가 보다 사용하기 편리하며 fetch보다 더 많은 기능을 가지고 있는것 같다. axios는 fetch 위에 있는 작은 layer라고 생각하면 된다. axios를 사용하기 위한 단계는 ..
-
React JS_StateWEB/ReactJS 2020. 1. 20. 19:06
#3.0 ~ #3.3 아래 강의 중 'ReactJS로 웹 서비스 만들기'를 보고 배운 것과 모르는 것을 찾아 정리한 내용입니다. https://academy.nomadcoders.co/courses Academy 바닐라 JS로 크롬 앱 만들기 % Complete academy.nomadcoders.co 1. Class Component State를 다루기 위해서는 컴포넌트를 class component로 선언해야 한다. class component의 형식은 아래와 같으며, React.Component를 extends한다. React.Component안에 state(data)를 넣을 수 있고 변경이 가능하기 때문이다. 즉, State 데이터를 다루기 위해서는 react component를 확장한 class..
-
React JS _ JSX & PropsWEB/ReactJS 2020. 1. 16. 03:12
#2.0 ~ #2.4 아래 강의 중 'ReactJS로 웹 서비스 만들기'를 보고 배운 것과 모르는 것을 찾아 정리한 내용입니다. https://academy.nomadcoders.co/courses Academy 바닐라 JS로 크롬 앱 만들기 % Complete academy.nomadcoders.co 1. Component component는 HTML을 반환하는 함수이다. 아래 코드에서이 component의 형태이며, 이것이 component를 사용하는 방법이다. 리액트는 component와 함께 동작하며 모든 것은 component로 이루어져 있으므로 component를 빼고 리액트를 설명할 수는 없다. 아래 코드는 index.html 파일의 root element에 App component를 넣겠다..