Building a Social Media App Using Next.js, TypeScript, Tailwind, Axios based on JSONPlaceholder API

แชร์
ฝัง
  • เผยแพร่เมื่อ 7 ก.พ. 2025
  • In this tutorial, we’ll build a fully functional social media app called SocialJSON using Next.js, TypeScript, Tailwind CSS, and Axios, powered by the JSONPlaceholder API. You'll learn how to fetch and display posts, users, and comments while designing a clean and responsive UI with Tailwind CSS. Whether you're a beginner or looking to sharpen your frontend skills, this project is a great hands-on experience!
    🔹 What You'll Learn:
    ✅ Setting up a Next.js project with TypeScript
    ✅ Fetching and displaying data from a REST API using Axios
    ✅ Styling components efficiently with Tailwind CSS
    ✅ Working with API endpoints for posts, users, and comments
    ✅ Pagination, search and animations
    ✅ Defining types and interfaces in TypeScript
    ✅ Applying the best practices and structuring your projects
    💻 Tech Stack:
    ✔️ Next.js
    ✔️ React
    ✔️ TypeScript
    ✔️ Tailwind CSS
    ✔️ Axios
    ✔️ JSONPlaceholder API
    🔗 GitHub Repository:
    👉 github.com/azi...
    🔗 API Endpoints:
    📌 Posts: jsonplaceholde...
    📌 Users: jsonplaceholde...
    📌 Comments: jsonplaceholde...
    📌 User: jsonplaceholde...{user_id}
    📌 User posts: jsonplaceholde...{user_id}/posts
    📌 User todos: jsonplaceholde...{user_id}/todos
    📌 Post comments: jsonplaceholde...{post_id}/comments
    🚀 Connect with me:
    My website: azizbecha.com
    GitHub: github.com/azi...
    LinkedIn: / azizbecha
    Facebook: / azizbechaa
    📢 Don’t forget to like, comment, and subscribe for more coding tutorials! 🚀
    📢Enjoyed this tutorial? Let me know in the comments if you want another one! Your feedback helps me improve. Looking forward to hearing from you! 🚀
    #NextJS #TypeScript #WebDevelopment #TailwindCSS #Axios #SocialJSON

ความคิดเห็น • 5

  • @youssefbenarbia1115
    @youssefbenarbia1115 วันที่ผ่านมา

    keep going 👏👏

  • @thecodebey6959
    @thecodebey6959 วันที่ผ่านมา

    صحيت عزيز ❤

  • @adamhajri1
    @adamhajri1 วันที่ผ่านมา

    Gj🙌👏👏

  • @TasnimeTeta
    @TasnimeTeta วันที่ผ่านมา

    👏👏👏👏

  • @3omarTN
    @3omarTN วันที่ผ่านมา

    keep up the great work