Skip to content

Latest commit

 

History

History
210 lines (124 loc) · 8.12 KB

README.md

File metadata and controls

210 lines (124 loc) · 8.12 KB

Kyoto Manga - Free website to read comics!

logo

The official website is Kyotomanga.live

Table content
Tech stack
Inspiration
Screenshots
Project setup
Plans
Sponsor

Tech stack

  • NextJS + ReactJS
  • Recoil -> Jotai
  • Mongodb
  • Next-auth
  • TailwindCSS + HeadlessUI

Inspiration

Name

Kyoto comes from the name of the old capital of Japan. I was impressed by the beauty of Kyoto so I used this name

Go to table of contents 🔼

Inspired UI

Go to table of contents 🔼

Refer other NextJS project

Go to table of contents 🔼

Screenshots

Home page:

home-page-kyoto-manga

Go to table of contents 🔼

Browse page:

  • Multiple layout:

browse-page-mutilple-layout

Go to table of contents 🔼

  • Detail layout:

details-layout

Go to table of contents 🔼

  • Column layout:

Column layout

Go to table of contents 🔼

Details page

details page

Go to table of contents 🔼

details page

Go to table of contents 🔼

details page

Go to table of contents 🔼

details page

Go to table of contents 🔼

Read page

  • Desktop vertical:

read-page-desktop-vertical

Go to table of contents 🔼

  • Desktop horizontal:

read-page-desktop-hr

Go to table of contents 🔼

  • Mobile vertical:

Mobile-vertical-read

Go to table of contents 🔼

  • Mobile horizontal:

mobile-horizontal-reading

Go to table of contents 🔼

Login page

login-page

Go to table of contents 🔼

Follow page

follow-page

Go to table of contents 🔼

Search

search ui

Go to table of contents 🔼

Project setup

  • Environment Variables
# New environment for code base v2:
# Two Options hosting https://scalegrid.io (No credit card is required for the first month) or https://railway.app (Free 5Gb forever for starter plan)
# setup the database follow this instruction: https://github.com/leephan2k1/manga-app/blob/main/Database.Vi.md (English will come later)

MONGODB_DATA_URI=mongodb://<your-uri>
MONGODB_DATA_DB=<your-db-name>


# Node service (See: https://github.com/leephan2k1/manga-scraper)
NEXT_PUBLIC_BASE_URL=your-node-service

# Mongodb: (See: https://www.mongodb.com/atlas/database)
MONGODB_URI=mongodb+srv://<username>:<password>@cluster....
MONGODB_DB=your-db-name

# Note: Because i use next-auth You must provide callback uri for facebook and google has the following form: your-domain.com/api/auth/callback/<provider> .Otherwise the authentication won't work!

# Google Oauth2 (See: https://console.cloud.google.com/)
GOOGLE_ID=your-google-client-id
GOOGLE_SECRET=your-google-secret

# Facebook Oauth (See: https://developers.facebook.com/apps)
FACEBOOK_CLIENT_ID=your-facebook-client-id
FACEBOOK_CLIENT_SECRET=your-facebook-secret

# Random Secret (Easy generate: https://generate-secret.vercel.app/32)
JWT_SECRET=your-jwt-secret

Go to table of contents 🔼

Plans:

  • save chapter
  • automatically switch chapters
  • notify (new chapter of comic)
  • comment
  • english version
  • add more source (+1 LHM, +1 OTK)
  • import follow list from user anilist (public)
  • recommended from users

Go to table of contents

Sponsor

Kyoto manga is an open source project. It means is free and always free. I am pleased if you intend to sponsor this project.

  • You can donate via my ERC20 Wallet (ETH, BNB, USDT coin,...)
0xA9E95FBcaB1D52706623d8e0b12d6b044c474bCC
  • Or you can donate via bank (Vietnam)
  1. Sacombank: 070109823242 (PHAN THANH TRIẾT LÝ)

  2. MOMO:

    momo

Happy coding!

fun-doge

Go to table of contents 🔼