🦁사이트 바로가기

📢 INFO

멋쟁이 사자처럼 명지대 10기 홍보 사이트는 멋쟁이 사자처럼 명지대를 홍보하고 지원을 독려하기 위한 브랜드 사이트입니다

🎨 특징

• Next.js 프레임워크로 개발했으며, Styled-Component로 스타일링을 했습니다.

• 외부 링크 시 보여지는 프리뷰를 디자인 하기 위해 OpenGraph를 적용했습니다.

• 사용자 분석을 위해 Google Analytics를 적용했습니다.

• Netlify로 배포했으며, 빠른 웹 컨텐츠 제공을 위해 CloudFront와 EC2를 활용했습니다.

💊 결과

Google Analytics

데이터 수집 기간 (2월 27일 ~ 4월 9일)

• 데이터 수집 기간 기준 총 490회 방문했습니다.
• 하루 최대 방문 횟수는 100회입니다.

CDN

• CDN 적용 전, 모든 콘텐츠를 렌더링 하는데 최소 6s, 최대 25s입니다.
• CDN 적용 후, 모든 콘텐츠를 렌더링 하는데 최소 0.4s, 최대 7s입니다.
• CDN 적용 전 후 비교 시, 3배 ~ 15배 속도 개선을 할 수 있었습니다

📌 Before Start

• 이 프로젝트는 패키지 매니저로 yarn을 권장합니다
• 원활한 개발을 위해 prettier, eslint 확장자 설치가 필요합니다

✨ Start Project

yarn dev
# or
npm run dev

# Error
'next'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다.
발생시 git bash에서 `yarn upgrade`를 해주세요


# yarn dev 실행 후
http://localhost:3000에 접속해 보세요

🛠 Tech Stack

주요 개발 언어, 프레임워크

• React, Next.js, JavaScript, HTML, CSS

페이지 스타일링

• styled-components, styled-reset

배포 및 CDN

• Netlify, EC2, CloudeFront

ETC

• Google Analytics

⚖ Convention

commit message

헤더	내용
feature	새로운 기능 추가
refactor	코드 리팩토링
fix	버그 수정
style	세미 콜론 수정, 줄바꿈, 스타일 등 기능에 지장 가지 않는 스타일 변경
setting	빌드수행, 패키지 설치, 환경 설정 수정 등
document	주석 추가삭제, reademe 작성

branch naming

├── main
│-----------hotfix
│-----------relese
└── develop
    └── feature

👩‍👩‍👦 팀소개