2e:null 2f:["$","title",null,{"children":"Introduction to Observable | João Rulff | Observable"}] 34:T6c4,35:[] 32:{"id":"b101529514fc7ba6","slug":"introduction-to-observable","title":"Introduction to Observable","thumbnail":"708e94215bb703cec194059ac55fe0f9f211b82e7e8543d3fec8127dca56aac2","access_level":"public","create_time":"$D2022-01-24T16:20:40.371Z","update_time":"$D2026-04-16T19:06:16.604Z","view_time":null,"first_public_time":"$D2022-01-27T19:10:24.595Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"ad37929384f8c890","login":"jlrulff","name":"João Rulff","avatar_url":"https://avatars-next.observableusercontent.com/61e7386e80ca9c8fb33f146e596f13dd102aa53e27e69ad57c759d63f733195a","tier":"starter_2024"},"version":603,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"156ac92bacf96157","login":"jlrulff","name":"João Rulff","avatar_url":"https://avatars-next.observableusercontent.com/61e7386e80ca9c8fb33f146e596f13dd102aa53e27e69ad57c759d63f733195a","tier":null}],"members":[{"type":"individual","id":"3ec14b623de07061","login":"fmiranda","name":"Fabio Miranda","avatar_url":"https://avatars-next.observableusercontent.com/7e8b6de3156e361f3b4a19d0f7c96048eec88648c1992cfd1b3c2ad804904073","tier":null,"role":"editor"},{"type":"individual","id":"156ac92bacf96157","login":"jlrulff","name":"João Rulff","avatar_url":"https://avatars-next.observableusercontent.com/61e7386e80ca9c8fb33f146e596f13dd102aa53e27e69ad57c759d63f733195a","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":7,"collection":null,"type":"notebook","body":{"title":"Introduction to Observable","cells":[{"id":19,"value":"# Introduction to Observable","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":51,"value":"$34","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":66,"value":"Like Jupyter notebooks, Observable are computational notebooks where you can collaboratively explore, analyze, visualize, and communicate with data on the web. It allows for users to write code in JavaScript, HTML, Markdown and Latex","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":86,"value":"## Notebooks and Cells","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":97,"value":"A *notebook* is composed of a set of cells containing code.\n\nTo edit the cells you have to click on the ${greyarrow} on the left side of a cell.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":110,"value":"2 + 12// Operations","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":293,"value":"w = 13","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":576,"value":"w","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"{\n const angles = [0, 15, 30, 45, 60, 75, 90];\n const sines = angles.map(x => Math.sin(x * (Math.PI/180)) );\n return sines;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":566,"value":"{\n const angles = [0, 20, 30, 45, 60, 75, 90];\n const sines = angles.map(x => Math.sin(x * (Math.PI/180)) );\n return sines;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":367,"value":"## Return complex objects","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":350,"value":"obj = {\n return {x: 10, y: 30};\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"## Order does not matter!\nYou can define your variables in each order you want and Observable uses a dependency graph to update the references accordingly. Observable tries to solve a common problem on Jupyter notebooks: **Hidden States**","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":377,"value":"data = {\n\n const random_numbers = [];\n \n for(let i = 0; i < nNumbers; i++){\n random_numbers.push(Math.random()*10);\n }\n\n return random_numbers;\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":386,"value":"nNumbers = 2;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":420,"value":"## Functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":424,"value":"squared(16)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":537,"value":"## Useful Links","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":410,"value":"[Observable tutorials](https://observablehq.com/tutorials) ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":236,"value":"## Helper Functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":415,"value":"squared = {\n return (a) => { return Math.pow(a,2); }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":237,"value":"greypin = {\n return html``\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"greyarrow = {\n return html``\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 33:"$32:body"