RemoAI Main Frontend - Home Page again

Overview

The RemoAI Main Frontend is a modern, responsive web application built with React, TypeScript, Vite, and TailwindCSS. It serves as the primary user interface for interacting with RemoAI's suite of AI-powered tools and workflows. The frontend is designed for scalability, internationalization, and seamless integration with authentication providers.

Features

• Modern UI: Built with React, TailwindCSS, and Framer Motion for smooth animations.
• Authentication: Integrated with Privy for email, wallet, and Google login.
• Internationalization: Multi-language support using i18next.
• Responsive Design: Mobile-friendly and dark mode support.
• Routing: Client-side routing with React Router.
• Reusable Components: Modular structure for easy extension.
• Showcase & Blogs: Use case demos and blog content.

Folder Structure

main-frontend/
├── public/                # Static assets (images, icons, etc.)
│   └── images/            # App screenshots and illustrations
├── src/
│   ├── assets/            # Additional images, gifs, and SVGs
│   │   └── Usecases/      # Animated use case demos
│   ├── components/        # Reusable React components (NavBar, Footer, etc.)
│   ├── context/           # React context providers (e.g., LanguageContext)
│   ├── pages/             # Main page components (Home, Login, SmartApply)
│   ├── routes/            # App route definitions
│   ├── styles/            # Global and component CSS
│   └── ...
├── package.json           # Project metadata and scripts
├── vite.config.ts         # Vite build configuration
├── tsconfig*.json         # TypeScript configuration
└── README.md              # Project documentation

Main Pages & Routes

• / - Home: Landing page with banner, use cases, and blog highlights.
• /login - Login: User authentication via Privy.
• /SmartApply - Smart Apply: AI-powered job application workflow.
• /waitlist - Join Waitlist: Register interest for early access.
• /Blogs/Intro - Blog Intro: Featured blog content.

Visuals & Assets

• Main logo: public/MainLogo.png
• Screenshots: public/images/Home.png, public/images/ApplyforJob.png, etc.
• Animated use cases: src/assets/Usecases/FoodOrder.gif, AI.jpg, etc.

Getting Started

Prerequisites

• Node.js (v18+ recommended)
• npm or yarn

Installation

# Install dependencies
npm install
# or
yarn install

Development

# Start the development server
npm run dev
# or
yarn dev

The app will be available at http://localhost:3000.

Build for Production

npm run build
# or
yarn build

Preview Production Build

npm run preview
# or
yarn preview

Linting

npm run lint
# or
yarn lint

Environment Variables

Create a .env file in the root with the following (see .env.example if available):

VITE_PRIVY_APP_ID=your-privy-app-id

Tech Stack

• React (with hooks)
• TypeScript
• Vite (build tool)
• TailwindCSS (utility-first CSS)
• Framer Motion (animations)
• React Router (routing)
• i18next (internationalization)
• Privy (authentication)

License

This project is licensed under the MIT License - see the LICENSE file for details.

---

RemoAI Main Frontend — Modern, scalable, and ready for the future of AI-powered web apps.

The End!