본문 바로가기

웹30

next.js 로 설문 사이트 만들기3 5월 초에 작성하고 진행못했던 플젝 이어서 합니다... 일정이 너무 바빠서 이제 작성합니다. 먼저 설문을 진행하려면 설문자의 정보, 정보에 대한 동의서 등이 필요합니다. 이부분에 대해 적당한 그림을 그려줍니다. 첫번째 설문자의 정보를 입력하는란엔 input태그들을 이용해 필요한 데이터를 입력하게 하고 또는 선택지를 주어서 선택하게 만들어줍니다. 1차 설문자의 정보를 넣는 부분에 대한 레이어에 대략적인 설계는 끝나게 됩니다. 두번째 동의서 및 동의 부분 동의 내용에 해당하는 부분들을 보여주고 체크박스를 이용해 동의에 대한 체크를 받아줍니다. 2차 설문자의 동의 부분에 대한 설계가 끝납니다. 이렇게 첫페이지가 완성됩니다. 그밖에 "헤더"에 설문의 정보를 넣는다던지 "푸터"에 사이트의 정보를 넣는다던지 공통적.. 2023. 8. 7.
[javascript] iterable 객체 반복가능한( iterable, 이터러블) 객체는 배열을 일반화한 객체이다. 이터러블이라는 개념을 사용하는 어떤 객체는 for ... of 반복문을 적용할 수 있다. 배열은 대표적인 이터러블이다. 배열 외에도 다수의 내장 객체가 반복 가능하다. 문자열 역시 이터러블의 예이다. 아래 예시로 range라는 객체를 이터러블로 만들어 배열화 해보면 Symbol.iterator 반복 대상의 객체( range )와 이터레이터 객체( range[Symbol.iterator] )를 분리하여 관리 let range = { from: 1, to: 5, }; // 1. for..of 최초 호출 시, Symbol.iterator가 호출됩니다. range[Symbol.iterator] = function () { // Symbo.. 2023. 5. 31.
next.js 로 설문 사이트 만들기2 일단 vercel을 통해 배포를 해둡시다. 아래 링크에서 접속 ㄱㄱ https://vercel.com/ Vercel: Develop. Preview. Ship. For the best frontend teams Vercel is the platform for frontend developers, providing the speed and reliability innovators need to create at the moment of inspiration. vercel.com vercel에서 로그인을 할때 github 아이디로 로그인을 하면 바로 deploy, 배포를 하라고 함. 그러면 아래와 같이 배포하고 싶은 repository를 선택하여 배포. 위 상황에서 import를 선택하면 아래와 같은 페이지.. 2023. 5. 4.
next.js 로 설문 사이트 만들기1 Next.js 사이트에서 cna를 이용해 시작하기 아래 링크를 통해 천천히 읽어가면서 시작하면 된다. https://nextjs.org/docs?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app Getting Started | Next.js Get started with Next.js in the official documentation, and learn more about all our features! nextjs.org cmd 창에서 아래 명령어를 입력하면 코드로 입력해둔 내용들이 순차적으로 나오는데 읽어보고 골라서 선택해주면된다 npx create-next-app 프로젝트명 npx create-n.. 2023. 5. 2.

티스토리툴바