🔗 LinkUp

Simple Social Media Platform for Learning REST APIs with Node.js & Express

🚀 Live Demo • 📖 Documentation • 🐛 Report Bug • ✨ Request Feature

---

🌟 Introduction

LinkUp is a lightweight social media platform designed specifically for developers learning REST API development. Built with Node.js and Express.js, it provides a hands-on experience in creating, reading, updating, and managing posts through clean and intuitive interfaces.

🎯 The Problem

Learning REST APIs can be abstract and confusing without practical implementation. Many tutorials focus on theory but lack a real-world project that ties everything together.

💡 Our Solution

LinkUp offers a complete, working social media platform where you can see REST principles in action. Every feature is built around RESTful architecture, making it the perfect learning companion for backend development.

🚀 What Makes LinkUp Unique

• 🎓 Education-First: Designed specifically for learning REST APIs
• 📝 Clean Codebase: Easy-to-understand code structure for beginners
• 🛠️ Practical Learning: Real-world CRUD operations implementation
• ⚡ Lightweight: Minimal dependencies, maximum learning
• 🎨 Simple UI: Focus on backend without complex frontend distractions

---

✨ Features

🎬 Core Features 📝 Create Posts - Share your thoughts and ideas ✏️ Update Posts - Edit existing content seamlessly 👁️ View Posts - Browse all posts and view details 🛡️ Error Handling - Custom error pages for graceful failures 🎨 Dynamic Views - EJS templates for server-side rendering 🔄 REST Architecture - Following RESTful best practices

🛡️ Learning Benefits ⚡ Hands-On Practice - Real CRUD operations 🔍 API Design - Understand REST principles 🎯 Express Routing - Master route handling 📦 Template Engines - Work with EJS 🧪 Testing-Ready - Structure for easy testing 💻 Clean Code - Industry-standard practices

---

🏗️ System Architecture

graph TB
    subgraph "Client Layer"
        A[Browser] --> B[EJS Templates]
        B --> C[HTML/CSS UI]
    end
    
    subgraph "Server Layer"
        D[Express.js Server] --> E[Route Handlers]
        E --> F[Middleware]
        F --> G[Controllers]
    end
    
    subgraph "Data Layer"
        H[In-Memory Storage] --> I[Posts Array]
        I --> J[CRUD Operations]
    end
    
    A -->|HTTP Requests| D
    E -->|Process| G
    G -->|Render| B
    G -->|Data Access| H
    
    style A fill:#61dafb,stroke:#000,stroke-width:2px
    style D fill:#000000,stroke:#fff,stroke-width:2px
    style H fill:#47a248,stroke:#000,stroke-width:2px
    style B fill:#b4ca65,stroke:#000,stroke-width:2px

Loading

---

🛠️ Tech Stack

Category	Technology	Description
Backend		JavaScript runtime environment
Framework		Minimalist web framework
Template Engine		Embedded JavaScript templating
Architecture		RESTful API design pattern
Middleware		Request body parsing
Utilities		Unique ID generation

---

🌐 REST API Endpoints

Complete API Reference

Method	Endpoint	Description	Request Body
GET	/posts	Fetch all posts	-
POST	/posts	Create a new post	{ username, content }
GET	/posts/:id	Get specific post details	-
PATCH	/posts/:id	Update existing post	{ content }

Example API Usage

📋 Fetch All Posts

GET /posts

Response:

[
  {
    "id": "abc123",
    "username": "johndoe",
    "content": "Hello, LinkUp!"
  }
]

➕ Create New Post

POST /posts
Content-Type: application/x-www-form-urlencoded

username=johndoe&content=My first post!

Response:

{
  "success": true,
  "message": "Post created successfully"
}

🔍 Get Specific Post

GET /posts/abc123

Response:

{
  "id": "abc123",
  "username": "johndoe",
  "content": "Hello, LinkUp!"
}

✏️ Update Post

PATCH /posts/abc123
Content-Type: application/x-www-form-urlencoded

content=Updated post content

Response:

{
  "success": true,
  "message": "Post updated successfully"
}

---

📦 Installation & Setup

Prerequisites

• Node.js 14.x or higher
• npm or yarn package manager
• Git installed on your system
• Text editor (VS Code recommended)

1️⃣ Clone the Repository

git clone https://github.com/VAMSHIYADAV46/linkUp.git
cd linkUp

2️⃣ Install Dependencies

# Install all required packages
npm install

3️⃣ Project Structure

LinkUp/
├── views/
│   ├── index.ejs       # All posts view
│   ├── show.ejs        # Single post details
│   ├── new.ejs         # Create new post form
│   ├── edit.ejs        # Edit post form
│   └── error.ejs       # Custom error page
├── public/
│   └── style.css       # Stylesheet
├── index.js            # Main server file
├── package.json        # Project dependencies
└── README.md           # Documentation

4️⃣ Start the Server

