4

Next.js기반 교회 웹사이트 제작 [9] - (간단한 문법 설명)

Project 중 Prisma의 실습이 필요해서 우선 DB에 값이 들어간 User 테이블가지고 테스트를 해볼까해그런데 문제는 아직 cloud storage를 안만들어놔서 프로필 사진까지는 연동이 힘들다 이말이야그리고 또 한가지는 내가 시간이 없어서 퍼블리싱을 일일히 하기가 어려워서AI의 도움을 받다보니 state같은 관리를 AI가 만들어줘 버렸어...나중에는 한번 만들어볼게 이번엔 간단하게 원리만 집고가보자이번에 해야할 것은 우리교회 드랍박스에 있는 섬기는 사람들 목록조회야구조는 Tab별로 전체 ~ 직분별로 나누어 교회 있는 사람들을 조회할 수 있는 페이지를 만드는것이고현재 이것으로 진행한 이유는 DB에 값이 USER 밖에  없어서 그래자 실습을 해보자component에 우선 profile을 만들었고, ..

Next.js기반 교회 웹사이트 제작 [4] - Main페이지 작업 (Footer)

우선 다른 서비스들을 보면 대다수 Footer가 존재하잖아 왜 있을까? 한번 생각을 해봤는데 여기에 개인정보처리방침이나 이런것들을 놨더라고 그래서 개인정보 처리방침이 뭐냐?응... 우리가 회원가입을 할때 개인정보를 가져오잖아 그때 개인정보 적법하게 처리하고 안전하게 관리하고 있다는 방침을 명시해줘야되나바 어... 이거 개인정보보호법 30조여서 안하면 과태료임뭐 이런것들 작성하라고 Footer 만들어 놓나바 음..근데 지금은 솔직히 시간이 아까워 가이드랑 이런거 보고 하기엔 나중에 제대로 하고 지금은 틀만 잡을게우선 구성은 어떻게 할거냐면 1. HOME : 언제든 메인으로 갈 수 있게 HOME 만들기2. 개인정보처리방침 : 개인정보처리방침 보는 페이지로 넘기기3. 교회 정보, copyright 정보등등~4..

Next.js기반 교회 웹사이트 제작 [3] - Main페이지 작업, 환경변수 사용법

이전 글을 이어서 해보자 오늘은 MainWorship과 MainDirection을 한번 해보자고MainWorship → Youtube로 올린 말씀영상중 최신3개를 뽑아와서 Main에 표출하는 작업MainDirection → Naver map api를 통해서 오시는길을 표시 및 교회의 정보를 표출하는 작업 MainWorship우선 Youtube api는 내 영상이 없으니까 뽑아오기 뭐해서 현재는 형식만 맞춰놓고 차후 api를 통하여 진행할 예정개인적인 생각으로 SSG나 SSR을 통해서 진행해보려 했는데 외부 API 스크립트를 로드하고 그 API를 호출해서 동적으로 요소를 생성해야하기 떄문에 CSR에서 처리해야된다고 하네?그건 나중에 한번 해보자MainDirection여기는 naver map api는 일정부..

Next.js기반 교회 웹사이트 제작 [2] - Main페이지 작업

자 저번까지는 Main section 까지 만들었고 이제는 교회 소개를 만들어보자아무래도 교회소개부분은 설명할게 별로없어 그냥 css고 tailwindcss를 적용했다? 정도 빼고는 말할게 없을 것 같아 그래서 간단했냐?? 아니 진짜 너무 어렵더라 구조잡고 그 구조를 컨트롤하는게생각보다 많이어려워...백문이불여일견 일단 어떻게 했는지 결과부터봐이게 일단 대충 만들어논 Main화면 교회 소개 파트이고앞으로 저 Card요소에는 db에서 값을 불러와서 최신글 5개정도만 보여지도록 구성하려고현재는 저 영역의 코드가 전부 하나로 되어있는데 만들고 나서 보니까 영역을 component로 구분해야 겠더라이유는!현재 클라이언트에서 이벤트가 없는 화면은 전부 SSR로 처리하고 있는데 나중에 Prisma를 통해서 값을 A..