R2D2 prototype for client-side.

• Click here to explore the live project. (deployed on render.com)
• Click here to access backend side.

The R2D2 client-side prototype utilizes React and React Router for client-side rendering. The app interacts with a Flask backend that communicates with the OpenAI API using Langchain. R2D2 employs Tailwind CSS for its UI and Redux Toolkit to store market research data in the store. Similar to a Google Chrome extension, R2D2 has the ability to personalize emails and offers CRM features along with marketing features. It's important to note that this project only covers a small portion of the actual R2D2 Google extension.

1. Make sure you have Node.js and npm (Node Package Manager) installed on your machine.
2. Create a new directory for your project and navigate into it using the command line.
3. Create a new file called package.json in the project directory and copy the provided dependencies and scripts into it. Save the file.
4. Open the command line and navigate to your project directory.
5. Run the following command to install the required dependencies:
6. After the installation is complete, you can start the client-side by running the following command:
7. The client-side of your application will start at localhost:3000 in your web browser. Make sure you have the Flask backend and OpenAI API set up and running properly for full functionality.

• @reduxjs/toolkit: A package for efficient Redux development.
• @testing-library/jest-dom: Custom Jest matchers for easier DOM testing.
• @testing-library/react: Testing utilities for React components.
• @testing-library/user-event: Simulates user events for testing React components.
• axios: Promise-based HTTP client for making API requests.
• formik: Form library for handling form validation, errors, and submission.
• react: JavaScript library for building user interfaces.
• react-dom: Provides DOM-specific methods for React.
• react-redux: Official Redux bindings for React to manage application state.
• react-router-dom: Routing library for React applications.
• react-scripts: Configurations and scripts for Create React App.
• tailwindcss: Utility-first CSS framework for rapid UI development.
• web-vitals: Library for measuring and reporting web performance metrics.
• yup: Schema validation library for form input validation.