Create A Blog On Your Mobile Phone Part 2
Tags: git, serverless, startup, codenewbie
Published: 2021-02-15 05:30:54

---
title: Create A Blog On Your Mobile Phone Part 2
published: true
date: 2020-12-21 00:00:00 UTC
tags: git, serverless, startup, codeNewbie
canonical_url: https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/
---

Hello dear reader and welcome to the second part of this web series on how to create a website or blog right from your mobile phone.

# Quick Recap

Like i said this is the second part of this series, incase you missed the first part you can always go back and read it here:   
   
[Create a blog on your mobile phone part 1](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone/).   
Talking about reading the other article, You should really read that article up as this one is just building on what we learned in the orther article

We learn't a few and very essentials things though:

1. concept of mobile blogging
2. how to create a free website/blog
3. how to clone your website/blog to your mobile phone
4. and quit a all lot of other things
  
Don't just take my word for it, you should read it up yourself.

## Requirements

Before you continue on this tutorial you should have at least a basic knowledge of the things listed below

1. HTML
2. How the web works (refer to part 1)

Yep thats all you will be needing for this part of the series...

### Welcome to jekyll

If you are the curious type like me, you would have asked yourself, what is **JEKYLL**

#### What really is Jekyll?
<blockqoute>
<a href="https://jekyllrb.com/">Jekyll</a> is a static site generator. it takes text written in your favorite markup language and uses layouts to create a static website. You can <b>tweak the sites's look and feel</b>, URLs, the data displayed on the page and more 
</blockqoute>

From the defination you get the idea... Jekyll is just plain html text that are converted to static website's.   
Well **static** is the opposite of **Dynamic** , think of jekyll as the opposite of Dynamic websites built on WordPress and other dynamic websites...   
of course being static is one of the features i like about jekyll, being static means your pages load super fast, no third party content(You own your contents and codes), and easy set up and customization, like you create a website with just Html, Css and js, Jeez how super fast is that...

In addition to all it's other cool features and plugins, it also uses the **Shopify Liquid:**   
**Lquid** is an open-source template language created by shopify and written in Ruby.   
  
Did i also mention that jekyll and github are completely free?   
Yep they sure are.

##### Resources to learn jekyll

you can learn all about jekyll and liquid from the below links

1. [jekyll official documentation](https://jekyllrb.com/docs/)
2. [liquid official documentation](https://shopify.github.io/liquid/basics/introduction/)

###### Intro to git 

What is git?   
  
Git is a distributed version-control system for tracking changes in any set of files... and so on

Basically git is just meant and used to **commit** , pull and **push** changes to your **remote repository**

A lot of terminologies used here, dont worry about that, you will soon see them in action very soon, but before then let me introduce you to what they are and how they are connected to creating a site on your mobile phone

1. **COMMIT:** this command is used to save your changes to your local repository (the site you cloned to your mobile phone in the part 1 of this series)
2. **PUSH:** this command is used to push(as the name implies) all the files you have commited to your remote repository
3. **REMOTE REPO:** This is a common repository that all team members use to exchange their changes. This repository is stored on a code hosting service like Github(That's where github comes in)

###### Conncecting the dots...

You may be wondering, how does this have to do with blogging from mobile phone...   
well from the explanations above, you only need two things

1. Remote Repository
2. A place to run Git commands from

you already have a remote repo, so you shouldn't worry about that, what i will introduce to you is **how you can execute git commands on your mobile phone**

###### I guess we are done talking...

Too much talk and explanations (I really hope you get the idea), now lets stop talking and start showing how things work

Go ahead and lunch your spck editor, [[The one you downloaded on the previous post]](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-with-jekyll-on-github.html)

![Jekyll project on spck editor](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-preview.png)<figcaption>
    Your cloned project should look like this
  </figcaption>

Now its time to upload your own contents   
   
Scroll down to the images folder and select it

![Jekyll image folder in spck editor](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-img.png)<figcaption>
   Image folder looks like this
  </figcaption>

Click on the three dots(menu of the image folder),and click on Upload File

![Jekyll upload image in Spck editor](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-img-upload.png)<figcaption>
    Click on upload file
  </figcaption>

Now upload a loving photo of your self, or your website logo..   
Now its time to edit the config file and customize the site to display your own info

Now close your image folder and look for and open the file called   
**\_config.yml**   
when you open it, you should see something like this below

![Jekyll Config file in spck editor](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-config.png)<figcaption>
    Your config file looks like this
  </figcaption>

basically anything you edit here affects your site drastically, so be careful of what you touch in here

First thing you should change is name, in your config file change your name

```

name: your name
#Change it to the name you want to use
#name: Spruce

 
```

Change the description too

```

description: web developer from somewhere
#Change it to anything you want, just dont make it too look (seo issues)
#description: web developer based in Edo, Nigeria

 
```

Do you remember the image you uploaded? yep you do, its time to use it. From the [Getting Started With The Web](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web) you read in the first part of this series i assume you now know how the web work...

```

avatar: https://....
#Change it to the file you uploaded earlier
avatar: /images/spruce.jpg #in my case

 
```

Edit your footer links, add your social media liks to the footer links

```

footer-links:
  dribble: dribble username
  email:
  facebook:
  ..... etc

 
```

Change your url to your site url

```

url: github-username.github.io
#where github username is changed to your username
url: sprucestatic.github.io #in my case 

 
```

**Note:** Leave the baseurl feed empty if your site is "github-username.github.io", but if your site is "github-username/static-site-name" add "/static-site-name" to the baseurl   
 but if you have followed this series from the beginning please leave baseurl empty... 

Now its time to use the Git commands we explained before now   
in the **spck editor**   
   
Click on the last fork icon at the bottom of the editor

![fork icon in spck editor](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-fork.png)<figcaption>
    Click on the last fork icon to your right
  </figcaption>

Once you have click on the fork icon, you should see something that looks like the one below

![Spck editor commit](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-commit.png)<figcaption>
    Click on the commit all
  </figcaption>

the next steps are easy

1. Click on Commit All
2. Enter commit Message

You can enter anything in your commit message, but that dosen't mean you should just write a bunch of anything you think of, a commit message should briefly explain the changes you made to your project.

Remember from our defination of commit, it just save the changes to your local computer, in our case your mobile phone, that is the changes wont reflect on the web just yet, Now that is where **GIT PUSH** comes in the picture... Push as the name implies pushes your saved commit to your remote repo (the one hosted on github) so that people can view it on the web.

As you might have noticed, editing, uploading and committing to your cloned project dosen't require any data Connection. But when pushing your changes, you need a data connection, So go ahead and switch on your data connection and follow the below steps

To push your changes follow this steps:   
  
1. Click on the last fork icon again
2. Click on push
3. Click Ok

![Spck editor Git push on mobile](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/project-pushing.png)<figcaption>
   Wait for it to push your changes
  </figcaption>

Boom and there you go, your websites should be live with your changes on the web in a minute...   
Go ahead and preview your website

![Mobile Preview of your free website](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/preview-mobile.png)<figcaption>
    On mobile phone your site looks like this
  </figcaption>

![Web Preview of your free website](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone-part-2/img/preview-web.png)<figcaption>
    On a pc your site looks like this
  </figcaption>

Well thats the end of this part of the series... Next stop is **Blogging** , Thanks for reading...

###### Previous parts of this series 

[Create a blog on your mobile phone part 1](https://spruce.com.ng/blog/create-a-blog-on-your-mobile-phone/)