Wilbert's website at SocSci

> jsPsych> 1 Hello World

jspsych/01hello.html 2020-03-30

Programming in JavaScript with jsPsych, Hello World

Start by downloading the jsPsych library. The most recent version can always be found on the GitHub releases page. Choose the file (in the assets section) that is called jspsych-a.b.c.zip with the highest numbers for a, b and c.

Make a new folder for your experiment. Make a subfolder named jspsych-6.1.0 or whatever version number you just downloaded. Use Notepad, or a better text editor (such as Notepad++) to make a file called index.html en make sure it contains the following text.

<!DOCTYPE html>
<html>
	<head>
		<script src="jspsych-6.1.0/jspsych.js"></script>
		<script src="jspsych-6.1.0/plugins/jspsych-html-keyboard-response.js"></script>
		<link rel="stylesheet" href="jspsych-6.1.0/css/jspsych.css">
		<link rel="icon" href="data:;base64,iVBORw0KGgo=">
	</head>
	<body></body>
	<script>
	hello = {
		type: 'html-keyboard-response',
		stimulus: 'Hello world',
		choices: jsPsych.NO_KEYS,
		trial_duration: 5000,
	}
	jsPsych.init({
		timeline: [hello],
	})
	</script>
</html>

Make sure your folder content looks like this:

When saving the document, make sure it has the precise name index.html and is encoded as UTF-8

You just made your first experiment in jsPsych. Congratulations. You can execute your experiment by clicking the index.html file in the file explorer. It will open your web browser and show the experiment.

Perhaps you can have a look at the jsPsych tutorials before you continue with the tutorial on how to save data.

next - Chapter 2, saving data