Skip to content

Install and set up C3S

Peter Mesotten edited this page Sep 16, 2018 · 14 revisions

In order to get started with C3S, we have to go through a few steps:

  1. Download C3S and the C3S Quickstart site.
  2. Configure a virtual host for your website.
  3. Start C3S.
  4. Create a Prismic.io account, repository and content.
  5. Query content from the repository in your site pages.

Download C3S and the C3S Quickstart site

Configure a virtual host for your website

Add the following to your /etc/hosts file:

127.0.0.1      www.c3s-quickstart.com

Now create an application.properties file next to the location of your c3s.jar file with the following contents:

c3s.local.registry.www.c3s-quickstart.com.name=C3S Quickstart Site
c3s.local.registry.www.c3s-quickstart.com.type=WEB_SERVER
c3s.local.registry.www.c3s-quickstart.com.id=file:///Users/peter/playground/c3s/c3s-quickstart-site-master

Make sure the c3s.local.registry.www.c3s-quickstart.com.id value points to the folder that contains the c3s.json configuration file!

Start C3S

Start the application. Make sure you're using a JDK 1.8 or later.

$ cd /Users/peter/playground/c3s
$ java -jar c3s.jar

C3S should only need a few seconds to start up.

You should now be able to access http://www.c3s-quickstart.com:8080 in your browser! Also, you should be able to navigate between the Home and News pages.

Create a Prismic.io account, repository and content

Create a Prismic.io account and repository

  1. Go to https://prismic.io/create.
  2. Choose an email address and a password and click the "Create my repository" button.
  3. Fill out your first and last name and choose a project name (alphanumerics only).
  4. Choose the base language for your repository.

Create your first Prismic.io content type

  1. Click the button to create a custom content type.
  2. Click "Repeatable Type", choose a name (e.g. "News") and click the "Create new custom type" button.
  3. Drag over a "Key Text" field over from the list of field types on the right into the content type definition on the left.
  4. Choose a field name (e.g. "Title") and click the "OK" button.
  5. Click the "Save" button on the top right of the screen.

Create your first Prismic.io content item

  1. Click on the "Content" icon in the top left menu.
  2. Click the "New" button on the right.
  3. Fill out a value for your "Title" field and click the "Save" button in the top right corner.
  4. Click the "Publish" button in the top right corner and acknowledge by clicking the green "Publish" button again.

Query content from the repository in your site pages

Configure the content repository

First, we need to configure our repository inside the c3s.json configuration file of the quickstart site. Replace the c3s-quickstart prefix in the repositoryId with the alphanumeric repository name you chose in the previous step. If you forgot, check what's in the URL of your Prismic.io dashboard.

"contentRepositoryConnection": {
    "type": "PRISMIC",
    "repositoryId": "https://your-repo-name.cdn.prismic.io/api"
},

Query for content

If you've used different values for the content type (news) and field name (title), make sure to update pages/news.ftl of the quickstart site with the appropriate values:

<ul>
<#list api.query("news").findAll() as item>
    <li>${item.getText("title")}</li>
</#list>
</ul>

Go to http://www.c3s-quickstart.com:8080/news and you should see the field value of the item you've just created! Press the "e" key on the keyboard to enable inline editing mode: click on the "Edit" link next to a news item to redirect to the edit screen of the content item.

What's next?

We recommend that you check out the documentation in the sidebar on the right, so you can get a full grasp of the possibilities of C3S!