코딩애플 선생님의 'Next.js로 웹서비스 만들기' 보면서 공부한 내용입니다. 부족한 내용이나 잘못된 내용은 댓글남겨주시면 감사하겠습니다! (무료인 부분만 올리겠습니다) 출처 : https://codingapple.com/course/next-js/ Array 자료형 변수에 여러 자료형 사용 // 여러 자료를 한 곳에 보관하기 위해 array 자료형 사용, 자료형 섞어서 사용 가능 let a = ['Tomatoes', 'Pasta', 'Coconut', 20, 30] array에서 데이터 하나만 꺼내기 위해서는 인덱스 사용 console.log(a[0]) array 데이터 수정은 등호 사용 a[0] = 30 html에 적용 상품목록 {상품[0]} $40 {상품[1]} $40 {상품[2]} $40

코딩애플 선생님의 'Next.js로 웹서비스 만들기' 보면서 공부한 내용입니다. 부족한 내용이나 잘못된 내용은 댓글남겨주시면 감사하겠습니다! (무료인 부분만 올리겠습니다) 출처 : https://codingapple.com/course/next-js/ 장바구니 페이지 제작 /list로 접속 시 상품목록페이지 보여주기 url 만드는 기준은 개발자 마음 Routing (라우팅) : url로 페이지를 나눔 일반적인 웹서버 프레임워크에서는 라우팅을 하려면 어떤 사람이 /list를 접속하면 ~~.html을 보내주는 코드를 짬 하지만 Next.js는 자동 라우팅 기능이 있음 -> 파일, 폴더 하나 만들면 라우팅 끝 app/폴더생성/page.js생성 폴더명이 url이 됨 /list로 접근 시 page.js 내용 보여..

코딩애플 선생님의 'Next.js로 웹서비스 만들기' 보면서 공부한 내용입니다. 부족한 내용이나 잘못된 내용은 댓글남겨주시면 감사하겠습니다! (무료인 부분만 올리겠습니다) 출처 : https://codingapple.com/course/next-js/ 리액트에서 쓰는 html문법을 JSX라고 함 html을 넣을 때 유의 사항이 있음 1. return()안에 html 넣을 때 하나의 html태그에서 하나의 html태그로 끝내야 함 1-1. 옳은 예시 - page.js return ( 안녕! ) 1-2. 올바르지 않은 예시 - html 태그를 두 개 이상 넣지 못함 2개 태그 넣고 싶으면 로 감싸거나 이렇게 무의미한 태그로 묶어도 됨 return ( 안녕! ) 2. css를 적용하기 위해서 클래스를 만들때 ..

코딩애플 선생님의 'Next.js로 웹서비스 만들기' 보면서 공부한 내용입니다. 부족한 내용이나 잘못된 내용은 댓글남겨주시면 감사하겠습니다! (무료인 부분만 올리겠습니다) 출처 : https://codingapple.com/course/next-js/ https://nodejs.org/ko LTS로 설치 (신버전 Next.js를 사용할 것이므로 18버전 이상으로 설치) 계속 진행 에디터는 vscode 사용 프로젝트 폴더 만들고 vscode에서 열기 nextJs 프로젝트 생성 터미널 -> new Terminal npx create-next-app@latest --experimental-app 프로젝트명은 쿠팡프레시를 유사하게 만들 것이므로 fresh typescript는 사용 안함 tailwind css도..