목록전체 글 (148)
도영스 공간
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/b3zfeR/btrwIg5GHRf/FuvHrF3bmELsnK1K6HHVRK/img.png)
우선 강의자료 부터 !!! 4주차 강의자료 링크 Click 🧚♀️ 🤩 [스파르타코딩클럽] 리액트 기초반 - 4주차 매 주차 강의자료 시작에 PDF파일을 올려두었어요! teamsparta.notion.site 1. keyframes 사용하기 keyframes는 styled-components안에 이미 들어있다. 웹에서 애니메이션을 구현할때는 transition과 animation이라는 스타일 속성을 많이 사용한다. import styled,{keyframes} from "styled-components"; function App() { return ( ); } const boxAni = keyframes` 0% { border-radius:0px; top:20px; } 50%{ border-radius:..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/qcafX/btrwIh3MEbX/dy8A0TB1Xfk4zICwQwMhJ1/img.png)
주특기 기본 개인 과제 시작 ! 1. 메인 페이지, 평점 남기기 페이지 생성 2. 라우팅 3. 페이지간 이동 -선택한 페이지로 이동시키기 -남기기 버튼 클릭 시 이전 페이지로 이동 4. 4주차&5주차 강의 듣기 음 일단 week-1이라는 프젝을 하나 만들어주었다. 그리고 yarn add styled-components yarn add react-router-dom@5.2.1 스타일 패키지, 라우터 패키지를 프젝에 설치해주었다. yarn start !!! 막막하였다........... 어디서부터..짜야될지..하나도 모르는 상황이 발생..🤫🤭 예시 사이트를 봤는데.. 소스에서 답을 볼 수 있었다. 답보면서 그냥 배끼는 수준의 코드를 짜고 있다. 자괴감이 든다...... index.js import React..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bQA90m/btrwpivj0sY/426PPSrW8kYtumeVoleDI0/img.png)
이번 WIL 키워드 ! 👉JavaScript의 ES란?, ES5/ES6 문법 차이 우선 자바스크립트의 ES란 ?? ES는 ECMA Script의 약자 자바스크립트는 1990년대 Netscape 회사의 Brendan Eich 라는 사람에 의해 최초 개발되었다. 자바스크립트가 잘 되자, MS에서 Jscript라는 언어를 개발해 IE에 탑재하였는데, 이 두 스크립트가 너무 제각각이라, 표준이 필요하게 되었다.. 표준을 위해 자바스크립트를 ECMA(European Computer Manufactures Association)라는 정보와 통신시스템의 비영리 표준 기구에 제출하였고 표준에 대한 작업을 ECMA-262란 이름으로 1996년 11월에 시작해 1997년 6월에 채택되었다. ES5는 ECMA Script5..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bci9XK/btrwVrkSKok/8L0ZD88hFJUbyKkdc0bZY1/img.png)
09:00 - 21: 00 : 리액트 기초반 강의 다 듣기 !!! 이건 무리였다.. 3주차 강의까지는 다 들었다 !! 에러가 떠도 겁내지 말고 코딩하자 !! 나의 TIL에 강의내용을 정리 하려니깐 좀 내용이 많아지는 것 같아서 따로 포스팅 해두려고 한다. TIL엔 정말 내가 오늘 배운 것들을 정리해두려고 한다. 우선 갑자기 내용이 머릿속에 훅훅 들어오니까 뭐가 뭔지 잘 이해가 안가지만 최선을 다해 열심히.. 기억을 해보려고 한다. 😪 다행인건 알고리즘 주차에는 그렇게 잠이 많이 왔는데 ..(코로나 핑계를 대면서 잠을 잤지만,, 알고리즘 문제 풀어서 잠이 왔던 걸로) 주특기 주차에는 잠을 잘 시간조차 없다. (그래도 난 잔다. 체력이 없기 때문..날씨가 풀리면 체력증진을 위해 아침마다 아파트 한바퀴 뛰고 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/lLdqC/btrwmr77NTE/XEAG457GjYjTQRNikq93A0/img.png)
음..1주차 강의자료 ..전부 정리하고 있었는데 임시저장 안해서 다 날라갔다.ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 젠장. 그냥 강의자료로 보자 !!! 다시 작성하기엔 ... ;;;; 1주차 강의자료 링크 Click👻 🤩 [스파르타코딩클럽] 리액트 기초반 - 1주차 매 주차 강의자료 시작에 PDF파일을 올려두었어요! teamsparta.notion.site 아....정말 ~~~~ 다 날라가버려서 ...화딱지가 나지만. . . 고고.. 1. JSX 란? 👉 그럼 리액트에서 어떻게 뷰를 그릴까요? App.js 파일에서 보이듯, JSX 문법을 사용해서 React 요소를 만들고 DOM에 렌더링 시켜서 그립니다. 👉 리액트에서는 딱 하나의 html 파일만 존재합니다. (public 폴더 아래에 있는 index.html..
보호되어 있는 글입니다.
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cvpnyx/btrwPbp8rz7/kLf1NJyVdH0XaFGvka3kD0/img.png)
오늘은 알고리즘 주차에서 주특기 주차로 바뀌었다. 음 팀을 확인했는데 또 팀장이당.. 😅 헤헤.. 다시 잘해봐야지 ! 1. React강의를 듣기 위해 우선 환경설정을 시작했다. 👻 환경설정 가이드 링크 Click👻 React 환경설정가이드 및 command not found: brew /command not found: nvm 에러 해결방법 👻 환경설정 가이드 👻 1. VSC를 설치 (맥 윈도우 공통) 설치링크 click 🤩👉 https://code.visualstudio.com/download Download Visual Studio Code - Mac, Linux, Windows Visual Studio Code is free and ava.. ryurim.tistory.com 대충 강의 내용에서 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/6E02Z/btrwlP7XRI0/GMzTJTJ7qQbES7D40aY0zk/img.png)
첫 react 프로젝트 만들기 vsc 터미널에서 설치해줄 게 좀 있다 ! 1. nvm으로 노드js를 설치해줬다. nvm install [설치할 버전] 나는 16.14.2버전을 설치해줬다. nvm install 16.14.2 이렇게 vsc 터미널에 적어주면 된다. nvm ls # nvm으로 설치한 노드 버전 리스트 확인 명령어 node -v # 노드 버전 확인 명렁어 +) nvm에서 사용 중인 노드 버전 바꾸기 nvm use [사용할 노드 버전] 이렇게 간단하게 노드 버전도 터미널을 통해 변경해줄 수 있따. 2. npm으로 yarn설치하기 # npm으로 패키지를 설치할 때는 아래 명령어를 사용해요! # 옵션은 필요한 경우에만 적어줍니다. # npm install [옵션] [설치할 패키지 이름] npm in..