/Posterz_Full_stack_WebApp

This is a full stack poster selling webapp developed using React(Frontend) , Strapi(Backend) , Stripe(Payment Gateway) , SCSS(Designing)

Primary LanguageJavaScript

Posterz_Full_stack_WebApp Demo

This is a full stack poster selling webapp developed using React(Frontend) , Strapi(Backend) , Stripe(Payment Gateway) , SCSS(Designing)

  • Demo Video - A comprehensive Demo of using our WebApp.

Posterz - Full Stack Poster Selling App

Posterz is a full stack application built with React, Strapi, SCSS, Redux, and Stripe payment gateway. The app allows users to browse and purchase posters. Below is an overview of the key features and technologies used in the development:

Features

  • User-friendly interface for browsing and purchasing posters.
  • Integration with Stripe payment gateway for secure and convenient payments.
  • Responsive design for a seamless experience across different devices.
  • Category-based navigation for easy exploration of poster collections.
  • Persistent cart storage using Redux and Redux Persist.
  • API integration with Strapi for managing content and providing RESTful endpoints.

Technologies Used

  • Frontend: React, React Router, React Icons, SCSS.
  • State Management: Redux, Redux Toolkit.
  • Backend: Strapi (Content Management System), SQLite (Database).
  • API Testing: Insomnia.
  • Image Upload: Cloudinary.
  • Payment Gateway: Stripe.

Installation and Setup

  1. Clone the repository.
  2. Navigate to the client directory and run npm install to install the frontend dependencies.
  3. Navigate to the server directory and run npm install to install the backend dependencies.
  4. Create a .env file in the client directory and add the necessary environment variables.
  5. Create a .env file in the server directory and add the required configuration variables.
  6. Start the client and server by running npm start in their respective directories.

Usage

  1. Access the application by visiting http://localhost:3000 in your web browser.
  2. Browse the available poster collections and click on a poster to view more details.
  3. Add posters to your cart and proceed to the checkout page.
  4. Enter the necessary payment information and complete the purchase using the integrated Stripe payment gateway.

Deployment

The application can be deployed to a hosting platform like Digital Ocean. However, please note that Digital Ocean is not a free platform and requires appropriate setup and configuration.

Feel free to reach out for any further assistance or inquiries.

Enjoy using Posterz!