Your data stays on your device: storage, export, your own key

Local-first is an approach in which data belongs to the person and is kept on their own device, for example in the browser’s IndexedDB, rather than on a server.

The textbook has no server for your data

Most sites you have learned from kept your progress themselves: you made an account, and everything lay on their server. Here it’s different. The textbook is a set of pages that the browser downloads once. Everything you do, your answers, your cards, your brief and your code, the browser writes down on your own device, in storage called IndexedDB. It’s a database built into the browser: a site can put a lot of information there, and it stays after you close the tab.

That’s the upside. There’s no sign-up, nobody watches what you do, and your data goes to no one and can’t leak from someone else’s server. This is called the local-first approach: the data belongs to the person and lives with them.

Check yourself: where is your progress kept?

In your browser, on your device. It doesn’t go to the textbook’s server.

The price: a single copy

If the data lives only with you, keeping it safe is also only up to you. It will be lost if:

• you clear the site’s data in the browser’s settings;
• you move to another computer or browser, because the storage there’s different;
• the browser removes the data of a site you haven’t used for a long time. That happens when the device runs out of space, and in Safari also after time: if you do nothing on a site for seven days.

The last one can be softened but not removed: a browser may promise to “keep it permanently”, but it doesn’t have to. That’s why the textbook has one main rule about safekeeping: save your progress to a file.

The progress file

“Settings”, then “Save progress”: the browser downloads one file with everything you did: finished lessons, answers, cards, the brief and your code. It’s the only copy of your data outside the browser, and also the way to move your work to another computer.

Loading goes the other way. On the new device, open the textbook and choose the file in the same settings. Before changing anything, the textbook shows what is in the file and asks you to confirm: loading replaces everything that is in this browser now.

Save the file now and then, for example once a week or after a big part. It’s as useful as saving a document.

Check yourself: how many copies of your progress are there, and where is the second?

One, in the browser. A second appears only when you save a file yourself.

Your key and model mode

Echo can answer questions in two ways. Without a key, they give the lesson’s prepared hints: free, with no network, and nothing goes anywhere. With a key, they can answer any question in their own words, but then the answer is prepared by an AI service that you chose yourself and pay for.

What is worth knowing here:

• A key is like a password for your account with the service. It’s kept only in your browser.
• The key goes into the progress file only if you check the box. If you do, keep the file like a password.
• It goes only to the service you chose, and only when you ask a question. The lesson’s text and your current code go with the question. The brief goes only if you allowed it for that question.
• Every question costs money, and the textbook shows an estimate beforehand.
• Model mode is off by default.

Play with the switches and see what goes where.

Model mode is on (you entered your own key and are asking a question) I allowed the brief to be sent with the question Include the key in the progress file

What	Where it lives	In the progress file	To the model you chose
Progress: finished lessons, answers, cards	in this browser	into the file, when you press “Save progress”	never
The brief: your project and your details	in this browser	into the file, with the progress	no
Your code from the practice	in this browser	into the file, with the progress	no
The text of the lesson you are reading	it is the textbook’s text, not yours	no	no
Your key for an AI service	in this browser	no, by default it is not in the file	no
Your question to Echo, written in your own words	not saved	no	without a key there are no questions in your own words: Echo answers with prepared hints
Everything listed: to the textbook’s server	—	—	never: the textbook has no server for your data

Model mode is off: nothing goes anywhere. Everything stays on your device.

Check yourself: what goes to the AI service when you ask Echo a question?

Your question, the lesson’s text and your current code. The brief only if you allowed it. If no key is entered, nothing goes anywhere.

Mine or invented

The brief holds details that can count as personal data: a name, a phone number, an email, a city, a photo, a biography. In the European Union and the United Kingdom, the GDPR defines personal data as any information relating to an identified or identifiable person, and a name, an identification number, location data or an online identifier all count. Russia’s law, 152-FZ, defines it in much the same way. The UK has its own version, the UK GDPR, with the same definition. The United States has no single federal law like this: it’s a patchwork of state laws, such as California’s CCPA.

The GDPR limits those who collect and process other people’s data. It doesn’t apply, in broad terms, to what a person does purely for personal or household reasons. What the owner of a real site with a contact form must do is a topic for the part on quality and the law.

For the practice this means the following.

• Your own details. You can enter your own name, phone number, email and city. They go into your browser’s storage and your progress file, and you see them on the pages of your site. They go no further. But remember: if you put the site on the open internet, they become public.
• Invented details. An invented name, a number made of zeros and an address at example will do. That’s enough for the practice.
• Other people’s details. Don’t enter the name, phone number or photo of a living person without their written consent. Not even “for study”.

A good rule for later: use invented details in practice and in drafts, and enter the real ones at the last moment, when you really are about to publish the site.

This is general information, not legal advice. If you need advice about a real site, ask a lawyer or your data protection authority: in the UK it’s the Information Commissioner’s Office (ICO), and in the EU each member state has its own, listed by the European Data Protection Board.

Practice

Below is your page, and under it a note of four lines: the details from your brief that end up on the page. For each one, decide whether it’s yours or invented, and instead of the ellipsis write “mine” or “invented”. You can change this note whenever you like.

Do it now

1. In settings, press “Save progress” and put the file somewhere you won’t lose it.
2. If you want your own details on the site, enter them in settings. If you don’t, leave the example.
3. Press “Finish the lesson”. Part 0 is done: next we’ll see how the internet works.