Adding a blog to your website shouldn't require building an entire content management system from scratch. blogjs makes the process simple by providing an API-first headless blogging platform that lets you manage content while keeping full control of your frontend.

In this guide, you'll learn how to create your first blogjs project, publish your first blog post, generate an API key, install the blogjs-space package, and display your blog content in your application.

What You'll Need

Before getting started, make sure you have the following:

  • A blogjs account
  • A JavaScript or TypeScript project
  • Node.js installed
  • Basic knowledge of JavaScript
  • A frontend framework such as Next.js, React, Vue, Astro, Angular, Remix, or Svelte (optional)

Step 1: Create Your First Project

After signing in to blogjs, create a new project. Every project has its own blog posts, categories, tags, team members, and API keys, making it easy to manage multiple websites from one account.

Choose a meaningful project name because you'll use this project to manage all of your blog content.

Step 2: Create Your First Blog Post

Once your project is ready, create your first blog post. Add a title, write your content, choose a category, assign tags, upload a featured image if needed, and publish the article when you're happy with it.

blogjs organizes your content so it's easy to manage as your blog grows.

Step 3: Generate an API Key

To allow your application to access published content, generate an API key from your project's settings. Your application will use this key when requesting blog data through the blogjs client or REST APIs.

Step 4: Install the blogjs Client

Install the official blogjs package from npm.

npm install blogjs-space

If you use Yarn, pnpm, or Bun, you can install the package using your preferred package manager.

Step 5: Connect to blogjs

Create a blogjs client using your API key. This client gives you access to your published blog content.

import { blogjs } from 'blogjs-space';

const client = new blogjs({
  apiKey: process.env.BLOGJS_API_KEY,
});

Step 6: Fetch Your Blog Posts

Fetching published blogs only takes a few lines of code.

const blogs = await client.getBlogs();

console.log(blogs);

The returned data can be rendered however you like using your own components and design system.


For more details, visit docs

Step 7: Display Blogs on Your Website

Since blogjs is a headless platform, you have complete control over how your content is displayed. You can create custom blog cards, category pages, search pages, author pages, or anything else that matches your application's design.

Supported Frameworks

blogjs works with any framework using the blogjs-space npm package.

  • Next.js
  • React
  • Vue
  • Astro
  • Angular
  • Remix
  • Svelte
  • Express.js
  • Node.js
  • Plain JavaScript

Why Developers Choose blogjs

  • Quick setup without building a CMS
  • API-first architecture
  • Easy integration with modern frameworks
  • Support for multiple projects
  • Team collaboration
  • Categories and tags
  • Ready-to-use themes
  • Simple SDK for fetching content

Best Practices

  • Store your API key securely using environment variables.
  • Publish content only after reviewing it.
  • Organize posts with categories and tags.
  • Use descriptive titles and SEO-friendly URLs.
  • Cache blog responses when possible for better performance.

What's Next?

Once you've successfully displayed your first blog posts, you can explore more advanced features like search, pagination, filtering by category or tag, custom themes, etc...

blogjs helps you spend less time building blogging infrastructure and more time building your product.

Conclusion

Getting started with blogjs is straightforward. Create a project, publish your content, generate an API key, install the official blogjs-space npm package, and start displaying your blogs in any modern JavaScript application. With its API-first design and flexible architecture, blogjs makes it easy to add a professional blog to your website without the complexity of building and maintaining your own CMS.