/crowdfunding-product-page-main

Primary LanguageJavaScript

Forks Stargazers Issues LinkedIn


Logo
Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Roadmap
  5. Contributing
  6. License
  7. Contact
  8. Acknowledgments

About The Project

Design preview for the Crowdfunding product page coding challenge

Your challenge is to build out this crowdfunding product page and get it looking as close to the design as possible.

You can use any tools you like to help you complete the challenge. So if you've got something you'd like to practice, feel free to give it a go.

Your users should be able to:

  • View the optimal layout depending on their device's screen size
  • See hover states for interactive elements
  • Make a selection of which pledge to make
  • See an updated progress bar and total money raised based on their pledge total after confirming a pledge
  • See the number of total backers increment by one after confirming a pledge
  • Toggle whether or not the product is bookmarked

(back to top)

Built With

This section should list any major frameworks/libraries used to bootstrap your project. Leave any add-ons/plugins for the acknowledgements section. Here are a few examples.

(back to top)

Getting Started

To get a local copy up and running follow these simple example steps.

Installation

  1. Clone the repo 
    git clone https://github.com/your_username_/Project-Name.git
  2. Install NPM packages 
    npm install
  3. Start the application 
     npm start

(back to top)

Usage

This is page can be used as it is or serve as a referenc for the development of a crowdfunding project page

(back to top)

Roadmap

Project Development Project

  • created a component UI Hierarchy
  • Built a static version in react
  • Breakdown application functionality
    • state functionality requirement
    • Identified where the State would live
    • Identified the State of the project
  • Develop a concept Algorithm
  • implement component logic

Some Functionalities learnt and their tool and related concepts

Functionalities Concepts Tool
Display Modals Conditional Rendering, state , HOC React
Toggling Css Classes State React
Form Handling Controlled Input, Event Handling React

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Osarumwnese Nicholas Idukpaye - efeidukpaye@gmail.com

Be sure to connect with me on my Linkedin Account

Project Link: https://github.com/idnk2203/crowdfunding-product-page-main

(back to top)

Acknowledgments

Use this space to list resources you find helpful and would like to give credit to. I've included a few of my favorites to kick things off!

(back to top)