Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/knowankit/trello-clone
📝 Built with Nextjs framework with Typescript and Chakra UI library with support from MongoDB
https://github.com/knowankit/trello-clone
javascript mongodb nextjs reactjs trello trello-clone
Last synced: 3 months ago
JSON representation
📝 Built with Nextjs framework with Typescript and Chakra UI library with support from MongoDB
- Host: GitHub
- URL: https://github.com/knowankit/trello-clone
- Owner: knowankit
- License: mit
- Created: 2021-04-19T11:04:26.000Z (about 3 years ago)
- Default Branch: develop
- Last Pushed: 2024-04-09T14:09:10.000Z (3 months ago)
- Last Synced: 2024-04-09T18:04:36.670Z (3 months ago)
- Topics: javascript, mongodb, nextjs, reactjs, trello, trello-clone
- Language: TypeScript
- Homepage: https://trello-clone-one.vercel.app
- Size: 14.8 MB
- Stars: 249
- Watchers: 5
- Forks: 67
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Lists
- Awesome-NextJs - trello-clone - [website](https://trello-clone-one.vercel.app/) (Nextjs Projects)
README
# trello-clone 
[](https://forthebadge.com)
- [Overview](#overview)
- [Features](#features)
- [Requirements](#requirements)
- [Installation](#steps-to-run-this-on-your-local)
- [1. **Clone the application**](#1-clone-the-application)
- [2. **Install necessary dependencies for the application**](#2-install-necessary-dependencies-for-the-application)
- [3. **Create a .env file and copy the contents from .env.example**](#3-create-a-env-file-and-copy-the-contents-from-envexample)
- [4. **Start the application**](#4-start-the-application)
- [What is next?](#Whats-next)
- [Tech Stack](#tech-stacks)
- [Support](#support)
- [Contributing](#contributing)
- [License](#license)
## 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](https://trello-clone-one.vercel.app/)
## 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](https://nodejs.org/)
2. [npm](https://www.npmjs.com/)
## 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:
- [Portfolio](https://knowankit.com)
[](https://www.buymeacoffee.com/knowankit)
## Contributing
All contributions are welcome!
### Contributors
Made with [contributors-img](https://contrib.rocks).
## Other interesting repositories
- [My Portfolio](https://github.com/knowankit/knowankit.com)
- [React bubble effect button](https://github.com/knowankit/react-bubbly-effect-button)
- [Particle text effect](https://github.com/knowankit/particle-text-effect)
## License
This project is licensed under the **MIT license**.
See [LICENSE](LICENSE) for more information.