We have given the project to clone the official site of Unbounce.
Hey, we are learning Full stack Web Development at Masai School. During Unit 5 on this web development journey, we got a group project with our batchmates to clone the website of Unbounce, Canadian software company which produces landing pages for websites, and is the host of the annual Call to Action Conference. We have tried to clone the website in the time span of 5 days only.
- HTML
- CSS3
- JavaScript
- JSON server(Back-end)
This is the navigation bar where we have created a dropdown feature where the users can go to the templates, blogs, and login/signup pages.
This is the part of the homepage where the users can see the benefits for getting your business online and using the templates that are given.
There are two types of users where the users can login through credentials each login type has its own restrictions and benefits.
This is a signup page for the smart copy where the users have to fil out all the information that are required.
This is a blog page where the users can see all the blog realted to site and also we have provided a pagination on blog page.
It is template page where the users can see all the templates and able to filter the templates by two categories that are tools and type. They have more categories where the users can filter according to their needs.
On Clicking on View this template it will redirect to this page where the users can see the whole template and if they will click on make it your's then if user has logged in from Smart Builder account then he/she can use that template else it will redirect to the pricing page.
In this page users can select their plan according to their needs and also can choose the monthly or yearly plan through this toggle button.
This is a signup page for Smart Builder account, users can only login when they have the plans. There, users have to fill the neccessary details.
This is a payment page where the users have to fill all the personal details and Card details to pay the amount as they click on submit button a email confirmation code model will open on submiting the otp payment will be made and it will redirect to the home page.
- On the first day of the project, we have planned how will we going to start and who will going to do which part.
- We have divided the task wisely among the team members.
- We organized a meeting daily to know the progress and lagging if any.
Main Challenge was to do the work on time since one member was a working professional due to this we were lagging and another has his exams so he was also not participating too much. We have done it wisely by distributing their work to other members.
Learning technology is a different thing and showing what you have learned is a different thing. This project has given us the confidence to showcase whatever we have learned so far. This project also help us to learn those concepts, which can be gained only by practically doing, that can’t be taught during classes. Lastly, I would like to thank all the team members of the group who coordinate remotely and let the project go smoothly.
We have deployed the application on netlify and the link is below -Here is the deplyed link : https://clinquant-dolphin-aebed7.netlify.app