Skip to content

Latest commit

 

History

History
131 lines (72 loc) · 4.78 KB

README.md

File metadata and controls

131 lines (72 loc) · 4.78 KB
Raw

Clone of ZoomCar

Zoomcar is an Indian car sharing platform, headquartered in Bangalore. The company was founded in 2013 by David Back and Greg Moran.[2] It currently operates in 34+ cities.

🚀 About Me And This Project

Hi, My name is Shrikant, I'm currently studing in Masai School, learning full stack development and this project was built by me in cunstruct week to put all the skills in practice. This is the clone of ZoomCar and and I have improved the UI of some of the parts as there was in real website. like the login page, added several animations on the pages when user change the page to impove user interactivity.

Demo

https://zoomcar-clone-five.vercel.app/

Run Locally

Clone the project

  git clone https://github.com/ShrikantJawla/fabulous-vest-203.git

Go to the project directory

  cd my-project

Install dependencies

  npm install

Start the server

  npm run start

Below are some of the Screenshots:

  • HomePage asks user to enter city and it will pop up only when user has not updated city in his/her profile: App Screenshot

  • Home page without location-updater dialog box: App Screenshot

  • Some of the cards in HomePage: App Screenshot

  • Side bar without login: App Screenshot

  • Login page:-> it contain sign up fuctionality and all types of login providers like facebook and google and normal signIn, I used firebase to accomplish it. App Screenshot

App Screenshot

  • Pop up of google auth provider: App Screenshot

  • Side bar after user logged in: App Screenshot

Profile page after user Logged In,

  • Used Private routing so that user can open login page only after logged in App Screenshot

  • Dialog box to choose trip pick up and drop location: App Screenshot

  • You can see location on map while filling the input box, I wanted to also use pick up functionality on map but google has made that api paid now. App Screenshot

  • Host page: it will also open after logged in: App Screenshot

App Screenshot

Tech Stack

Client: React, Html, CSS, Styled-Components, Chakra-UI, Framer-Motion, Firebase

Lessons Learned

While I was creating this project I faced problem in performing all the CRUD operations in profile section.

  • In profile section if any user login on the website it displays the use info and best part is user can update his/her info and next time when user logs in again he will get all the last updated info on profile page as I am saving and updating the data directly on server just to imitate real functionality of updating profile of the users.

  • Included the animations while user change the page and even some parts of pages itself.

  • I learned several functions of Firebase while I was building this project.

  • Learned Styled-components, Chakra-UI, React-router-dom and some other libraries.

Authors

🛠 Skills

React, HTML, CSS, Styled-Components, Chakra-UI, Framer-Motion, Firebase

🔗 Links

portfolio linkedin

Other Information about me

🧠 I'm currently learning NodeJS, MongoDB, and ExpressJS

📫 Contact me:(email) shrikantjawla@gmail.com

Feedback

If you have any feedback, please reach out to us at shrikantjawla@gmail.com