horticultural-exchange

This is an E-commerce website for public online shoppers interested in buying flowers and plant products.

Screenshot

Built with

• Javascript
• Javascript design patterns
• Node.js
• React.js
• Redux
• Amazon Web Services(AWS) S3 Storage
• Stripe
• JSON Web Token (JWT)

Live Demo link

Horticultural exchange deployed site

Getting Started

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

Prerequisites

• Install node.

Set up

• Clone the project.

• Cd into the project directory.

• Run yarn install or npm install to install dependencies in package.json.

• Run yarn start or npm start and view the page on your localhost.

• Clone and run the backend server locally.

Login

The user can login via the following roles:

• Admin: Can manage the stock(create and edit products on sale and categories), as well as users
• Moderator: Can manage the users
• User: Can view, add and remove items from wishlist and cart and purchase items in the shop.
• Guest user: Can view, add and remove items from wishlist and cart and purchase items in the shop. Guest user's session information is not persisted when the user logs out.

Available Credentials for Testing purposes

• Admin user role: email: "[email protected]", password: "password"
• Moderator user role: "[email protected]", password: "password"

Features

• A user can access the functions of an E-commerce plant shop application:
  • Display a list of available plant products for sale
  • Can view details about a selected plant in the details page
• A logged in user:
  • Can add and remove a desired plant from their wish list
  • Display a list of the logged in user's wishlist items
  • Can add and remove items from the cart
  • Can checkout out of the plant shop via Stripe

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

yarn start

Run the app in the development mode. Open http://localhost:3001 to view it in the browser.

yarn test

Launch the test runner in the interactive watch mode. See the section about running tests for more information.

Setup - Frontend

• Create a .env.development file in the root repository of the project and paste the following:

REACT_APP_REQUEST_OPTIONS_PORT=<apiPort>
REACT_APP_REQUEST_OPTIONS_HTTP_PROTOCOL=<protocol>
PORT=<port>

• Create a .env.production file in the root repository of the project and paste the following:

REACT_APP_REQUEST_OPTIONS_HOST=<host>
REACT_APP_REQUEST_OPTIONS_PORT=<port>
REACT_APP_REQUEST_OPTIONS_HTTP_PROTOCOL=<protocol>

How to use the site

Make sure the server is running

• Follow the links on the horticultural-exchange-website (or at http://localhost:3000/) in your web browser to access the available features.

• Making Purchases:

  • Payment is through Stripe. You can use the test credit card no. 4242424242424242 for testing purposes. For further details view Stripe documentation.

Deployment

This section has moved here: https://facebook.github.io/create-react-app/docs/deployment

Heroku Deployment with Docker

• Instructions can be found here.
• Container Registry and Runtime(Docker Deploys)
• You may have to disable the eslint plugin.

Deployment on cloud server

• Instructions can be found here

Fly.io

• Follow instructions in the Fly.io documention

Integration with Amazon Web Services(AWS) S3 Storage

• Open an account on Amazon Web Services
• Documentation on creating and using AWS S3 Buckets

Integration with Stripe payments

• Open an account on Stripe
• Documentation on using Stripe Payments

Contributions

If you see something wrong or not working, please check the issue tracker section, if the problem you encountered is not already in the opened issues, then open a new issue by clicking on the new issue button.

Author

👤 Marylene Sawyer

• Github: @Bluette1
• Twitter: @MaryleneSawyer
• Linkedin: Marylene Sawyer

Acknowledgements

• Stripe
• Amazon Web Services
• Microverse
• Freepik
• Unsplash images

Show your support

Give a ⭐️ if you like this project!

📝 License

This project is MIT licensed.