전체 글

TIL] 리액트 기초

SCSS SCSS, SASS 둘 다 CSS를 편하게 쓰도록 도와줍니다. 기본 문법은 CSS와 동일합니다. 다른 점이 있다면 각 하위 태그들에 스타일을 줄 때 각각 다른 블럭을 만들어 쓸 필요가 없습니다! //scss div{ p{ color: 원하는 색; font: { family: 글씨체; size: 사이즈; } } div { background-color : 원하는 색 &:hover { background-color: 원하는 색 } $defaultSize: 원하는 사이즈 p{ font-size: #{$defaultSize}; } styled-components class 이름 짓는 것을 안 할 수 있습니다! 컴포넌트에 스타일을 적기 때문에 비교적 간단하고 직관적이라 할 수 있습니다! 내용 const ..

TIL] 리액트 기초

웹의 동작 개념 웹페이지는 서버에서 미리 준비한 것을 받아서 그려주는 것입니다. 1. 요청을 보냅니다 -> 2. 받은 HTML 파일을 그려줍니다. 1에서 요청은 서버가 만들어 놓은 API에 정해진 약속대로 요청을 보냅니다! 서버와 클라이언트 클라이언트 : 웹사이트를 보는 도구는 전부 클라이언트입니다. 서버 : 우리가 보는 웹사이트에 뿌려줄 것을 만들어서 클라이언트에 전달합니다. 서버리스 서버리스는 서버가 없는 것이 아닌 서버를 내가 만들 필요가 없단 것입니다! 서버리스는 백엔드 리스가 아닙니다! Component(컴포넌트) 컴포넌트는 클래스형과 함수형이 있습니다. 리액트가 레고라면 컴포넌트는 블록이라 할 수 있습니다! State와 Props state는 컴포넌트가 가지고 있는 데이터입니다. state는 ..

TIL] 자바스크립트 기초 문법

출력하기 자바스크립트에서는 출력을 할 때 console.log()를 사용합니다! console.log('안녕하세요!') 변수 선언과 데이터 할당 자바스크립트에서는 변수를 선언할 때 let이라는 키워드를 사용합니다! let name = 'Nerd' console.log(name) // 결과 : Nerd name = 'JongHyuk' console.log(name) // 결과 : JongHyuk 자바스크립트에서는 파이썬과 다르게 const라는 키워드도 있는데 const는 let과 달리 변수에 값을 재할당할 필요가 없을 때 사용합니다! 해당 변수가 고정된 값을 가지고 있어야 할 때 사용합니다! const name = 'Nerd' console.log(name) // 출력 : Nerd 데이터 타입 자바스크립트..