JS

loading="lazy"

fetch

axios

• <script src="main.js"></scrip> 위에 둔다

axios.get

html vs text

• html에는 태그까지 들어갈 수 있다
• text는 문자열만

---

React

single page vs multi page

html 페이지가 하나 vs 페이지가 여러 개

• 싱글 페이지는 Javascript로 여러 페이지를 하나로 구현하는 것
• 한 페이지를 여러 html 파일로 만드는 것

SPA vs SSR

ReactJS vs NextJS

🚨 ReactJS의 치명적인 단점 2가지
1. 초기 로딩 속도가 느리다
2. SEO가 어렵다
-> 이를 보완한 것이 NextJS!

• ReactJS 는 한번에 다 받아오기 때문에 초기 로딩 속도가 더 느리다
  • 다 불러왔기 때문에 이동 속도가 더 빠르다
  • SEO가 좋지 않다
• NextJS는 한 페이지만 받아오기 때문에 초기로딩 속도가 더 빠르다 (서버사이드 렌더링)
  • 페이지를 불러와야하기 때문에 페이지 이동 속도가 더 느리다
  • SEO가 좋다

npm start

App.js

코드를 작성하면 react 페이지가 열린다

---

Tailwind CSS

• npm install -D tailwindcss -D 는 devDependencies로 설치함
• npm rm -rf tailwind tailwind.config.js 파일 생성해주는 명령어. 어떤 파일이 영향받는지 알려주는 파일.
• <div className="w-[238px] h-[238px] bg-blue-500">Box</div> 임의의 사이즈를 입력할 때는 대괄호를 사용한다.

background-color

text-color