Giter Site home page Giter Site logo

itsvikasdwivedi / rodan-fields-clone Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 1.0 1.28 MB

Rodan & Fields, LLC, known as Rodan + Fields or R+F, is an American multi-level marketing company specializing in skincare products. Katie Rodan and Kathy A. Fields, creators of Proactiv, started the Rodan + Fields brand in 2002 and sold it a year later.

CSS 34.41% HTML 20.00% JavaScript 45.59%
css heroku html javascript json-server netlify

rodan-fields-clone's Introduction

image

Introduction

Hello, we are learning MERN Stack at Masai School. During our Unit-5 on this web development journey, we got the group project with our batchmates to clone the website of rodan and field. We have tried to clone the website in the time span of 1 week only.

Tech Stack Used

  • HTML5
  • CSS3
  • JavaScript
  • Bootstrap

Home Page

  • We have created the navigation bar which has dropdown menu on hover.
  • The Homepage of rodan and field website shows the various skin products

image

  • User can see Navbar on the top section, some static information on middle part and at the bottom of the page there is a footer which we have build so far in this page.
  • We have also included the responsiveness to our site for all the screens

image

Login Page

  • On the home page there is a option of profile icon clicking that icon will redirect the user to the login page.
  • In the login page email id will be asked and then proceed to the otp page.

image

  • We have also include the feature of resend otp on the otp page.

Product Page

  • After successful login, user will be shown all the products to choose. Choosing the product will redirect the user to the payments page
  • it also has the filter that can we applied seperately and simultaneously too.

image

  • On the payment page user will be asked to fill the basic payment details i.e, card number, expiry date and CVV
  • After filling the basic details, the user will be given the otp and submitting the otp will make transaction successful and redirect the user to the Cricbuzz Plus page

Roles and Responsibilities

  • On the first day of the project we have decided the role of every member in the team.
  • We have divided the task wisely among the team members.
  • We organise a meeting daily to know the progress and error if any.

Challenges

  • Main challenge of the whole project was to avoiding conflicts of the name of the variable, class, id name. We have solved it wisely.
  • second challenge was to merge the different files in the same final folder.

Conclusions

learning a technology is a different thing and showing what you have learnt is different thing. This project has given us the confidence to showcase whatever we have learnt so far. This project also help us to learn those concept that can't be taught during class. Lastly I would like to thank all the team member of the group who coordinate remotely and let the project go smoothly.

๐Ÿ”— Team members

Vikas Dwivedi

  • portfolio
  • linkedin
  • twitter

Muntazir Ansari

  • portfolio
  • linkedin
  • twitter

Shakti Modak

  • portfolio
  • linkedin
  • twitter

Gulshan Sharma

  • portfolio
  • linkedin
  • twitter

rodan-fields-clone's People

Contributors

gulshan7777 avatar itsvikasdwivedi avatar mdansari20101 avatar shakti8210 avatar susantsahu020 avatar

Watchers

 avatar

Forkers

mdansari20101

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.