-
Homepage - gives a user an idea of what the website is about, about BARS organization, ability to get get more information about adoption, or getting involved in rescuing animals. It also gives three random profiles of animals currently waiting fo adoption. At the bottom of the page using 'NEEM CONTACT OP MET ONS' user can write at email to PETPLAATS.
-
Adoption page - gives a user adopting options: dogs and cats. By clicking on one of the option user will be redirected to the Pet List page, the list with animals from the chosen option. It also gives user full information about adoption procedure.
-
Pet List page - show the list of profiles (cats or dogs), user is able to filter animals according to their size, age and gender. By clicking on any profile, user is going to be redirected to Pet Details page.
-
Pet Details page - gives user information about the pet and ability to contact PETPLAATS.
-
Who We Are page - tells user what is the team of PETPLAATS, their mission and goals.
-
ABNI page - explains the objects of foundation and its policy.
-
Volunteer - gives user information about how to come a part of PETPLAATS and what kind of help the can contribute.
-
Donation page - gives user 6 options of donation. Each option explains what for donated money are gonna be used for. User can choose more than one option and checkout.
-
Foster - tells user what is needed from a user to become a foster parent.
Checkout test data:
Cart Number: 4242 4242 4242 4242
MM/YY: 12/23
CVC: 123
https://petplaats-test.herokuapp.com/
To get started you can simply clone the repo and install the dependencies in the root folder
Steps:
Install: npm install
Run: npm run dev
Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
ES6 + Features
Arrow Functions
Template Literals
Block-Scoped Variables Let and Const
async await with try/catch
Spread operator
Modules export/import
styled-components
materia UI icons
react-router-dom: The router components of react
axios: to make HTTP requests
nodejs: JS runtime for backend
express: server/web framework for nodejs to create server
mongoose: mongodb database library for nodejs
stripe-checkout: payment