SecondBrain Frontend

This is the frontend for the SecondBrain app. It is built with React, TypeScript, Vite, Tailwind CSS, and Axios.

Backend repository: https://github.com/Rumman963/Second-brain

Overview

SecondBrain lets users save and organize useful links such as:

• videos
• images
• articles
• audio files

Users can sign in, manage their saved items, and share their brain publicly with a generated link.

Features

• user sign up and sign in
• dashboard with saved content cards
• filtering by content type
• add new content with title and link
• delete saved content
• public share link for a brain
• stop sharing option
• responsive layout for desktop and mobile

Tech stack

• React
• TypeScript
• Vite
• Tailwind CSS
• React Router
• Axios

Project setup

Install dependencies:

npm install

Run the app locally:

npm run dev

Build for production:

npm run build

Preview the production build:

npm run preview

Backend configuration

The frontend uses a backend URL defined in:

src/config.ts

Current value:

export const BACKEND_URL = "https://second-brain-backend-i9oi.onrender.com";

If your backend runs locally or on another host, update this value before running the app.

App flow

1. User signs up or signs in.
2. User adds content to their personal brain.
3. Content is shown in cards on the dashboard.
4. User can share a public brain link to another person.
5. Shared viewers can view the content without signing in.

Main folders

src/
├── components/
├── Hooks/
├── icons/
├── Pages/
├── App.tsx
├── main.tsx
├── config.ts
└── index.css

Notes

• The app expects the backend API to be available.
• If the backend is offline or the URL is wrong, requests will fail.
• The project is designed for frontend-only usage with the backend service already connected.

Deployment

This frontend is ready to deploy on platforms like Vercel or Netlify. The project also includes a Vercel config file for deployment support.