Production via Github Pages
The final step of building an experiment is making it publicly available online so you can share it with participants. One way to do this is to pay for web hosting (and a domain) where you would upload the files of your experiment.
Alternatively, we’ll run our experiment files via Github Pages, which is a free basic web hosting service provided by Github.
Update repository
Before setting up Github Pages, complete the following steps in your local repository.
Update the body of psy1903/docs/index.html so there are links to the main experiments we’ve built so far, including your project experiment. Example:
<h1>Projects</h1>
<ul>
<li><a href='projects/basics'>Basics</a></li>
<li><a href='projects/response-time'>Response Time Task</a></li>
<li><a href='projects/lexical-decision'>Lexical Decision Task</a></li>
<li><a href='projects/mrt-blocks-jspsych'>Math Response Time Task</a></li>
<li><a href='projects/your-project-title'>Your Project Title</a></li>
</ul>
This index.html file will act as the “homepage” for your site on Github Pages, so these links will act as a quick way to access your main experiments.
To confirm everything looks good and the links work, access this page via your local server:
With the above change in place, stage, commit, and push all changes from your psy1903 repository to Github so everything is in sync before proceeding.
Set up Github Pages for psy1903 repository
Visit Settings > Pages for your psy1903 repository on Github (https://github.com/your-username/psy1903/settings/pages).
Set the Branch to main and directory to docs/ as demonstrated in the following screenshot then click Save:
This will trigger GitHub to deploy your site. You can check the progress at https://github.com/your-username/psy1903/deployments.
When deployment is complete, you should see your site available via the URL https://your-username.github.io/psy1903/. There, you should see the same thing you saw when you tested your site locally, except it’s now running via Github Pages:
To test the saving of data, run through your Lexical Decision task experiment and confirm the results are sent to OSF.
Conclusion
After finishing the above steps, you should now have publicly accessible experiments that can collect data and save the results to OSF.io.
Moving forward, after making changes to your experiments locally, you will complete the stage/commit/push process to bring your Github.com repository up to date. Every new commit will trigger a re-deployment on your Github Pages site so your “production” experiments are kept up to date.