Overview

• Official website: https://netcomic.vercel.app
• Author: Nguyễn Hoàng Lâm ( @lamhoang1256 )

Preview

Dark Mode:

Light Mode:

Resources

• API: https://netcomic.vercel.app/api-doc (Crawl data from website Nhat Truyen - https://nhattruyenin.com)
• Font Family: Averta
• Icon: https://heroicons.com

Main technology used

• NextJS, Typescript
• Firebase
• Tailwindcss
• Zustand (State management)
• Axios (Support fetching data)
• Swiper (Slider), react-modal (Modal)
• React-toastify, sweetalert2 (Message UI)
• Next-swagger-doc, swagger-ui-react (Document API)
• Cheerio (Crawl data from website Nhat Truyen)
• Other: react-tailwindcss-select, query-string, react-lazy-load-image-component, ...

Features

• Suggested featured comics
• Search comic by name
• Filter by categories, top rank, date, ...
• Save comic history
• Follow comic you like
• Update information profile
• Level up through reading comic
• Comments (require sign in)
• Theme: dark mode, light mode

Environment Variables

NEXT_PUBLIC_NHATTRUYEN = https://nhattruyenin.com
NEXT_PUBLIC_NODE_ENV = development (or production)
NEXT_PUBLIC_SERVER = http://localhost:3000 (or Link vercel)
NEXT_PUBLIC_LOCALHOST = http://localhost:3000

# See: https://firebase.google.com
NEXT_PUBLIC_FIREBASE_PUBLIC_API_KEY=
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=
NEXT_PUBLIC_FIREBASE_PROJECT_ID=
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=
NEXT_PUBLIC_FIREBASE_APP_ID=
NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=

Screenshots