본문 바로가기
728x90

분류 전체보기530

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.
2024/10월 최근 Netlify 사용법 사이트https://www.netlify.com/ Scale & Ship Faster with a Composable Web Architecture | NetlifyRealize the speed, agility and performance of a scalable, composable web architecture with Netlify. Explore the composable web platform now!www.netlify.com사이트 접속 로그인 부터 빡셌음.뭘 다 인증하라고 한다. ( 신분증 )그러다가 갑자기 로그인이 안돼서깃허브로 로그인하려다가 안돼서 그냥 email 로그인했음.그랬는데도 로그인 안돼서 비번 찾기도 하고 갑자기 비번도 바꿨더니 로그인 됐다. 강의 참고웹사이트 배포하는 법, .. 2024. 10. 12.
리액트 상단 로고, 제목 바꾸는 방법 상단 리액트 마크 바꾸기이렇게 로고도 추가해주고, nff 라고 이름도 바꿔줌.  1) 로고 변경2) 사이트 이름 React App => nff 로고 추가해주기로고 추가여기서 보면 기존의 원래 리액트 생성 시에 있던 기존의 logo 이미지들을 다 지워주고,png 파일과 svg 파일을 새로 넣어줬다.이렇게 따로 이미지를 갖고와서public 폴더에 넣어주면 된다. 그 다음 index.html 파일을 열기index.html 파일을 열어서줄 쳐진 부분에 경로 수정을 해주면 된다. icon 부분은 svg 로애플 터치 아이콘은 png 로 넣어줌.apple-touch-icon은 iOS와 iPadOS 장치에서 웹사이트의 홈 화면에 추가할 때 사용되는 아이콘입니다. 사용자가 웹사이트를 홈 화면에 추가하면 이 아이콘이 사용.. 2024. 10. 12.
무료 클라우드 서버 총정리 아직도 돈 내고 서버 이용 중? 무료 클라우드 서버 총정리 - YouTube 2024. 10. 11.
웹사이트 배포하는 법, Netlify 면 버튼하나면 충분 유튜브: 프론트엔드 호스팅 검색해서 봄로컬호스트를 탈출하자! | 웹사이트 배포하는 법, Netlify 면 버튼하나면 충분 (youtube.com)여기서 도메인 얻을 수 있음회원가입 해야함그러면 이렇게 창이 나옴. 깃허브 클릭.저 녹색 버튼 클릭그럼 다음과 같은 화면 뜸.여기서 git hub 저 검정버튼 클릭해주기모든 프로젝트가 뜨게 됨.여기서 내가 올리고 싶은 프로젝트 찾기.너무 많으면 검색 활용하기.찾으면 해당 프로젝트 선택(클릭)deploy 세팅 창 나옴.브랜치도 설정 가능 걍 넘김바로 사이트 등록해주면 됨.만약 어떤 세팅이 더 필요한 경우 show advanced 눌러서new variable 눌름그리고 환경변수 추가.모르겠으면 그냥 넘어가기이러면 끈남. 저 위에거가 주소이다.눌러보면 잘 뜨는 거 확.. 2024. 10. 11.
728x90

티스토리툴바