This is a Next.js web application, "Artify AI", built with React, Firebase (Authentication, Firestore, Storage), and Tailwind CSS. It allows users to share AI-generated art, edit photos (future feature), and interact with a community.
- Firebase Authentication: Secure sign-up and login with Google, Email/Password, and Phone (OTP).
- User Profiles: Customizable usernames and avatars.
- Post Creation: Share images with captions.
- Public Feed: Discover posts from all users.
- Real-time Likes: Like posts and see updates instantly.
- AI-Powered Features (Planned):
- AI Photo Editing
- Anime/Cartoon Image Generator
- AR Camera Filter
- Background Remover
- Clone the repository.
- Install dependencies:
npm install - Set up Firebase:
- Create a Firebase project at https://console.firebase.google.com/.
- Enable Authentication (Google, Email/Password, Phone).
- Set up Firestore database.
- Set up Firebase Storage.
- Copy your Firebase project configuration (apiKey, authDomain, etc.) into a
.env.localfile in the root of the project. See.env.example(if provided) or structure it like:NEXT_PUBLIC_FIREBASE_API_KEY=YOUR_API_KEY NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=YOUR_AUTH_DOMAIN NEXT_PUBLIC_FIREBASE_PROJECT_ID=YOUR_PROJECT_ID NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=YOUR_STORAGE_BUCKET NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=YOUR_MESSAGING_SENDER_ID NEXT_PUBLIC_FIREBASE_APP_ID=YOUR_APP_ID
- Run the development server:
npm run devThe app will be available athttp://localhost:9002(or the port specified inpackage.json).
- Next.js (React framework)
- Firebase (Auth, Firestore, Storage)
- Tailwind CSS (Styling)
- ShadCN UI (UI Components)
- Lucide React (Icons)
- TypeScript
src/app/: Next.js App Router pages.src/components/: Reusable UI components.src/components/artify/: Components specific to Artify AI features.src/components/auth/: Authentication related components.src/components/profile/: User profile components.src/components/ui/: ShadCN UI components.
src/contexts/: React context providers (e.g.,AuthContext).src/config/: Configuration files (e.g.,firebase.ts).src/hooks/: Custom React hooks.src/lib/: Utility functions.