Quick start

1. Download an example package

Save the example to a working folder. The rest of this guide assumes that the file is called questionnaire-standard.p2lrn.

2. Create an HTML page

Save this file as index.html in the same folder as the package. The first script load Player from CDN and the element <p2lrn-player> open the local course from that folder.

<!doctype html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>P2LRN</title>
  <script src="https://p2lrn.org/player/current/dist/p2lrn.js"></script>
</head>
<body>
  <p2lrn-player src="./questionnaire-standard.p2lrn"></p2lrn-player>
</body>
</html>

3. Open the folder in your editor and serve it over HTTP

Open the example folder in your usual text or code editor. So that the browser can load the package and its resources correctly, open the page from a local HTTP server instead of opening index.html directamente mediante file://.

1. Locate index.html and confirm that questionnaire-standard.p2lrn It is in the same folder.
2. Use your editor's preview or local server option, or any static HTTP server you prefer.
3. Open the local address provided by that server in your browser, usually based on localhost or 127.0.0.1.

You don't need a specific editor or extension; The important thing is to serve the folder over HTTP.

4. Check the result

The page should display the quiz within the Player. If it appears, you have already checked the essential path: loading the component, opening a package and running its contents from a web application.

5. Continue with the installation

The next step is Installation. The documentation first introduces CDN—the natural continuation of this example—and then NPM for projects that manage their dependencies through packages.