Building the clone of the Groww Website.

Description

This project involves around trading platform, Where a user can find details about various companies which are enlisited on national

stock exchange and find details about companies providing ipo, From this platform user can invest into multiple stocks and mutual funds.

Hello there, you might have seen the Groww Website, where investors can trade and invest in Stocks and Mutual funds..

Moving ahead, we team 19 at Masai School developed a clone of the website of Groww within a week as a part of our curriculum.

This blog is all about our journey and the challenges we faced while building the project.

What was our problem statement and how did I approach it:-

So we had a problem statement that we have to create a clone of a website called groww.com . Also, We can only use my HTML, CSS, and core JavaScript knowledge. We were three members in our group.

Some Snapshots of our project that we made:-

we just have to add images

- Landing Page:-

This is the Landing page when the user enters the website for the first time this page will show up.

- Signup page:-

-Products:-

How We divided the work in our Team members:-

As we were five members in our team so it was very important to decide how we will approach the work so that

in the future we should not face any problem in merging the code, as well as the tasks, get divided into equal

parts.So, on the first day, As a team leader, I made a git repository and everyone was told to make their separate

git branch by cloning the repo and push their work there and when they feel that they have completed it.They can show

it to one of the members(team leader) and after the approval, they can merge their code to the main branch.I was mainly

responsible for making the Product page and navigation bar and script part which are similar on all the pages.

And my other team members were responsible for the login page, landing page, and Cart page and make the page look better.

The outcome and important learning from the project:-

This entire journey of making the project was awesome. We learned lots of things by applying to the real website and

it gave us a lot of confidence. Although we could have done more such as we could have added a timer and there were some

more functionalities that could have been done, yeah the time didn't permit us to go further. But we will surely improve it

Technology used:

HTML

Used to build the basic structure of the cloned site. All the headings, paragraphs, links, forms, etc were structured by HTML.

CSS

Used to add styling to our structure. Background images were used to make the website identical. Also, Grid and Flex boxes

were used along with the media queries to make the pages fully responsive.

Javascript

Used to add logical functionalities to the page like Onscroll functions login and signup carts

and price calculation, animations and also to make the dynamic aspect of the website.

Mongo Atlas

MongoDB Atlas is a cloud service by MongoDB

Express

Express is a fast, assertive, essential and moderate web framework of Node.js.

Note:

All the image and icon links have been taken from the main website (Groww.com) and some other internet sources

and may be subject to copyright. So, try not to use the images or icons for business purposes or reproduce them without

prior approval from the owner. The images and icons used here are just for making this project and for learning purposes.

Vishal-080/Groww_Clone