Upgrade to Pro — share decks privately, control downloads, hide ads and more …

React + gh-pages

React + gh-pages

A simple ReactJS blog page published on static Github pages!

I developed a simple web blog page with React and published it on Github. Since Github pages are static, it may not (at first) be easy to configure your files for development and production specific deployment. This showcase welcomes everyone to see what challenges I’ve encountered and what solutions I’ve come up with. Join the conversation and make us all wiser!

Presented on:
June 24th, 2016 - ReactJS Vienna Meetup

Timo Obereder

June 23, 2016
Tweet

More Decks by Timo Obereder

Other Decks in Programming

Transcript

  1. A simple ReactJS blog page published on static Github pages

    Timo Obereder Mobile(Android native)/Web Developer 24.June 2016 – React JS Meetup Vienna @defuex
  2. Introduction • Why React and static Github pages? § If

    no node server has to be used § If you don’t want to use e.g.: Jekyll § If you don’t want to use Gatsby J § Fast to configure § Easy to maintain and change for deployment on node servers. • What for? § Documentation, blog sites § Or in general small projects as interactive demo
  3. Configuration • Use react-static-webpack-plugin § No dynamic route paths (yet)

    § E.g.: <Route path=‘:id’ component={Post}/> • Only define client side content directly § e.g.: stylesheets, fonts, bootstrap or similar frameworks § No server side rendering on gh-pages
  4. Issues • Public path settings • Problems with react router

    § Nested routes § url “/about” could result in 404 • Including fonts and frameworks in correct manner