728x90 코딩애플254 좋아요 버튼 만들기 (useState, onClick) 보호되어 있는 글 입니다. 2024. 10. 26. Component에 데이터 전해주려면 props 보호되어 있는 글 입니다. 2024. 10. 26. client/server component, import 문법 보호되어 있는 글 입니다. 2024. 10. 26. Next.js에서 이미지 넣는 법 2개 상품명 잘 보이게 해보라던 저번시간 숙제는상품.map((a, i)=>{ return ( {a} $40 )}) map 함수 안에 파라미터 작명할 수 있다고 했습니다.첫 파라미터는 상품 array 안에 있던 하나하나의 자료가 되니까 그걸 html 안에 집어넣으면 되겠군요. 아니면 둘 째 파라미터는 정수라고 했으니 {상품[i]} 써도 될듯요 [collapse]반복문 사용시 주의사항리액트에선 반복문 사용시 반복문으로 반복생성중인 html에는 key={} 속성을 집어넣으라고 권장합니다. {} 안에는 1씩 증가하는 정수 같은거 넣으면 됩니다.보통 이렇게 i 집어넣음. 상품.map((a, i)=>{ return ( {a} $40 .. 2024. 10. 25. html을 반복문으로 줄이고 싶으면 map 오늘의 숙제 : 하단 참고 /list 페이지에 실제 데이터를 넣어봅시다= 상품목록 페이지에다가 실제 데이터 집어넣어보기실제서비스였으면 DB에서 데이터를 뽑아서 보여줬을 텐데 처음부터 복잡하게 코드짜면 이해 안되니까 나중에 하기로 하고상품목록 페이지에다가 변수 하나 생성= let 상품 export default function List() { let 상품 = ['Tomatoes', 'Pasta', 'Coconut'] return ( (생략)▲ 우선 /list 페이지에 변수로 하드코딩해놓읍시다.DB에서 데이터 가져와도 이렇게 array 자료에 담겨있는 경우가 많으니DB에서 가져왔다치고 이걸 html에 넣어봅시다. 실제로 DB 데이터를 갖고왔다고 쳐도 이렇게 변수에 저장이 돼있음. arra.. 2024. 10. 25. 여러 페이지 만들기 (라우팅) 오늘의 숙제 : 하단 참고 이번엔 다른 페이지 만드는 법을 알아봅시다. 페이지 나누는걸 전문용어로 라우팅이라고 합니다. 다른 페이지 만들기웹사이트들은 url을 이용해서 페이지를 구분해놓습니다.vibe.naver.com/today 으로 접속하면 오늘의 메세지 보여주고 vibe.naver.com/chart 으로 접속하면 차트 보여주고 이렇게 맘대로 url을 작명해놓고 거기로 접속하면 다른 html을 보여주는 식으로 개발해놓습니다. 우리가 만들 사이트도 메인페이지 & 상품목록페이지가 필요할테니 각각 만들어봅시다. Q. url은 어떻게 정함?url 작명은 개발자 마음입니다. 어떤 url로 접속하면 어떤 html을 보여줄지 알아서 결정하면 됩니다.저는 예를 들어서 /list로 접속하면 상품목록페이지를 보여주고 .. 2024. 10. 25. 이전 1 ··· 10 11 12 13 14 15 16 ··· 43 다음 728x90
