[WK4-T] Creating Strapi template (single type) and testing it, Git amend/force

1 Waking up

I thankfully woke up in time (6:50 ish), and went to gym (departed at 7:24), and came back (8:30) and showered to be on time for gym. And I had a Quiet Mind tea from T2, which, I don't personally enjoy drinking but I bought it so I'm drinking it anyways.

 

2 Making About Us Strapi template

This was the first ticket I was assigned that will 'do some changes' to the production environment (well, not until it is merged and is deployed, but you know what I mean).

2.1 Strapi

Strapi is a headless CMS. So you can think of it as an easy way to create a backend API through GUI. You can CRUD data through strapi graphical interface. Frontend is not included (unlike say Wordpress), hence why it is called 'headless CMS'.

2.2 Creating a template

Template ('type') is a data structure for a content kind. For example, we could have a template called 'News', which should have title (string), date created (date), content (long string). That's template. We create it because creating template automatically sets up an URI endpoint (say, <api-domain>/api/news that you can GET/POST etc to) for that News resource.

 

To do this, foirst go to Content-Type Builder. You can create either collection type or single type. The difference is that collection type allows URI to return an array of a template, whereas single type URI can represent only one instance of template. Using single type makes sense for creating about-us resource, since we only expect one data instance of about-us template.

 

Let's go to Content-Types builder and press 'create new single type':

Then, add fields. The black ones are 'component' which are aggregations of components that you define that you can reuse any place. In my case, we already had 'intro' and 'section' and 'seo', so I just reused it.

 

You can further do the following:

- Make component repeatable (here, we have repeatable 'section' component. see what implication it has for json data structure when queried)

- Make fields localizable:

- Make fields mandatory

 

2.3 Test strapi api with postman

We can create resources through strapi CMS GUI like so:

 

Remember strapi is running at a localhost port (if you chose to locally build it). Let's say we want to query it through localhost. We need to set up a user and a token so token can be recognised for authorisation.

Create a user called 'Website' (doesn't have to be 'Website'), and set its role as 'Authenticated'

Create a token called 'website-service-account-token' and set User as 'Website'

What we did here just then is to create a token (that you can query API with), and associated it with a user with the role 'Authenticated'. Now, to access API, we just need to use that token (website-service-account-token) as query parameter.

Something like that above. That nicely returns json like the following:

3 Revisiting Git 

It's surprising how little I know about git. I stick to our beloved 'add commit push', but there are more intricate commandes that we may look into using.

 

3.1 Workflow example with git

Example 1: I am in main/master branch. I want to commit my change to a new branch called ABC and push it to origin

git checkout -b ABC // create branch ABC and checkout that branch
git add -p // go through every diff and decide whether to stage those changes
git commit // will ask you to write commit message
git push // will give you error message saying to use git push --set-upstream origin ABC
git push --set-upstream origin ABC // will push it

Example 2: I made a small change from last commit and want to amend my last commit so that I don't create a redundant commit

git add -p // stage files that you created diff for
git commit --amend // make git know the staged changes are meant to be part of last commit
git push --force // make that amended commit the truth for last commit in remote origin

 

3.2 Some commands

1. Create a branch and switch to that branch

git checkout -b feature/DFD-547-create-single-type-for-about-us

Creates a branch ('-b') called feature/DFD-547-create-single-type-for-about-us and switches to that branch.

 

2. Check what branch I'm on

 git branch

shows something like this:

3. Check files that we can stage (stage is choosing files for commit before committing occurs)

git status

4. Stage files

git add -p 

See diffs and choose files for staging. (Use git add . for staging all the changes)

 

5. Commit with message written in vim

 git commit

It will tell you to write commit message in vim. Write message with i then :wq.

 

6. See recent commits

Git log shows the recent commits

 

7. Remind yourself how to push from one particular branch

git push

It will return messages like:

Which is really good since we can just copy that for push.