2c:null 2d:["$","title",null,{"children":"My First Notebook | Henry Behrens | Observable"}] 32:[] 30:{"id":"38b84196c4972c6e","slug":"my-first-notebook","title":"My First Notebook","thumbnail":"31bd16a2e1f76a2eb4a4cdfd695624ac145cb9def3c81eeae6a7dc071467b29e","access_level":"public","create_time":"$D2026-09-02T19:17:53.164Z","update_time":"$D2026-09-03T09:36:07.738Z","view_time":null,"first_public_time":"$D2026-09-03T09:32:56.349Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"e88b6eb56996ce8c","login":"henry-behrens","name":"Henry Behrens","avatar_url":"https://avatars-next.observableusercontent.com/9d175d0d8ca4981aea59fa58e81746b0f40133d0de96aa950a9bfdbbd8ccef14","tier":"starter_2024"},"version":85,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"d6604f91d151ab19","login":"henry-behrens","name":"Henry Behrens","avatar_url":"https://avatars-next.observableusercontent.com/9d175d0d8ca4981aea59fa58e81746b0f40133d0de96aa950a9bfdbbd8ccef14","tier":null}],"members":[{"type":"team","id":"e88b6eb56996ce8c","login":"henry-behrens","name":"Henry Behrens","avatar_url":"https://avatars-next.observableusercontent.com/9d175d0d8ca4981aea59fa58e81746b0f40133d0de96aa950a9bfdbbd8ccef14","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"My First Notebook","cells":[{"id":1,"value":"# My First Notebook","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"HTML cell\nThis is what web pages are made of\nCumbersome to write, since everything is made of tags you need to close\nChange box background to yellow -->","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"

2. HTML cell

This is what web pages are made of
Cumbersome to write, since everything is made of tags you need to close
Change box background to yellow -->

But look what it can do!

\n \n

","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"3. JavaScript cell\nTime formatting reference","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"\"The time is now \" + d3.timeFormat(\"%Y-%m-%d %H:%M:%S\")(Date.now()) + \". Try adding date!\"\n// apparently your version is older so i had to lookup how to do it in the new version of observable","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"Data table cell\nCreate a data table cell and make it show data from penguins, which will only appear if you reference penguins locally","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"mypenguins = penguins\n//my version wont allow me to filter for 4000g penguins, it doesnt give the option for a interactive table...","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"data = mypenguins","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"data","database":"$undefined"},{"id":80,"value":"Plot.plot({\n color: {\n legend: true\n },\n marks: [\n Plot.auto(data, {x: \"culmen_length_mm\", y: \"culmen_depth_mm\", fx: \"species\", fy: \"island\", color: \"sex\"})\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":25,"value":"","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"Inputs.table(mypenguins)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"Plot.plot({\n grid: true,\n color: {\n legend: true\n },\n fx: {\n label: \"species\"\n },\n fy: {\n label: \"sex\"\n },\n x: {\n label: \"body_mass_g\"\n },\n y: {\n label: \"Frequency\"\n },\n marks: [\n Plot.rectY(\n mypenguins,\n Plot.binX(\n {y: \"count\"},\n {\n x: \"body_mass_g\",\n fx: \"species\",\n fy: \"sex\",\n fill: \"sex\"\n }\n )\n ),\n Plot.ruleY([0])\n ]\n})\n//again, not getting the option on how to add a chart in this version, had to have AI teach me how to physically code it. Although this is hardcoded so not very useful.","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"2"}} 31:"$30:body"