2019-05-01+Web+Designer+UK

(Brent) #1

Code a free site fast with Jekyll&GitHub




  1. Styling it up
    GitHub pages renders the sass files for us, so you
    can just build out as you normally would and then
    push your changes to master to publish them. No
    gulp files or Webpack here, just nice lean styles.




  2. Push to master
    Now that we have a working local site if we commit
    this and push it back to our repo GitHub Pages will
    render the site for us. If you have never pushed a
    GitHub repo then it is worth reading up a little bit for
    the purposes of this example type:




git add --all
git commit -m ‘First commit to jekyll site’
git push -u origin master



  1. Set up a free Siteleaf account
    You may want to just use a standard content
    management system to blog. Some designers prefer
    it to a text editor. Siteleaf offers a free account for
    developers, and this will give you interfaces to use.




  2. Connect to your repository
    After signing up for an account, you can then
    connect your repository to Siteleaf. Choose the
    repository and branch you set up earlier.




  3. Test updates via the CMS
    Now you have everything set up, try editing a post
    in Siteleaf. You’ll see how it syncs back to the GitHub
    repo, updating your website.




  4. Pull down changes
    If you now run ‘git pull’ in your terminal window, you
    will see the changes you made in the CSS updated
    into your local folder. You now have a two-way
    connection for developing your site locally or using
    a browser based CMS tool.




‘Modernwebdevelopment architecture based on
client—side JavaScript, reusable APIs, and prebuilt
Markup.’ — jamstack.org
You may be familiar with the term LAMPstack to
describe a traditional suite of technologies used
for building a website. With the JAMstack, we don’t
refer to specific databases or Operating Systems
but instead the three areas that come together. It’s a
new way of building websites and apps that can give
performance gains and also improve the security of
your site.

So why would you consider using a JAMstack
approach over a traditional website?
s*NQSPWFEQFSGPSNBODF Pre—built HTML and
assets and no databases make it perfect for using a
CDN resulting in super quick page loads.
s4FDVSJUZ JAMstack websites are incredibly secure,
there are no databases to worry about or in the case
of WordPress plugins to update or be exploited.
s$PTU As you can see in this tutorial you can run a
website for the cost of a domain name.

JAMstack Sites


Tutorials


18

19 20

tutorial _________________________________________________ 69
Free download pdf