The document discusses Git, GitHub, and gh-pages for hosting static websites. It explains that GitHub uses the gh-pages branch by convention to host static sites, providing an example. The steps for hosting a static site on GitHub using a gh-pages branch are outlined. Additionally, hosting static sites on BitBucket or from any Git repository is discussed. Special conventions for hosting personal websites directly from a GitHub username repository are also covered. Examples of static sites hosted on GitHub are provided.

1. Git, GitHub and
gh-pages
Central California Java User Group
03/11/2016, Bitwise South Stadium, Fresno, CA
Csaba Toth

2. About me
 Csaba Toth csaba.toth.us@gmail.com,@tocsa2
 LinkedIn: http://www.linkedin.com/in/csabatothdev
 Polyglot full-stack developer (C++, Java, C#, Python)
 Full time remote developer of SportsBoard (WestShore Tech is
located in Sausalito, CA), living in Fresno, CA
 Plus has a consulting company
 Co-founder of Nashville JUG
 Founder of Central California JUG

3. Agenda
 Version control systems
 Distributed version control systems (vs centralized)
 Git
 GitHub
 gh-pages
 (Jekyll)

4. Version Control systems

5. Branching strategies

6. Branching strategies

7. Hosting static site on GitHub
 Perfect for static Twitter Bootstrap sketches
 Example: http://dealoround.com
 GitHub’s convention: gh-pages branch. Source
https://github.com/MrCsabaToth/DealORoundWebsite/tree/gh-pages
-> Site: https://mrcsabatoth.github.io/DealORoundWebsite

8. Hosting static site on GitHub
 Perfect for static Twitter Bootstrap sketches
 Example: http://dealoround.com
 GitHub’s convention: gh-pages branch. Source:
https://github.com/MrCsabaToth/DealORoundWebsite/tree/gh-pages
-> Site: https://mrcsabatoth.github.io/DealORoundWebsite

9. Hosting static site on GitHub
 Perfect for static Twitter Bootstrap sketches
 Example: http://dealoround.com
 GitHub’s convention: gh-pages branch. Source:
https://github.com/whateverify/Awesomeness/tree/gh-pages
-> Site: https://WhatEverify.github.io/Awesomeness

10. Steps
 http://blog.teamtreehouse.com/using-github-pages-to-host-your-
website
1. Create new repo
2. Add gh-pages branch
3. Pick Bootstrap template and customize or use Jekyll to generate
site
4. Commit the site to the gh-pages branch

11. Hosting static site on BitBucket
 Similar steps for BitBucket (+ can have 5 private repos for free!)
http://www.techrepublic.com/article/host-static-websites-for-free-
with-bitbuckets-git-feature/
 Any source commit means immediate effective deployment too
 Simple and easy to use
 You have automatic source tracking

12. Hosting static site from Git repo
 Leverage features of Git repo sites (issue tracking, etc)
 You can register a custom domain name and set the CNAME for
the DNS record
 Favicon
 There’s NO database backend and NO application server (PHP,
Java, ASP.NET)!
 You can also leverage Google Drive, but you will only have
limited change tracking

13. Hosting static site from Git repo
 Leverage features of Git repo sites (issue tracking, etc)
 You can register a custom domain name and set the CNAME for
the DNS record
 Favicon
 There’s NO database backend and NO application server (PHP,
Java, ASP.NET)!
 You can also leverage Google Drive, but you will only have
limited change tracking

14. Special: personal website
 Another naming convention: when you name the repository like
“username.gtihub.io”, this signals to GitHub that you want to
serve that repository as a static website when someone visits
username.gtihub.io
 In that special case the repository shouldn’t be in the gh-pages
branch, but it has to be in the master branch

15. Static websites examples
 One extra, which uses Google Maps and Synfusion’s radial
context menus: https://mrcsabatoth.github.io/RottenApples/
https://github.com/MrCsabaToth/RottenApples

16. Thanks for listening
 Questions?
 Csaba Toth
 Download: http://www.slideshare.net/tothc
 http://www.linkedin.com/in/csabatothdev