https://github.com/pushpakrai/linkstack
LinkStack is a full-stack Linktree clone built with the MERN stack (MongoDB, Express.js, React.js, and Node.js). This web application allows users to create, manage, and organize their collection of links, providing a personalized, intuitive platform to showcase their online presence or business offerings.
https://github.com/pushpakrai/linkstack
Last synced: 17 days ago
JSON representation
LinkStack is a full-stack Linktree clone built with the MERN stack (MongoDB, Express.js, React.js, and Node.js). This web application allows users to create, manage, and organize their collection of links, providing a personalized, intuitive platform to showcase their online presence or business offerings.
- Host: GitHub
- URL: https://github.com/pushpakrai/linkstack
- Owner: pushpakrai
- Created: 2024-12-30T19:02:48.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-04T17:32:40.000Z (over 1 year ago)
- Last Synced: 2025-02-26T11:28:54.748Z (over 1 year ago)
- Language: JavaScript
- Homepage: https://linknest.onrender.com/
- Size: 461 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🚀 **LinkStack**
LinkStack is a full-stack Linktree clone designed for users who want a personalized and customizable way to organize and display their links in a centralized location. Built with the robust MERN stack (MongoDB, Express.js, React.js, Node.js), this tool allows seamless integration of personal or professional links into one easily accessible platform.
### **Key Features:**
- **Customizable Link Management:** Effortlessly create, edit, and reorder links.
- **Drag-and-Drop Functionality:** Easily organize links with visual drag-and-drop interaction.
- **User Authentication:** Secure token-based sessions for user data protection.
- **Responsive Design:** Optimized for all screen sizes for a seamless user experience across devices.
Designed to demonstrate cutting-edge development techniques, LinkStack showcases proficiency in **React.js**, **Tailwind CSS**, and **Node.js**. The robust backend leverages **MongoDB** for scalable data management and ensures reliable performance. Adherence to secure coding practices guarantees the platform’s security and scalability.
🔗 **Live Demo:** [LinkStack](https://linknest.onrender.com/)
---
## 🛠️ **Features**
- **Personalized Link Management:** Add, edit, and reorder links quickly.
- **Drag-and-Drop Interface:** Visualize and organize links with ease.
- **Token-Based Authentication:** Secure access with JWT token authentication.
- **Mobile-Responsive:** Optimized for seamless experiences on any device.
---
## 💻 **Tech Stack**
### **Frontend**
- 
- 
- 
Additional Libraries: **React Beautiful DND**, **React Toastify**, **daisyUI**, **SweetAlert2**
### **Backend**
- 
- 
- 
- 
### **Testing**
- 
- 
### **Deployment**
- 
---
## 🚧 **Getting Started**
### **Prerequisites**
| Requirement | Version |
|-------------|---------|
| [Node.js](https://nodejs.org) | `^18.17.0` |
| npm (comes with Node.js) | `^9.7.1` |
### **Installation**
1. **Initialize the project:**
```bash
mkdir LinkNest
cd LinkNest
git init
```
2. **Clone the repository:**
```bash
git pull https://github.com/pushpakrai/LinkStack
```
3. **Install backend dependencies:**
```bash
cd backend
npm install
```
4. **Create a `.env` file in the backend directory:**
```env
MONGODB_URI=
TEST_MONGODB_URI=
PORT=
ACCESS_TOKEN_SECRET=
REFRESH_TOKEN_SECRET=
```
5. **Install frontend dependencies:**
```bash
cd ../frontend
npm install
```
### **Running the Application**
1. **Start the backend server:**
```bash
cd backend
npm run dev
```
2. **Start the frontend client:**
```bash
cd ../frontend
npm run dev
```
3. Open the app in your browser at:
```
http://localhost:3000
```
---
## 📜 **License**
This project is licensed under the [MIT License](LICENSE).
---
## 📝 **Disclaimer**
This project is inspired by **Linktree** but developed independently as a personal project. It is not affiliated with or endorsed by Linktree.
---
This streamlined version provides clarity and highlights key elements of the project in a professional format. Let me know if you'd like any further enhancements!