A smaller version of painting and crafting showcase website. Drawnest is a MERN Stack project. in this website an user can browse collection of Painting and drawing related content . any person can register and create his/her painting or drawing related content, this content will be public. User can create account by using google, facebook and github account.
- User Authentication: Utilizes Firebase authentication for secure user login, logout, sign up, and sign out functionalities.
- Sign in Method : User can Log in this web app by using their google / facebook / github.
- All Craft Item : Here anyone kn see all kind of item that has been added by any logged in user.
- Private Route : If anyone visit this website without creating account this user can't see more than two section
- Add Craft and art : any logged in user can see this section this is a private route . in this section user can add there project of art or drawing related , this content will be public.
- My Added List : In this section user who added their content can see their content and if they want to update of delete they can be do it.
-
Frontend:
- React: A JavaScript library for building user interfaces.
- HTML5: The standard markup language for creating web pages and applications.
- CSS3: The style sheet language used for describing the presentation of a document written in HTML.
- JavaScript (ES6+): The programming language that enables dynamic interactivity on web pages.
- React Router: A routing library for React applications.
- Firebase: An authenticating kit, for manage user accessibility .
- AOS : A smooth scrolling library for eye catching animation.
- React Hook Form : A build in react hook from use in the application for manage user input
- Swiper Slider : swiper slider use for the silder .
- Lottie React : An Animation library for animating front end.
-
Backend:
- Node js : An environments runtime for creating server side by js.
- Express js :
- Mongodb : Mongodb atlas for save data in the database .
To get started with this project, follow these steps:
-
Clone this repository to your local machine using the following command:
git clone https://github.com/Dinobondhu-shill/DrawNest-client
```bash
cd DrawNest-client
npm install
npm run dev
-
Open your browser and navigate to http://localhost:5173 to view the application.
-
Clone this repository to your local machine using for server side the following command:
git clone https://github.com/Dinobondhu-shill/DrawNest-server
-
Open your browser and navigate to https://localhost/5000 to view the application.
- Navigate to the login page by clicking on the "Login" button in the navigation bar.
- Enter your email and password to log in, or click on the "Sign Up" link to create a new account.
- After logging in, you will be redirected to the dashboard where you can explore property listings and manage your profile.
- In this section user can see all kind of painting related post and they can seen the view detatils button, if any logged in user click on the button it will be redirect to the details page of this specefic page.
- if any user who using without creating account it will redirect to the login page.
- any logged in user can see this section this is a private route . in this section user can add there project of art or drawing related , this content will be public.
- In this section user who added their content can see their content and if they want to update of delete they can be do it.
Feel free to explore the website and its features, and don't hesitate to reach out if you have any questions or need assistance.
Contributions are welcome! If you'd like to contribute to this project, please follow these steps:
- Fork the repository.
- Create a new branch for your feature or bug fix.
- Make your changes and commit them with descriptive messages.
- Push your changes to your fork.
- Submit a pull request to the main repository.
If you have any questions or suggestions, feel free to contact the project maintainer:
- Dinobondhu Shill
- Email: choncolbiswas9@gmail.com
- GitHub: https://github.com/Dinobondhu-shill
This README provides detailed information about the project, including features, technologies used, folder structure, and instructions for getting started and contributing. Feel free to customize it further to match the specifics of your project!