출처 : https://www.inflearn.com/course/%ED%8C%8C%EC%9D%B4%EC%8D%AC-%EC%9E%A5%EA%B3%A0-%EC%9B%B9%EC%84%9C%EB%B9%84%EC%8A%A4/dashboard 장고(Django)를 배우기 시작한 입문자이시거나, 또는 배우고 싶은 생각이 있으신 분은 위 출처의 강의를 적극 추천드립니다!!! 현재 웹프론트엔드 개발과 스마트폰 애플리케이션 개발이 중점이 되면서 서버에 대한 API 서버가 필요해짐 이 API 서버를 개발할 때 바로 백엔드, 즉 Django가 필요해짐 웹서비스가 필요한 이유? 서버의 역할을 하기때문에 모든 서비스의 근간이기 때문에 웹서비스들을 만들때마다 반복되는 것들을 표준화 해서 묶어놓은 것 즉 반복을 줄여주는 것이 각 ..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! Publishing 핵심 : github 페이지에 deploy하는 방법에 대해 배운다. cmd에 npm i gh-pages를 입력해준다. . gh-pages는 결과물을 github pages에 업로드 할 수 있게 해준다. 1. pacage.json 파일에서 scripts를 build 시켜준다. scripts를 실행하게 되면, 우리 웹사이트의 production ready code를 생성해주는데, production ready란 코드가 압축되고 모든게 최적화 되는 것을 의미한다. 2. pacage.json 파일 맨 아..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! React Router 핵심 :React Router에 대해서 알아본다. . Switch의 역할은 Route를 찾는 것인데 Route는 URL을 의미한다. Switch는 URL을 찾으면, 컴포넌트를 렌더링한다. 또한 Switch는 한번에 Route 하나만 렌더링 되게 해준다. 1. BrowserRouter 방식 function App() { return ( {/* 유저가 해당 경로에 있다면, Detail를 렌더링 해준다는 뜻*/} {/* 유저가 해당 경로에 있다면, Home Route를 렌더링 해준다는 뜻*/} );..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! Movie App part 핵심 : Movie App을 만들며 배운것들을 총 복습해본다. 구현할 기능들 : 영화들의 기본적인 정보들과 링크를 삽입하여서 그 영화에 대해서 더 많은 것을 찾아볼 수 있도록 다른 곳과 연결시켜줌 . then이라는 문법보다 더 많이 사용하고 있는 문법이 있는데 바로 async-await이라는 문법이다. then으로는 아래와 같이 작성되고 useEffect(() => { fetch("https://yts.mx/api/v2/list_movies.json?minimum_rating=9&sort_..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! Coin Tracker 핵심 : Coin Tracker를 만들며 배운것들을 복습해본다. 구현할 기능들 : 페이지를 들어왔을 때 로딩 메세지가 보이고, 코인들이 나열되면 로딩 메세지를 숨기고 코인들을 멋진 리스트로 보여주는 기능 // --------- import --------- import { useEffect, useState } from "react"; function App() { // --------- state --------- const [loading, setLoading] = useState(true..

출처 : https://nomadcoders.co/ 노마드 코더 Nomad Coders 코딩은 진짜를 만들어보는거야!. 실제 구현되어 있는 서비스를 한땀 한땀 따라 만들면서 코딩을 배우세요! To Do List 핵심 : to-do list를 만들며 배운것들을 복습해본다. // --------- import --------- import { useEffect, useState } from "react"; function App() { // --------- state --------- const [toDo, setToDo] = useState(""); const [toDos, setToDos] = useState([]); // --------- function --------- const onChange=..