Skip to content

Instantly share code, notes, and snippets.

@speier
Forked from chrisjacob/README.md
Created September 1, 2011 18:53
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save speier/1186940 to your computer and use it in GitHub Desktop.
Save speier/1186940 to your computer and use it in GitHub Desktop.
QUICK setup Github Pages + Cloud9 IDE for HTML/CSS/JavaScript hacking

QUICK setup Github Pages + Cloud9 IDE for HTML/CSS/JavaScript hacking

GitHub + GitHub Pages

  1. Get a GitHub account: https://github.com/
  2. Github > Dashboard > New Repository ... https://github.com/repositories/new
  3. Enter a Project Name and Description; click "Create Repository"
  4. On the project page ignore the suggested setup instructions... instead click on the "Admin" button
  5. Check the "GitHub Pages" checkbox... You'll get a popup.
  6. Click the "Automatic GitHub page Generator" button.
  7. Choose a funky colour... or go safe with just white... then click "Create Page" button
  8. Your project now has only 1 branch "gh-pages" - there is no "master" branch (which is good in our case).
  9. Copy the "Your page has been created at" url; then click in the "click here to add a homepage" area and paste in the url. Also open your GitHub Pages page in a new browser tab/window to see the page that was auto-generated.
  10. Copy the SSH read+write GIT url e.g. git@github.com:yourname/projectname.git ... you'll need this in a minute for setting up Cloud9

Cloud9 IDE

  1. Get a Cloud9 IDE account: http://c9.io (sign up with same "username" as your github account. Then instant sign in with github!)
  2. In the Cloud9 Dashboard paste in your Git SSH url into the "Paste your GIT URL here" then click the "Start editing" button (the first time you do this you will have to jump through some hoops so GitHub can talk to Cloud9 via SSH).
  3. The Cloud9 IDE should open... double click on index.html file and make some edits. You can view these changes by clicking on the "preview" button in Cloud9 IDE.
  4. In the Cloud9 IDE console type git add . then git commit -m "first commit" then git push origin gh-pages

Go back to your GitHub Pages page and see the update you've made!

Final tidy up

Now in Clound9 IDE add a README.md file; enter some text e.g. the Github Pages url; you may want to also delete the auto-generated index.html file now... then add, commit, push.

Start hacking away. You're page is hosted for free on Github Pages; and you can access Cloud9 IDE from anywhere to make updates!

WIN!

^_^

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment