yhancsx / yhancsx-next Goto Github PK

1. 조재민님 블로그

상단 메뉴

Projects 카드형, 미리보기/애니메이션

Publications

2. Posts 카드형? 리스트형?

카드형 https://velog.io/

카드 리스트형 https://velog.io/@velopert

리스트형 https://jbee.io/

3. Posts 카테고리?태그?

카테고리

태그

카테고리 태그 혼합 https://palant.info/categories/

• 다크모드
• 한/영
• 반응형
• 페이지 전체 애니메이션 https://wattenberger.com/

Post

• 카드형, 리스트형 토글 기능 (네이버 블로그 모바일)
• 방문자 댓글 https://www.gatsbyjs.com/docs/how-to/adding-common-features/adding-comments/

Project

• 썸네일 이미지 애니메이션 https://www.jaeminjo.com/

Common

• post, project, publicastion 타입 정의
• 폰트 정하기
• 일단 PC모드 완성하고 -> 반응형 정리
• github action 배포 (gh-pages ?)
• 데이터 옮기기
• 메인 자기소개 문구 생각하기
  • I'm interested in boosting customer experience with interactions and animations.
  • I love to use typescript, React/Vue, D3.js, SVG, WebGL.
  • Currently Front-end Engineer at Naver Corporation

Home

• 유튜브, 인스타 링크
• [ ]

Posts

• PostPreivew > description 필수작정하는걸로
• default thumbnail 이미지

Projects

• Project Preview 카드형 만들기
  • 한행에 3개 / 모바일은 1개
  • 컨텐츠:
    • vue option -> badge 붙이기
    • https://yhancsx.github.io/html-css-svg-animations/ ?
• detail은 없음. 링크만 연결

Publications

공통점

• react 기반
• SSR, SSG 가능

gatsby

• graphQL 사용
• PWA
• plugin 다양함 (markdown, google analytics 등)
• 하이브리드 렌더링 -> DSG

nextjs

• 자유도 높음
• plugin 적음. 필요한것 직접 만들어야함.
• 하이브리드 렌더링 -> ISR (페이지별 정적 생성 가능)

Next.js vs. Gatsby in 2023