Loading

Create A Static Tech Site

qijie

This is a live streamed presentation. You will automatically follow the presenter and see the slide they're currently on.

Create A Static Tech Site

jackyqi@tencent.com

2019-03-29

Category

  • Background: SSG
  • Gatsby: Structure and ECO
  • When Netlify Appear

Background: SSG

SSG:  Static Site Generator

Separate by:

Language

Templates

JAMstack

JAMstack: Javascript + Api + Markup stack

Is page-maker A JAMstack Project?

What's Gatsby

Gatsby is a free and open source framework based on React that helps developers build blazing fast websites and apps

Work Flow:

Gatsby Feature

Tech stack: react + webpack + js + css

Data source: anywhere throuth GraphQL

Deploy: anywhere support static site

PWA: Static Progressive Web App

Practise: Local

>npm install -g gatsby-cli
>gatsby new techblog https://github.com/gatsbyjs/gatsby-starter-blog
>cd techblog
>gatsby develop

GraphQL

PWA

When Netlify Appear

  • developer friendly
  • version control
  • custom domain
  • cdn
  • https
  • preview

Practise: Delopy

1. make a new git rep

2. create a netlify site

3. connect github and netlify

4. deploy the blog site

First time

Then

Just write article

All Resources

github

腾讯云

markdown

netlify

graphql

react

webpack

letsencrypt

ssh

node

npm

git

gatsby-plugin-*

gatsby-remark-*

gatsby-transform-*

gatsby-source-*

typography

Thank You, Bye!

Made with Slides.com