콤퓨우터/프로그래밍 공부 5

Next.js Full Course 필기 (4)

Fireship.io의 "Next.js Full Course" 강의를 듣고 필기했던 내용입니다. Follow 기능 만들기 데이터베이스 스키마 수정 Follows 모델: followerId 피팔로우자의ID followingId 팔로우하는 자의 ID @@id([followerId, followingId]): userA_userB 같은 식으로 만들어지는 해당 팔로우에 대한 고유ID followedBy Follows[] @relation("following") following Follows[] @relation("follower") } model Follows { follower User @relation("follower", fields: [followerId], references: [id]) follow..

Next.js Full Course 필기 (3)

Fireship.io의 "Next.js Full Course" 강의를 듣고 필기했던 내용입니다. Protecting Routes from User 예를 들어, 로그인하지 않은 사용자에게는 특정 라우트에 접근하지 못하게 하고 싶을 수 있다 서버 컴포넌트에서 그렇게 하지 못 하게 하는 가장 좋은 방법은, getSeverSession()을 쓰는 것이다 (로그인이 되어 있지 않다면 NULL이 될 것이기 때문) 따라서 const session = await getServerSession(); if(!session) { // Option #1 - 'next/navigation'의 redirect 사용하여 로그인 페이지로 보내버리기 redirect('/api/auth/signin'); // Option #2 retu..

Next.js Full Course 필기 (2)

Fireship.io의 "Next.js Full Course" 강의를 듣고 필기했던 내용입니다. Nav Menu 구현하기 전에: UI 컴포넌트를 어디에 넣을것인가? 여러 페이지에 공유될 것 같은 컴포넌트는 /components에 넣는다. 내비게이션 바는 어디에서나 보이기는 하지만 실제로는 Root layout에만 들어가는 것이다. 그러니까 루트 layout.tsx 파일과 함께 루트 디렉토리에 같이 놓기로(Colocation) 하자. 서버 컴포넌트 or 클라이언트 컴포넌트? 기본적으로 Next.js의 모든 컴포넌트는 서버컴포넌트 하지만 Sign In 버튼처럼 인터랙티브한 기능이 필요하다면 클라이언트 컴포넌트가 나을 수 있다 'use client';로 하지만 SEO를 위해 googlebot이 페이지에 접근했..

Next.js Full Course 필기 (1)

HTML 삽입 미리보기할 수 없는 소스 옛날에 위의 영상을 보고 공부했던 내용을 개인 필기용으로 적어둔 것입니다 File System Routing /app/about example.com/about Dynamic Route /app/[slug] example.com/{slug} Catch-All Route /app/[...id] example.com/…id/…id/…id () /app/(group) - will be ignored by routing system Reserved Filenames page.tsx (in TS) or page.js 실제 UI를 정의하는 기본 React 컴포넌트를 export layout.tsx (in TS) or layout.js UI that surrounds the e..

아희와 Hello, Wolrd! - 1문자씩 분석해보았다

아희?아희는 한글로 된 난해한 프로그래밍 언어입니다. 네, 코드가 한글입니다. 물론 한글이라는 것이 쉽다는 뜻은 아닙니다.프로그래밍 언어라면 모름지기 Hello, World! 부터 찍고 봐야 하는 법. 아희의 헬로월드를 보고 가시겠습니다. 밤밣따빠밣밟따뿌 빠맣파빨받밤뚜뭏 돋밬탕빠맣붏두붇 볻뫃박발뚷투뭏붖 뫃도뫃희멓뭏뭏붘 뫃봌토범더벌뿌뚜 뽑뽀멓멓더벓뻐뚠 뽀덩벐멓뻐덕더벅 2005년경 아희의 창시자 Puzzlet Chung 님이 작성한 아희의 Hello, world! 코드입니다. 정확히 8x8의 깔끔한 구성을 하고 있죠. 이 코드의 출력값은 다음과 같습니다.Hello, world!LF깔끔하죠? 이런 아스트랄한 아햏햏함 덕분에, 아희는 한국 개발자들 사이에서 컬트적인 인기를 끌고 있습니다. RPython으로 만든..