/inkfinder

Platform for finding and creating tattoo designs

Primary LanguageJavaScript

Project for 'Web Technology' course in Ivan Franko National University of Lviv

The main idea of the project is to make it easy for avarage user to use a power of AI to create a good tattoo.

Stack

Tech stack

Node.js 18, Express.js, React.js, MongoDB, Redux toolkit, Tailwind, Jest

Resources

Vercel, Mongo Cluster

Architecture diagram

Architecture diagram

How to run a project on localhost

Dependencies recovery

Since node_modules are not in repository , you need to recover node_module for both client and server. You can do it with npm i in root and client/csletmelearn folders

To start server

Start with npm run start:dev

To start client

Open client folder cd client and then vite project directory cd csletmelearn. Start it using vite or use npm run dev

Environment variable that you have to provide

  • PORT : port where server will locate
  • MONGO_URL : url for your mongoDB cluster
  • JWT_ACCESS_SECRET : secret word for your access token
  • JWT_REFRESH_SECRET : secret word for your refresh token
  • SMTP_HOST : host for node mailer (for example its "smtp.gmail.com" if using gmail)
  • SMTP_PORT : port for node mailre (find it in imap setting in your account)
  • SMTP_USER : email that will send activation links
  • SMTP_PASSWORD : password for this email (if using gmail better turn on 2FA and use app password)
  • API_URL : full link for your server (for example http://localhost:5000)
  • CLIENT_URL : full link for your client
  • CLOUDINARY_API_KEY : key that you can find in cloudinary dashboard
  • CLOUDINARY_API_SECRET : secret string that you can find in cloudinary dashboard
  • CLOUDINARY_CLOUD_NAME : name of your cloudinary account

Scripts availible

build - to make a build of frontend from root directory

Project decomposition

  1. Authorization

    • Backend auth service setup
    • Backend token service
      • Refresh token generator
      • Access token generator
    • Backend mail service setup
    • Registration , login , logout functionality in auth service
    • Activation functionality in auth service and mail services
    • Auth routes on server
    • Frontend auth handle
    • Unactivated account handle
    • Unactivated account limitation
    • OAuth
  2. API implementation

    • DALL-E 2 (changed to pollinations AI due to lack of Open AI credits)
    • Cloudinary
  3. Main functionality

    • Storage for images
    • Design generation
    • Cloudinary usage
    • Upload page/functionality
    • Favorite post page/functionality
    • Recomendation algorithm
    • Tags
    • Account page
  4. Database

    • Mongoose schemas
    • MongoDB Cluster for development
    • CosmosDB deployment
  5. Tests

    • Jest
    • Auth service tests
    • Database connection tests
    • Database request tests
    • Posts tests

Contacts :

Email
Telegram