전체 글 56

31일차 프론트엔드 공부 -나만의 페이지 만들기 실습 01

- 프론트엔드 공부 31일차 -   참고사항export const ContentText = styled.textarea`  width: 996px;  height: 480px;  font-size: 16px;  border: 1px solid #bdbdbd;  padding: 16px;`; textarea 태그란? input 태그보다 더 많은 내용의 텍스트를 불러올때 사용하는 태그이다. 입력되는 글자가 많을 경우 자동 줄바꿈의 효과가 있다.   SettingRadio type="radio" id="youtube" name="radio-button" />RadioText htmlFor="youtube">유튜브RadioText>SettingRadio type="radio" id="image" name="ra..

30일차 프론트엔드 공부 - Node.js

- 프론트엔드 공부 30일차 -프로그램 설치1. VSCODE 설치2. Node.js 설치3. Yarn 설치 폴더에 기능 설치하기1. 바탕화면에 폴더 만들기2. 폴더에 "class" 라는 이름의 Next.js 프로젝트 설치하기3. class 폴더에 Emotion(CSS 쉽게 만들어주는 기능) 설치4. class 폴더에 Apollo-Client, Graphql(백엔드 통신 쉽게 해주는 기능) 설치5. class 폴더에 Ant-Design(누가 만든 버튼과 인풋창 등) 설치6. class 폴더에 Axios(백엔드 통신 쉽게 해주는 기능2) 설치VSCODE 추가 익스텐션vscode-styled-components 설 프로그램 설치1. 인터넷을 통해 VSCODE 설치2. 인터넷에 Node.js 검색 후 설치3. ..

29일차 프론트엔드 공부

- 프론트엔드 공부 29일차 -구조분해할당구조화 되어 있는 배열, 객체와 같은 데이터를 destructuring(분해) 시켜, 각각의 변수에 담는 것 let arr = [1, 2]let [one, two] = arrconsole.log(one, two) // 1 2 let obj = { name: "otter", gender: "male" } let { name, gender } = objconsole.log(name, gender) // otter male let { name: newName, gender: newGender } = objconsole.log(newName) // otter spread 연산자하나로 뭉쳐있는 값들의 집합을 전개해주는 연산자… const arr = [ 1, 2, 3, 4,..