https://github.com/ph0void/proyecto-dev-link
Proyecto de compartir enlaces publicos hecho con NodeJs y React con vite utilizando MongoDB
https://github.com/ph0void/proyecto-dev-link
jwt mongodb mongoose nextjs nodejs tailwindcss typescript
Last synced: 3 months ago
JSON representation
Proyecto de compartir enlaces publicos hecho con NodeJs y React con vite utilizando MongoDB
- Host: GitHub
- URL: https://github.com/ph0void/proyecto-dev-link
- Owner: ph0Void
- Created: 2025-09-12T00:26:52.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2025-09-12T00:51:04.000Z (10 months ago)
- Last Synced: 2025-09-12T02:58:52.132Z (10 months ago)
- Topics: jwt, mongodb, mongoose, nextjs, nodejs, tailwindcss, typescript
- Homepage:
- Size: 3.91 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🌐 Dev-Link (DevTree)
**Dev-Link** es una aplicación **full‑stack** para que desarrolladores creen y compartan su propio perfil profesional tipo *Linktree*, llamado **DevTree**.
Permite centralizar redes sociales, proyectos, portafolio, email y enlaces de interés, ofreciendo además controles de privacidad y personalización de perfil.
La solución está compuesta por:
- 🔹 **Backend (API RESTful)** con Node.js, Express y MongoDB.
- 🔹 **Frontend (SPA moderna)** con React, TypeScript y TailwindCSS.
---
## 📖 Descripción
El objetivo de **Dev-Link** es dar a los desarrolladores una **plataforma centralizada** para mostrar su identidad digital profesional de forma **elegante y práctica**.
Cada usuario crea su propio **DevTree**, con enlaces, datos de contacto e incluso foto de perfil, que puede compartir públicamente o mantener privado.
El sistema está dividido en:
- **Backend (DevTree API)**
API segura que gestiona perfiles DevTree, autenticación y almacenamiento de imágenes en la nube (Cloudinary).
- **Frontend (Dev-Link)**
Aplicación web moderna y responsive para gestionar, visualizar y compartir el perfil DevTree.
---
## 🚀 Tecnologías
### ⚙️ Backend
- **Node.js + Express** — API RESTful
- **MongoDB + Mongoose** — Base de datos NoSQL
- **JWT** — Autenticación segura
- **Cloudinary** — Almacenamiento de imágenes
- **dotenv** — Configuración de entorno
### 🖥️ Frontend
- **React + TypeScript** — SPA moderna y robusta
- **Vite** — Entorno de desarrollo ultrarrápido ⚡
- **TailwindCSS** — Estilos elegantes y responsivos
- **React Query** — Gestión eficiente de datos remotos
- **React Router DOM** — Navegación entre páginas
- **Lucide React** — Iconografía moderna
---
## ✨ Características principales
### 🔐 Autenticación
- Registro y login seguro con JWT
- Gestión de sesiones y control de acceso
### 👤 Gestión de Perfiles (DevTree)
- Crear, editar y eliminar perfiles DevTree
- Añadir enlaces a redes sociales, proyectos y portafolio
- Control de visibilidad pública/privada
- Subida de imagen de perfil en la nube (Cloudinary)
### 🌍 Visualización y Compartir
- Cada usuario obtiene un enlace único a su DevTree
- Vista pública del perfil para compartir en la red
### 🎨 Experiencia de Usuario
- Diseño **responsive** adaptado a desktop y móviles
- Interfaz moderna con TailwindCSS
- Navegación fluida usando React Router
- Gestión de datos y actualizaciones automáticas con React Query
---
## 📂 Estructura del Proyecto
```
Proyecto-Dev-Link/
│
├── backend-devtree/ # API RESTful con Node.js, Express y MongoDB
│ ├── src/
│ │ ├── controllers/
│ │ ├── models/
│ │ ├── routes/
│ │ └── services/
│ └── .env.example
│
├── frontend-devlink/ # SPA con React + TS + Tailwind
│ ├── src/
│ │ ├── components/
│ │ ├── hooks/
│ │ ├── pages/
│ │ └── service/
│ └── vite.config.ts
└── README.md # Este documento
```
---
## ⚡ Instalación y uso
### 🔹 1. Clonar repositorio
```bash
git clone https://github.com/ph0Void/Proyecto-Dev-Link.git
```
---
### 🔹 2. Backend
```bash
cd backend-devtree
npm install
cp .env.example .env # Configura variables de entorno
# Migrar y arrancar
npm run dev
```
Servidor en: **http://localhost:4000**
---
### 🔹 3. Frontend
```bash
cd frontend-devlink
npm install
npm run dev
```
Aplicación en: **http://localhost:5173**
---
## 📸 Imágenes
---
## 📊 Datos Técnicos
- Código modular organizado en **capas MVC** (backend).
- Buenas prácticas de separación de responsabilidades (frontend).
- Compatible con integración a otros clientes móviles o webs.
---
## 🔗 Enlaces
- 📂 **Repositorio**: [GitHub](https://github.com/ph0Void/Proyecto-Dev-Link.git)
- 🌐 **Demo**: [chat-demo.nelson.dev](https://chat-demo.nelson.dev)
- 🎥 **Video Demo**: [YouTube](https://youtu.be/demo-chat-app)
---
## 👨💻 Autor
**Nelson (ph0Void)**
🔗 [GitHub](https://github.com/ph0Void)