Hush... Finally, Target Achieved!!!
can't say Achieved because we are a developer and there is always scope for improvement on the development Highway. This is our 2nd project since we joined Masai School. In this project, we used HTML, CSS, JAVASCRIPT, and mongoDb as a tech stack. This clone was made with the help of my other 2 team members. We are moving towards becoming FullStack developers as this was the first project that included our own backend as well as the front end.
About Our Project
Dunzo is a hyper-local on-demand delivery service in India. It delivers anything and everything as and when needed with minimum delivery charges. Dunzo Digital Private Limited is the parent company of the hyper-local demand delivery service startup Dunzo which is founded by Kabeer Biswas. At the age of 28, he decided to save people's time and initiated the plans for Dunzo. . It was incorporated on July 8th, 2014, and is registered at the Registrar of Companies, Bangalore.
Tech Stack used
HTML
CSS
JAVA SCRIPT
MongoDB
Razorpay
Responsibilities and Listing of important features
Every team member was given a specific set of tasks to be completed by the end of the day. We started by listing the pages that we will cover and present them. Each one of us was assigned at least two pages to cover from the website. As we didn't have any APIs for this project we had to create our database. So for the first day, we were collecting the data and kept adding it to our database as we had less time to work on it. Once the database was done then we started working on the Backend. Our first goal was to create a basic backend for the page so that we can get the basic idea and implement them.
Platforms Used for Communication
As we were working remotely, Slack and Zoom was the only app that helped us communicate with each other. We also used Github for creating issues, and assigned the task for an individual, and created milestones. We had a fixed schedule by which we had to complete the given task for the day and at the end of each day, we have to show our progress to each other. This was very helpful as we were able to decide how much we have covered as a team and what are changes required to make the page work properly.
Issues faced during the build week
As we were first time working on the backend data, it was very hard to collect data and make the database, for that only we gave our full one day. and the next part is all about implementation and make connections between the backend and frontend. it was really tough for us. so we managed this thins by reading mongo, mdn documentation. watch some videos on youtube, some lecture notes, and videos. and finally, the day comes that we did successful completion of work.
Experience
It was really a busy week and I learned a lot of new and cool things during the entire build week. I got to learn how to implement MongoDB Atlas and manage the data, making requests and managing the endpoints. We all were working from different parts of India. However, we were able to complete the project and had it working by the end of the build week. I learned a lot about remote collaboration. We had few downtimes but we used to let at least one person know so that we can keep track of our progress.
Few screenshots of our projects
INDEX PAGE :
The Index Page of the Dunzo website displays various store and their offers. In the top section, there is a Header that displays LOCATION and a dropdown menu. we can add custom locations for pages. on hovered we have applied color change property. we also use modal to create our sign-in and location edit option. At the bottom section, there is a footer, both Header & Footer are the same across all the pages. The page is responsive for all screen sizes.
AFTER LOGIN PAGE :
The after login page was made to give users extra access to the website. On that page, users can buy any product and add anything to the cart.
LOGIN AND SIGN IN PAGE:
there is log-in and sign-up functionality both done on the same sign-in button. on click of that button we use modal to show login page, Dunzo allow only OTP as a log-in method so we also used that method by providing mobile number user get OTP then by applying that OTP user can log in.
ITEM PAGES :
On this page user is able to access the store near to him, we have added the store data inside this page. we have made two versions of this page to give users access before log in and after login.
There are many Child pages linked to the Index page and after login page, but for this clone following pages are made.
CART ITEMS
On this page we can add item in the cart for the purchase and proceed to the checkout page
DUNZO PARTNER
Product feature page
CHECKOUT PAGE
Razorpay Integration:
Search Module (backend dependency):
Product Pages & Key Features :
search functionality added.
There are some Key Features which are added in website clone such as :
Cart Content, Add and remove item from Cart.
Coupon Application feature.
Checkout Page with Payment Status.
Payment Mode Message. CART! PAYMENT!
Animated End Page added.
Razorpay payment integration Added.
Team Members and Contributors
Mayur Kamthe
- Github : github.com/mayur8600
- Email : mayur.kamthe62987@gmail.com
- Linkedin : linkedin.com/in/mayur-kamthe-0b2012157
Rupendra Singh
- Github : github.com/Mrrupendra
- Email : mr.rupendra11@gmail.com
- Linkedin : linkedin.com/in/rupendra-singh-6430ab16a
Naveen Kumar
- Github : github.com/Naveenverma440
- Email : naveenverma440@gmail.com
- Linkedin : linkedin.com/in/naveen-kumar-16ba9518b