Quickstart Guide

Warning: contentstack-express framework has been deprecated. We will soon stop supporting this framework. Instead, we recommend using DataSync, which is faster and flexible than the web framework.

This quickstart guide will take you through the steps involved in creating your first web page using contentstack-express. contentstack-express is a Node.js web application framework based on Node.js Express, which provides a number of features for creating websites easily.

The steps to be followed are given below:

1. Create a stack
2. Create a Content Type
3. Create your first page
4. Set up publishing environment
5. Set up and connect contentstack-express
6. Publish Content

1. Create a stack

   A stack is like a container that holds the content of your site. To create a new stack, log in to your Contentstack account and click the + New Stack action button. Enter a suitable Name and Description (optional) for the stack.

2. Create a content type

   A content type is your page’s structure. Since we are planning to create a simple home page, the page will contain only a couple of fields: Title and Body. You can add/remove more fields depending on your requirements. Let’s look at a short video to learn the process of creating a content type (Home).

3. Create your first page

   You can create pages for your website by creating entries using the defined content type. To create your website’s home page , click the Home content type and add content in the given fields.

   With this step, we’re almost done with defining the structure and content of your site. Let’s now set up the publishing environment.

4. Set up publishing environment

   A publishing environment is your web server where you want to deploy your content. While you create an environment, click on the Advanced option, and select Deploy Content to Server(s) option to sync the published content on your web server.

5. Set up and connect contentstack-express

   1. Prerequisite You need Node.js v16 or later to use Contentstack.
   2. Install the CLI Run this command in a Terminal or command prompt to obtain and globally install the latest version of the framework on your system:
      $ npm install -g contentstack-cli   

      Note: You may need administrator privileges to perform this installation.

   3. Connect In the terminal, navigate to your workspace, and run the connect command.
      $ contentstack connect
      

      This will prompt you to enter the stack API key and Access Token. You can find these in the Stack details page.
      Enter your stack api key: {API_KEY}
      Enter your stack access token: {ACCESS_TOKEN}
      

      Note: We have stopped supporting Access Token for all stacks created after December 16, 2020. However, for stacks created before December 16, 2020, we will continue to support Access Tokens.

      This will validate the stack. Once validated, you will be prompted to enter the project root directory and select the publishing environment ("development") which we created in earlier steps.
      Enter name of the directory to contain the project: (my-site)
      Select the publishing environment: 
      1. development    

      This will automatically configure your project for the selected publishing environment along with the basic theme for the website. We are now ready to start the application.
   4. Start your application To start your application, simply navigate to your site development folder and start it using Node.js. In this case, the steps would be as follows:
      $ cd my_new_site
      $ npm start    

      We are done with setting up the publishing environment! However, your site’s home will throw a “404” error. This is because the content has not yet been published. Let’s publish the home page.

6. Publish content

   Go to the Home content type, and publish the entry on the “development” environment. Then, visit the page http://localhost:4000 in your browser to view the published content.

   Contentstack's web framework automatically applies the default page theme and design. To customize your page design, check out the Theming guide to customize your page design.

Contentstack provides Postman collections of our Content Delivery, Content Management, and GraphQL APIs which will help you to get started with the APIs and try them out through the Postman client. To get started with the the Postman collections, download the latest version of the Postman collection(s) and the Postman app, set your Contentstack account-specific values in the collection environment, and try out our APIs with ease.