Skip to content

codespaces.md

Latest commit

 

History

History
105 lines (56 loc) · 4.07 KB

codespaces.md

File metadata and controls

105 lines (56 loc) · 4.07 KB

First-Time Codespaces Setup

Use this guide for first-time setup in GitHub Codespaces.

1. From a web browser, visit the Web CMS GitHub Repository page

https://github.com/NHSDigital/nhs-notify-web-cms

2. Click Code

Click the green <> Code button.

Click Code

3. Create Codespace on main

Click create code space on main

Create Codespace on main

4. Wait

  • a new browser tab should open
  • you will need to wait around 5 - 10 minutes

When it first starts it will look something like this. At it will say opening remote at the bottom left.

Codespace starting up

5. Launch workspace

You will see a box pop up bottom right notifying you there is a workspace file.

  • click the Green button to Open Workspace

Open Workspace button

6. Open parent git repository

Another box will pop up saying a parent git repository has been found. Click the Green Yes button to open it.

Parent repository dialog

An option should appear at the top of the screen, select the nhs-notify-web-cms repository.

Select repository option

Confirm it works

You should be able to run a live version of your changes before you submit them (via a Pull request) for updating the live content.

To do this, click the Run and Debug button, and then click the "Play" icon. Alternatively you can press F5 (warning, if you are not "clicked" in the window, it will refresh your page instead of launching the site).

  • click the run and debug button:

Run and Debug button

  • click the green "Play" button to the left of where it says Attach (NHS Notify

Play button

  • after a few seconds, you should see moving text at the bottom of the screen and it say server running

Server running message

  • a box should appear bottom right saying your application is running. Click the green Open in browser button

Open in browser button

  • a new browser tab will open (with a random address), this is live updating as you change the content of the site.

Live updating website

Make a preview change

  • In the previous browser tab, click on the file Explorer button to show the file list.

File Explorer button

  • Click on the pages folder, and then index.md. This will open the content of the home page.

Pages folder and index.md

  • you can now edit this page. To see a basic preview side by side, click the markdown preview button

Markdown preview button

  • this will open a preview to the right

Preview panel

  • If you now edit some text in the left, it will update in the basic preview on the right in real time. If you click File - Save (or Ctrl-S) this will save the file.

  • Saving the file will update the Full preview site in the other browser tab.

  • Open the other tab, and Press F5 to refresh the page.

Open existing Codespaces

  • You can reuse existing Codespaces that have been setup.
  • Visit https://github.com/codespaces to see a list of Codespaces
  • Active Codespaces are charged. Everyone gets 150 hours free per month.
  • Click on the three dots and then click stop codespace to change it to inactive
  • A stopped code space does not loose data
  • You can delete a Codespace, but this will loose any data that you have not pushed (published) to a remote git branch.