Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Strapi Headless CMS with React & GraphQL (Urdu/Hindi)
Rating: 4.3 out of 5(7 ratings)
152 students

Strapi Headless CMS with React & GraphQL (Urdu/Hindi)

Build a responsive blog & portfolio with Strapi, ReactJS, GraphQL, Apollo Client, REST API and Bootstrap
Created byFarhan Ellahi
Last updated 9/2026
Urdu

What you'll learn

  • Install, configure and run Strapi as a headless CMS for a real React project
  • Model content with the Strapi Content-Type Builder: collections, fields, UID slugs and media
  • Create relations (categories, tags) and use the Populate parameter in the Strapi REST API
  • Fetch Strapi data in React with the Fetch API, async/await and a reusable custom hook
  • Install the Strapi GraphQL plugin and write queries in the GraphQL Playground
  • Connect React to Strapi with Apollo Client and fetch posts using GraphQL queries
  • Build routing, single post pages and SEO-friendly slug URLs with React Router
  • Filter blog posts and portfolio items by category and tag
  • Design a responsive UI with Bootstrap: navbar, post grid, hero section and image carousel
  • Render rich text content from Strapi with React Markdown and finish a complete project

Course content

5 sections • 14 lectures • 2h 57m total length
  • Project Demo, Strapi Installation & Admin Configuration12:44

    See a demo of the finished blog/portfolio project, then install Strapi, create the admin user and configure the Strapi admin panel.

  • Strapi Content-Type Builder: Collections, Fields & Entries8:55

    Use the Strapi Content-Type Builder to create collection types and fields, and add your first posts and portfolio entries.

  • Strapi Relations & the Populate Parameter (REST API)9:49

    Connect content types with relations (categories, tags) and use the Populate parameter to get related data from the Strapi REST API.

Requirements

  • Basic HTML, CSS and JavaScript knowledge
  • Basic ReactJS (components and props) is helpful, but everything is explained step by step
  • A computer with Node.js and a code editor such as VS Code installed
  • No prior Strapi, GraphQL or backend experience needed

Description

Learn Strapi, the leading open-source headless CMS, by building a real project with ReactJS, GraphQL and Bootstrap — explained step by step in Urdu/Hindi.

In this hands-on crash course you build a complete, responsive blog and portfolio website. Strapi powers the backend and admin panel, React powers the frontend, and you fetch your content two ways: with the Strapi REST API and with GraphQL using Apollo Client. By the end you understand how a modern headless CMS project fits together, from content modelling to a finished website.

What you will build

  • A Strapi backend with posts, portfolio items, categories, tags, images and rich text

  • A React frontend with routing, a home page, post grid, hero section and single post pages

  • Category and tag filters, and SEO-friendly URLs using slugs

  • A responsive Bootstrap design with a navbar and an image carousel

What you will learn

  • Strapi: installation, admin configuration, Content-Type Builder, UID (slug) fields, relations, the Populate parameter and API permissions

  • REST API: fetching Strapi data in React with the Fetch API, async/await and a custom hook

  • GraphQL: installing the Strapi GraphQL plugin, writing queries in the playground and using Apollo Client in React

  • React: folder structure, hooks, React Router, conditional rendering and React Markdown

  • Bootstrap: navbar, rows and columns, responsive post grid, carousel and custom styles

Who this course is for

This course is for frontend and React developers who want a real backend without writing a server from scratch, for beginners in full stack development, and for freelancers who build content websites for clients. If you know basic HTML, CSS and JavaScript you can follow along — React basics help, but every step is shown on screen.

Why learn Strapi?

Strapi is a free, open-source, Node.js based headless CMS. It gives you an admin panel and a ready REST API in minutes (plus GraphQL through an official plugin), so you can focus on the frontend. It is used for blogs, portfolios, company websites, e-commerce catalogues and mobile app backends — a valuable skill for Jamstack and full stack web development.

The lessons are taught in Urdu/Hindi with clear, practical examples, and all the code is written live so you can build along with the instructor.

Enroll now and build your first headless CMS website with Strapi, React and GraphQL.

Who this course is for:

  • React developers who want a real backend without writing a server from scratch
  • Frontend developers learning headless CMS, REST API and GraphQL
  • Beginner full stack developers who want to build a blog or portfolio project
  • Urdu and Hindi speaking developers who prefer learning in their own language
  • Freelancers who want to build content websites for clients with Strapi and React