• Stars
    star
    287
  • Rank 144,232 (Top 3 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created over 3 years ago
  • Updated about 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

๐Ÿ“ Built with Nextjs framework with Typescript and Chakra UI library with support from MongoDB

trello-clone Build status

forthebadge

Trello clone

Twitter: Ankit Kumar

Overview

This is a clone application for trello. This has been built for learning purpose. My plan is to improve this project and add more features in every release.

Demo

Features ๐Ÿคฉ

  • Login/Register with JWT token authentication
  • Ability to create/update/delete the board
  • Ability to add/update/move/delete the card
  • Background image library for the board
  • Add labels to the card
  • Supports adding of detail description in the card
  • Invite user to the board
  • Assign a card to the user

Requirements

  1. Node.js
  2. npm

Steps to run this on your local

First install the MongoDB Compass for better visualization of data with MongoDB server.

  1. Clone this repo using git clone https://github.com/knowankit/trello-clone.git
  2. Create .env.local and add this env variable LOCAL_MONGODB=mongodb://localhost:27017/trello Add JWT_SECRET_KEY=randomstrings
  3. Run yarn install
  4. Run yarn dev

For unsplash gallery, api key is needed which can be generated from unsplash website

If you want to run the project using docker

Install docker on your machine and start it

  1. Create .env.development file.
  2. Add LOCAL_MONGODB=mongodb://mongodb:27017/trello
  3. Run docker-compose up

What's next ๐Ÿš€

  • Comment on the card
  • Add cypress testing

Tech stacks

  • Nextjs with typescript
  • MongoDB for local development
  • Mongo Atlas for production DB
  • Chakra UI library

Support

Reach out to the maintainer at one of the following places:

"Buy Me A Coffee"

Contributing

All contributions are welcome!

Contributors

Made with contributors-img.

Other interesting repositories

License

This project is licensed under the MIT license.

See LICENSE for more information.

More Repositories

1

email-editor

๐Ÿ“ง A drag and drop email editor using Next.js, Zustand and MUI
TypeScript
89
star
2

video-calling-app

๐ŸŽฅ One-to-one video calling app built using react, node and socket.io
JavaScript
40
star
3

fullstack-monorepo-boilerplate

๐Ÿš€ A monorepo boilerplate built with Nx, NestJS, React, GraphQL and MongoDB.
TypeScript
37
star
4

knowankit.com

๐Ÿค“ My portfolio built using Next.js, Chakra UI, MDX, TypeScript, and Vercel.
TypeScript
34
star
5

Image-encryption-using-chaos-theory

Final Year Project
Python
23
star
6

react-bubbly-effect-button

๐Ÿงผ Bubble animation effect on button
JavaScript
18
star
7

particle-text-effect

๐Ÿ“— Particle animation effect on text
JavaScript
7
star
8

hoveron

๐ŸŽจ A CSS file to animate buttons on hover
CSS
5
star
9

thanos-snap

A fun package for Marvel Thanos which wipes the image with one snap ๐Ÿ˜œ
HTML
5
star
10

react-smart-carousel

๐ŸชŸ A smart carousel that remembers how you slid the image.
TypeScript
4
star
11

url-shortener

๐Ÿ–‡ An app which shortens the long URL
JavaScript
4
star
12

openai-playbook

TypeScript
2
star
13

pokemon-react

A pokemon list filter using Reactjs
JavaScript
1
star
14

react-testimonial

A bootstrap supported react library for adding testimonial
JavaScript
1
star
15

google-holi

A npm package similar to google Holi
1
star
16

build-react-npm

โšก๏ธA CLI tool for building react npm packages.
JavaScript
1
star
17

ui

JavaScript
1
star
18

book-library-system

A library book management built with reactjs and express server.
TypeScript
1
star
19

github-search

A GitHub search engine that uses GitHub API to fetch the top 5 repositories based on the search text.
HTML
1
star