# Development mode
node index.js

# Or with nodemon for auto-restart
nodemon index.js

5️⃣ Access the Application

Open your browser and navigate to:

http://localhost:8080

---

💻 Usage Guide

Getting Started

1. View All Posts: Navigate to the homepage to see all posts
2. Create Post: Click "New Post" button and fill in the form
3. View Details: Click on any post to see full details
4. Edit Post: Click "Edit" button on post details page
5. Update Content: Modify the content and save changes

Code Examples

Creating a New Route

// GET route to display all posts
app.get('/posts', (req, res) => {
  res.render('index.ejs', { posts });
});

// POST route to create new post
app.post('/posts', (req, res) => {
  let { username, content } = req.body;
  let id = uuidv4();
  posts.push({ id, username, content });
  res.redirect('/posts');
});

Updating with PATCH

// PATCH route to update post
app.patch('/posts/:id', (req, res) => {
  let { id } = req.params;
  let newContent = req.body.content;
  let post = posts.find(p => p.id === id);
  post.content = newContent;
  res.redirect('/posts');
});

---

📚 Learning Outcomes

What You'll Master:

🎯 REST Principles Resource-based URLs HTTP method semantics Stateless architecture Uniform interface

🛠️ Express.js Skills Routing and middleware Request/response handling Template rendering Error handling

💡 Best Practices Code organization MVC pattern basics RESTful naming conventions Clean code principles

Key Concepts Covered:

• ✅ CRUD Operations - Complete create, read, update workflow
• ✅ HTTP Methods - GET, POST, PATCH usage and differences
• ✅ Route Parameters - Dynamic URL handling with :id
• ✅ Request Body Parsing - Working with form data and middleware
• ✅ Template Rendering - Server-side view generation with EJS
• ✅ Error Handling - Custom error pages and graceful failures
• ✅ Middleware - Understanding Express middleware pipeline
• ✅ Redirects - Proper navigation after form submissions

---

🗺️ Roadmap

Phase 1: Core Features ✅

• Basic CRUD operations
• RESTful routing
• EJS template integration
• Error handling

Phase 2: Enhanced Features 🚧

• Delete post functionality
• Input validation
• Search and filter posts
• Pagination support
• Post timestamps

Phase 3: Database Integration 📋

• MongoDB integration
• Persistent data storage
• User profiles
• Post likes/reactions
• Comments system

Phase 4: Authentication 🔐

• User registration
• Login/logout system
• Session management
• Protected routes
• JWT authentication

Phase 5: Advanced Features 🎯

• Image upload support
• Real-time updates
• REST API documentation
• API rate limiting
• Comprehensive testing

---

🤝 Contributing

We welcome contributions from learners and developers! Here's how you can help:

How to Contribute

1. Fork the Repository

   git clone https://github.com/VAMSHIYADAV46/linkUp.git
   cd linkUp
   

2. Create Feature Branch

   git checkout -b feature/YourFeature

3. Make Your Changes

   • Keep code simple and readable
   • Follow existing code style
   • Add comments for complex logic
   • Test your changes thoroughly

4. Commit Your Changes

   git add .
   git commit -m "✨ Add YourFeature"

5. Push to Your Fork

   git push origin feature/YourFeature

6. Open Pull Request

   • Describe what you've added
   • Explain why it's useful for learning
   • Include screenshots if applicable

Contribution Ideas

• 📝 Improve documentation
• 🐛 Fix bugs
• ✨ Add new features
• 🎨 Enhance UI/UX
• 🧪 Add tests
• 📖 Create tutorials

---

📄 License

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

MIT License

Copyright (c) 2024 MEKALA VAMSHI YADAV

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction...

---

🙏 Acknowledgements

Special Thanks To:

• 🟢 Node.js Foundation - For the powerful JavaScript runtime
• ⚡ Express.js Team - For the minimalist web framework
• 📝 EJS Contributors - For the simple templating engine
• 📚 REST API Community - For API design best practices
• 🎓 All Developers Learning REST APIs - This project is for you!

Inspired By:

• Twitter - For simple post-based interactions
• Reddit - For community content sharing
• Dev.to - For developer-focused platforms

---

👨‍💻 Author

Mekala Vamshi Yadav

Full-Stack Developer & REST API Enthusiast

---

🔗 Project Links

• 🌐 Repository: https://github.com/VAMSHIYADAV46/linkUp
• 📖 Documentation: https://github.com/VAMSHIYADAV46/linkUp/wiki
• 🐛 Issue Tracker: https://github.com/VAMSHIYADAV46/linkUp/issues
• 💬 Discussions: https://github.com/VAMSHIYADAV46/linkUp/discussions
• 📚 Learning Resources: REST API Guide

---

⭐ Star this repo if you find it helpful for learning!

Built with ❤️ for Developers Learning REST APIs

Happy Coding! 🚀