57 lines
48 KiB
HTML
57 lines
48 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en-US" dir="ltr">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Introducing JavaScript | DreamFreely Library</title>
|
||
<meta name="description" content="Community Conscious Creations">
|
||
<meta name="generator" content="VitePress v2.0.0-alpha.15">
|
||
<link rel="preload stylesheet" href="/assets/style.tE5om2fv.css" as="style">
|
||
<link rel="preload stylesheet" href="/vp-icons.css" as="style">
|
||
|
||
<script type="module" src="/assets/app.D2von411.js"></script>
|
||
<link rel="preload" href="/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
|
||
<link rel="modulepreload" href="/assets/chunks/theme.CAK4ts65.js">
|
||
<link rel="modulepreload" href="/assets/chunks/framework.j4Nev8bF.js">
|
||
<link rel="modulepreload" href="/assets/rebel_coding_step2.md.g93kTiCg.lean.js">
|
||
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
|
||
</head>
|
||
<body>
|
||
<div id="app"><div class="Layout" data-v-1df9f90f><!--[--><!--]--><!--[--><span tabindex="-1" data-v-331ec75c></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-331ec75c>Skip to content</a><!--]--><!----><header class="VPNav" data-v-1df9f90f data-v-da52a441><div class="VPNavBar" data-v-da52a441 data-v-70946a35><div class="wrapper" data-v-70946a35><div class="container" data-v-70946a35><div class="title" data-v-70946a35><div class="VPNavBarTitle has-sidebar" data-v-70946a35 data-v-1e38c6bc><a class="title" href="/" data-v-1e38c6bc><!--[--><!--]--><!----><span data-v-1e38c6bc>DreamFreely Library</span><!--[--><!--]--></a></div></div><div class="content" data-v-70946a35><div class="content-body" data-v-70946a35><!--[--><!--]--><div class="VPNavBarSearch search" data-v-70946a35><!----></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-70946a35 data-v-39714824><span id="main-nav-aria-label" class="visually-hidden" data-v-39714824> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/welcome/" tabindex="0" data-v-39714824 data-v-52a1d768><!--[--><span data-v-52a1d768>Welcome</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/welcome/support.html" tabindex="0" data-v-39714824 data-v-52a1d768><!--[--><span data-v-52a1d768>Support</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-70946a35 data-v-6c893767><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-6c893767 data-v-5337faa4 data-v-1d5665e3><span class="check" data-v-1d5665e3><span class="icon" data-v-1d5665e3><!--[--><span class="vpi-sun sun" data-v-5337faa4></span><span class="vpi-moon moon" data-v-5337faa4></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-70946a35 data-v-0394ad82 data-v-d07f11e6><!--[--><a class="VPSocialLink no-icon" href="https://canin.dreamfreely.org" aria-label="org" target="_blank" rel="me noopener" data-v-d07f11e6 data-v-591a6b30><span class="vpi-social-org"></span></a><a class="VPSocialLink no-icon" href="https://shop.dreamfreely.org" aria-label="kitsu" target="_blank" rel="me noopener" data-v-d07f11e6 data-v-591a6b30><span class="vpi-social-kitsu"></span></a><a class="VPSocialLink no-icon" href="https://appdeveloperone.com/DreamFreely" aria-label="zcool" target="_blank" rel="me noopener" data-v-d07f11e6 data-v-591a6b30><span class="vpi-social-zcool"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-70946a35 data-v-bf2fac68 data-v-42cb505d><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-42cb505d><span class="vpi-more-horizontal icon" data-v-42cb505d></span></button><div class="menu" data-v-42cb505d><div class="VPMenu" data-v-42cb505d data-v-25a6cce8><!----><!--[--><!--[--><!----><div class="group" data-v-bf2fac68><div class="item appearance" data-v-bf2fac68><p class="label" data-v-bf2fac68>Appearance</p><div class="appearance-action" data-v-bf2fac68><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-bf2fac68 data-v-5337faa4 data-v-1d5665e3><span class="check" data-v-1d5665e3><span class="icon" data-v-1d5665e3><!--[--><span class="vpi-sun sun" data-v-5337faa4></span><span class="vpi-moon moon" data-v-5337faa4></span><!--]--></span></span></button></div></div></div><div class="group" data-v-bf2fac68><div class="item social-links" data-v-bf2fac68><div class="VPSocialLinks social-links-list" data-v-bf2fac68 data-v-d07f11e6><!--[--><a class="VPSocialLink no-icon" href="https://canin.dreamfreely.org" aria-label="org" target="_blank" rel="me noopener" data-v-d07f11e6 data-v-591a6b30><span class="vpi-social-org"></span></a><a class="VPSocialLink no-icon" href="https://shop.dreamfreely.org" aria-label="kitsu" target="_blank" rel="me noopener" data-v-d07f11e6 data-v-591a6b30><span class="vpi-social-kitsu"></span></a><a class="VPSocialLink no-icon" href="https://appdeveloperone.com/DreamFreely" aria-label="zcool" target="_blank" rel="me noopener" data-v-d07f11e6 data-v-591a6b30><span class="vpi-social-zcool"></span></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-70946a35 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><div class="divider" data-v-70946a35><div class="divider-line" data-v-70946a35></div></div></div><!----></header><div class="VPLocalNav has-sidebar empty" data-v-1df9f90f data-v-db738f89><div class="container" data-v-db738f89><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-db738f89><span class="vpi-align-left menu-icon" data-v-db738f89></span><span class="menu-text" data-v-db738f89>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-db738f89 data-v-0bf0e06f><button data-v-0bf0e06f>Return to top</button><!----></div></div></div><aside class="VPSidebar" data-v-1df9f90f data-v-af661f50><div class="curtain" data-v-af661f50></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-af661f50><span class="visually-hidden" id="sidebar-aria-label" data-v-af661f50> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0" data-v-8d50c081 data-v-d81de50c><div class="item" role="button" tabindex="0" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><h2 class="text" data-v-d81de50c>Welcome</h2><!----></div><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/welcome/" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Chibu / Hola / Hello</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/welcome/dreamfreely.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>About DreamFreely</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/welcome/canin.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>About Canin Carlos</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0 has-active" data-v-8d50c081 data-v-d81de50c><div class="item" role="button" tabindex="0" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><h2 class="text" data-v-d81de50c>Rebel Coding 101</h2><!----></div><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Intro to Coding</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/orientation.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Orientation</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/termintro.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Intro to CLI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step1.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 1: HTML & CSS</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step2.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 2: JavaScript</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step3.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 3: Python Scrapers</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step4.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 4: The Full Stack</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/appendices.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Appendices</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0" data-v-8d50c081 data-v-d81de50c><div class="item" role="button" tabindex="0" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><h2 class="text" data-v-d81de50c>Rebel Coding 102</h2><!----></div><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/v2.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Reviewing the Full-Stack</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/v2Orient.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Planning Our App</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step5.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 1: Server</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step6.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 2: Client</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step7.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 3: Deployment</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/step8.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Step 4: Scaling, etc</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/rebel_coding/more-appendices.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>More Appendices</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0" data-v-8d50c081 data-v-d81de50c><div class="item" role="button" tabindex="0" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><h2 class="text" data-v-d81de50c>Manifesting Empathy</h2><!----></div><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Welcome</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/egg.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>The Egg (0-5)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/hatchling.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>The Hatchling (5-12)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/flight.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Flight (12-18)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/flying.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Flying (18-25)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/learning.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Learning (25-35)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/building.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Building (35-45)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/helping.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Helping (45-60)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/enjoying.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Enjoying (60+)</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/onward.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Outro</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath/appendices.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Appendices</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0" data-v-8d50c081 data-v-d81de50c><div class="item" role="button" tabindex="0" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><h2 class="text" data-v-d81de50c>Diversity Inverted</h2><!----></div><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Welcome</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/1-whiteness.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Whiteness</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/2-native.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Indigeneity</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/3-latinx.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Latinx</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/4-Black.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Blackness</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/5-onward.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Onwards</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/divinv/appendices.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Appendices</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0" data-v-8d50c081 data-v-d81de50c><!----><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1" data-v-d81de50c data-v-d81de50c><div class="item" role="button" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><p class="text" data-v-d81de50c>The Guidebook</p><!----></div><!----></div><!--]--></div></section></div><div class="no-transition group" data-v-8d50c081><section class="VPSidebarItem level-0" data-v-8d50c081 data-v-d81de50c><div class="item" role="button" tabindex="0" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><h2 class="text" data-v-d81de50c>Manifesting Empathy (archived)</h2><!----></div><div class="items" data-v-d81de50c><!--[--><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Welcome</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/sexism.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Sexism</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/racism.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Racism</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/able-ism.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Able-ism</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/power-dynamics.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Power Dynamics</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/onward.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Onwards</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-d81de50c data-v-d81de50c><div class="item" data-v-d81de50c><div class="indicator" data-v-d81de50c></div><a class="VPLink link link" href="/mempath.bak/appendices.html" data-v-d81de50c><!--[--><p class="text" data-v-d81de50c>Appendices</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-1df9f90f data-v-c87f25bf><div class="VPDoc has-sidebar has-aside" data-v-c87f25bf data-v-7011f0d8><!--[--><!--]--><div class="container" data-v-7011f0d8><div class="aside" data-v-7011f0d8><div class="aside-curtain" data-v-7011f0d8></div><div class="aside-container" data-v-7011f0d8><div class="aside-content" data-v-7011f0d8><div class="VPDocAside" data-v-7011f0d8 data-v-3f215769><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-3f215769 data-v-60d5052e><div class="content" data-v-60d5052e><div class="outline-marker" data-v-60d5052e></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-60d5052e>On this page</div><ul class="VPDocOutlineItem root" data-v-60d5052e data-v-1ce71065><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-7011f0d8><div class="content-container" data-v-7011f0d8><!--[--><!--]--><main class="main" data-v-7011f0d8><div style="position:relative;" class="vp-doc _rebel_coding_step2" data-v-7011f0d8><div><h1 id="introducing-javascript" tabindex="-1">Introducing JavaScript <a class="header-anchor" href="#introducing-javascript" aria-label="Permalink to “Introducing JavaScript”"></a></h1><hr><p>If HTML is the framing of our building, and CSS provides the aesthetic; JavaScript is the plumbing and electrical ~ the gadgetry!</p><p>JavaScript is HUGE ~ there is no way that we could even give you a preview of everything. Instead we cover the basic uses for building preliminary interactivity, and the basics of consuming APIs.</p><p>So now let’s get into the muck and mire of coding, and start by learning some of the basic tools in our cache!</p><h2 id="variables" tabindex="-1"><a href="#variables">#</a> Variables <a class="header-anchor" href="#variables" aria-label="Permalink to “# Variables”"></a></h2><p>Variables are the building blocks of code. They help us store information, and allow us to retain information changes while interacting with other variables and code chunks.</p><p>You can see variations of the following <em>objects</em> in almost all of the computer languages you ever investigate.</p><p>So let’s begin!</p><h3 id="integers-floats" tabindex="-1">Integers & Floats <a class="header-anchor" href="#integers-floats" aria-label="Permalink to “Integers & Floats”"></a></h3><p>Integers are whole numbers, and they can be positive or negative.</p><p>Floats, on the other hand, are numbers that contain decimals, i.e. <code>12.4241.</code></p><p>We’ll see a bit later how this distinction is used, though it is an important delineation of which to be aware!</p><h3 id="strings" tabindex="-1">Strings <a class="header-anchor" href="#strings" aria-label="Permalink to “Strings”"></a></h3><p>Strings are <em>a collection of alphanumeric characters and symbols enclosed by quotations</em>, single or double, it doesn’t matter which.</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> var item = 'some string';</span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> let item3 = 'some other string';</span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> const newItem = 'new string';</span></span></code></pre></div><p>The first two lines, using <em>var</em> and <em>let</em>, have the same meaning. Each set a variable that can later be changed, or is <em>mutable</em>.</p><p>Opposingly, <em>const</em> sets a variable that <em>can not</em> be changed, or is <em>immutable</em>.</p><h3 id="boolean" tabindex="-1">Boolean <a class="header-anchor" href="#boolean" aria-label="Permalink to “Boolean”"></a></h3><p>Boolean values are <em>true/false</em> values.</p><p>Translated into machine code, values are either a 0 or 1.</p><p><code>var target = true;</code></p><p><strong>or</strong></p><p><code>var target = 1;</code></p><p>Notice that in JavaScript the true or false values are spelled with a lower-case first-letter; this too is specific to JavaScript.</p><p>In Python the True & False need to be capitalized to be treated as boolean variables.</p><h3 id="lists" tabindex="-1">Lists <a class="header-anchor" href="#lists" aria-label="Permalink to “Lists”"></a></h3><p>Lists are a collection of objects separated by commas and enclosed by square brackets [].</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> let newList = ['some', 'list', 'of', 'strings', ['with another list', 'within', 235], true,];</span></span></code></pre></div><p>The objects do not all need to be of the same type.</p><h5 id="list-indexes" tabindex="-1">List Indexes <a class="header-anchor" href="#list-indexes" aria-label="Permalink to “List Indexes”"></a></h5><p>At times, one may wish to obtain an object by its position in a list, or an operation of similar effect.</p><p>This would mean, to obtain objects by their list index number.</p><p>In both JavaScript and Python, lists begin at 0.</p><p>In our example newList from above, if I wanted to get the first object in the list I would use the following code:</p><p><code>let specificItem = newList[0]</code></p><p><strong>If we wanted the third object</strong></p><p><code>let item3 = newList[2]</code></p><p>Why is that?</p><p>Notice that we are not using quotations around this number, and that it is placed with square-brackets.</p><p>How would you get the second item of the list within our example list?</p><h3 id="dictionary" tabindex="-1">Dictionary <a class="header-anchor" href="#dictionary" aria-label="Permalink to “Dictionary”"></a></h3><p>Dictionaries are a collection of <em>key-value pairs enclosed by curly brackets</em>.</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> var target = {'text': 'some string', 'published': false, 'colors': ['red', 'blue',],};</span></span></code></pre></div><p>Breaking this code down, the <em>key</em> is defined by a string, and separated from the <em>value</em> by a colon.</p><p>Each <em>key/value pair</em> is then separated by a comma.</p><p>This is all enclosed within <em>curly brackets</em> {}.</p><p>Notice again how the value can be any type of variable.</p><h2 id="the-moving-parts" tabindex="-1"><a href="#the-moving-parts">#</a> The Moving Parts <a class="header-anchor" href="#the-moving-parts" aria-label="Permalink to “# The Moving Parts”"></a></h2><h3 id="if-else-statement" tabindex="-1">If-Else Statement <a class="header-anchor" href="#if-else-statement" aria-label="Permalink to “If-Else Statement”"></a></h3><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> if (x < y) {</span></span>
|
||
<span class="line"><span> var display = "Welcome to Rebel Coding 101";</span></span>
|
||
<span class="line"><span> } else if (x < z) {</span></span>
|
||
<span class="line"><span> var display = "Welcome to Rebel Coding 102";</span></span>
|
||
<span class="line"><span> } else {</span></span>
|
||
<span class="line"><span> var display = "We haven't planned this far ahead yet :/"</span></span>
|
||
<span class="line"><span> }</span></span></code></pre></div><p>Read it out-loud:</p><p>If <em>x is less than y</em>, the variable <em>display</em> equals a certain string.</p><p><em>Else, if x</em> is not less than <em>y and is less than z</em>, <em>display</em> equals a different string.</p><p>If <em>x is larger than them all, using the else</em> statement, <em>display</em> is set to equal a third string.</p><h3 id="for-loop" tabindex="-1">For-Loop <a class="header-anchor" href="#for-loop" aria-label="Permalink to “For-Loop”"></a></h3><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> for (var i = 0; i < 9; i++) {</span></span>
|
||
<span class="line"><span> console.log(i);</span></span>
|
||
<span class="line"><span> // more statements</span></span>
|
||
<span class="line"><span> }</span></span></code></pre></div><p>Read it out:</p><p>For <em>variable i</em> that equals zero, when <em>i is less than 9, i</em>++. <em>console.log(i);</em> ?</p><p>console.log() prints out whatever is contained in the parentheses.</p><p>In JavaScript the shortened version to increment a value by 1 is <em>++</em>.</p><p>It’s different in Python (+=1).</p><p>Search for other variations; also what sequence of numbers does this for-loop print do you think?</p><h3 id="functions" tabindex="-1">Functions <a class="header-anchor" href="#functions" aria-label="Permalink to “Functions”"></a></h3><p>Functions are where it all comes together, in a sense.</p><p>First we define an object that consumes other objects, and uses them to create an output.</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> var blump = function(prop1, prop2){</span></span>
|
||
<span class="line"><span> var a = prop1</span></span>
|
||
<span class="line"><span> var b = prop2</span></span>
|
||
<span class="line"><span> var c = a/b</span></span>
|
||
<span class="line"><span> return c</span></span>
|
||
<span class="line"><span> };</span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> blump(5, 3)</span></span></code></pre></div><p>So let's read this out-loud:</p><p>Variable <em>blump</em> is a function that consumes/uses two objects, <em>prop1</em> and <em>prop2</em>.</p><p>Within our function these two objects are made into variables <em>a and b</em>, which are then used to create a third variable <em>c</em>.</p><p>This last variable <em>c</em> is then returned by our function.</p><blockquote><p>QN: Mathematical operators Review</p></blockquote><p>Remember when we made the distinction between integers and floats ?</p><p>Here is where it comes into play; arithmetic operations are not notated as you may have learned them in school.</p><p>Sure addition still uses the “+” sign.</p><p>Subtraction still uses the “-” sign, and division still uses the “/” sign.</p><p>But multiplication uses an asterisk “*”.</p><p>While exponentiation uses the double-asterisk “**”.</p><p>We also have another operator we can use to find the remainders of division.</p><p>This is called the modulus operator, “%”.</p><p>Pretty nifty, eh.</p><h1 id="jquery-the-dom" tabindex="-1">jQuery & the DOM <a class="header-anchor" href="#jquery-the-dom" aria-label="Permalink to “jQuery & the DOM”"></a></h1><hr><p>We have seen with CSS that we can modify the aesthetics of our webpages. Be this by adding colors, changing font sizes, and other modifications. But what if you could "automate that"? How would you do such a thing?</p><p>First things first, we need to import a few libraries:</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> <script src="bootstrap.min.js"></script></span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> <script src="jquery.min.js"></script></span></span></code></pre></div><p>Then, we need to <em>hook into</em> the HTML structure, or the DOM, Document Object Model.</p><p>We do this using the dollar-sign notation, which is specific to jQuery, that allows us to reach into the HTML code and make changes!</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> <script></span></span>
|
||
<span class="line"><span> $(".jobLabel a").on("click", function(){</span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> var target = $(this).attr("rel");</span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> $("#"+target).show().siblings("div").hide(); </span></span>
|
||
<span class="line"><span> });</span></span>
|
||
<span class="line"><span> </script></span></span></code></pre></div><p>While this may appear to be a complex-looking function, let's disassemble it and see what's going on:</p><h3 id="the" tabindex="-1">The $ <a class="header-anchor" href="#the" aria-label="Permalink to “The $”"></a></h3><p>The dollar-sign allows us to access the DOM.</p><p>Once inside the DOM, we can identify specific elements and change them!</p><p>Parenthesis contain things (<em>duh</em>), and contained in these first parenthesis are set of items separated by a space, <em>.jobLabel</em> and <em>a</em>.</p><p>We recognize the syntax of <em>.jobLabel</em> from CSS, and determine that it indicates a class, while the <em>a</em> is an html tag!</p><p>So now we have identified a specific set of objects on the webpage/DOM with which to work!</p><p><code>$('.jobLabel a')</code> which means all of the <em>a</em> tags with the class 'jobLabel'.</p><h3 id="interactivity" tabindex="-1">Interactivity <a class="header-anchor" href="#interactivity" aria-label="Permalink to “Interactivity”"></a></h3><p>Now that we have the objects discerned, what do we do with them?!</p><p>There is a period after our parenthetical statement, followed by the word <em>on</em>, and another set of parentheses.</p><p>This is called "chaining" operations.</p><p>We have an action, or set of actions: .on('click',function(){});</p><p>To translate, what we have so far $('.jobLabel a').on('click', function(){});:</p><p>For all <em>a</em> tags with the class "jobLabel" ... when the element is clicked perform the following function.</p><h3 id="acting" tabindex="-1">Acting <a class="header-anchor" href="#acting" aria-label="Permalink to “Acting”"></a></h3><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> var target = $(this).attr("rel");</span></span>
|
||
<span class="line"><span> </span></span>
|
||
<span class="line"><span> $("#"+target).show().siblings("div").hide();</span></span></code></pre></div><p>Within this function we declare and define a variable called <em>target</em>.</p><p>Next, we set this variable using our dollar-sign, while specifying a specific property attribute, <em>rel</em>.</p><p>This attribute value is then used to identify a third object.</p><p>Finally, we have our action.</p><p>To <em>show</em> our selected item, while <em>hiding</em> all of its <em>siblings</em>.</p><p>Within the function we are able to affect,and change, the DOM.</p><div class="language-"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark" style="--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e;" tabindex="0" dir="ltr"><code><span class="line"><span> var target = $(this).attr('rel');</span></span>
|
||
<span class="line"><span> $("#"+target).show().siblings("div").hide();</span></span></code></pre></div><p>Notice how each line ends with a semicolon.</p><p>And how each parenthetical statement, or bracketed statement, is closed.</p><p>Lastly, I want us to notice the use of show() and hide().</p><p>While other parentheses have items within them, these parentheses are left empty ...</p><p>In this instance the parenthesis are identifying a function that is to be performed, and requires no parameters</p><h1 id="importing-external-scripts-cdn-s" tabindex="-1">Importing External Scripts & CDN’s <a class="header-anchor" href="#importing-external-scripts-cdn-s" aria-label="Permalink to “Importing External Scripts & CDN’s”"></a></h1><hr><p>Earlier we just pulled in Bootstrap and jQuery from our local folders … this was easy.</p><p>Though most of the time we will need to, or want to, pull scripts from external sources, one type of which are called CDN’s, or content delivery networks.</p><p>These are locations that contain our necessary files pre-packaged and ready to be expedited, super-quickly, to our production websites.</p><p><a href="https://code.jquery.com/" target="_blank" rel="noreferrer">jQuery CDN</a></p><p><a href="https://www.bootstrapcdn.com/" target="_blank" rel="noreferrer">Bootstrap CDN</a></p></div></div></main><footer class="VPDocFooter" data-v-7011f0d8 data-v-e257564d><!--[--><!--]--><!----><nav class="prev-next" aria-labelledby="doc-footer-aria-label" data-v-e257564d><span class="visually-hidden" id="doc-footer-aria-label" data-v-e257564d>Pager</span><div class="pager" data-v-e257564d><a class="VPLink link pager-link prev" href="/rebel_coding/step1.html" data-v-e257564d><!--[--><span class="desc" data-v-e257564d>Previous page</span><span class="title" data-v-e257564d>Step 1: HTML & CSS</span><!--]--></a></div><div class="pager" data-v-e257564d><a class="VPLink link pager-link next" href="/rebel_coding/step3.html" data-v-e257564d><!--[--><span class="desc" data-v-e257564d>Next page</span><span class="title" data-v-e257564d>Step 3: Python Scrapers</span><!--]--></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
|
||
<script>window.__VP_HASH_MAP__=JSON.parse("{\"api-examples.md\":\"x63WI4Pt\",\"df_guide_1_basic_psych.md\":\"CeMcMmuh\",\"df_guide_2_medi_vibes.md\":\"DXqrKVuP\",\"df_guide_3_with_loneliness.md\":\"CCm6CpFp\",\"df_guide_4_enter_alchemy.md\":\"C_rmpGLw\",\"df_guide_5_test_ethic.md\":\"CLeadJfH\",\"df_guide_6_social_physics.md\":\"DLXBEao5\",\"df_guide_7_quantum_realm.md\":\"DLdBPsJT\",\"df_guide_8_topol.md\":\"Ba9e4UzJ\",\"df_guide_appendices.md\":\"B6_t-HyW\",\"df_guide_index.md\":\"CEtKw1LU\",\"divinv_1-whiteness.md\":\"Gp4URLax\",\"divinv_2-native.md\":\"Vv8EGUun\",\"divinv_3-latinx.md\":\"BM4bdmUR\",\"divinv_4-black.md\":\"CUehWxOs\",\"divinv_5-onward.md\":\"CEQkr_Yq\",\"divinv_appendices.md\":\"Bmbs9w04\",\"divinv_index.md\":\"Bqo_SiH4\",\"exocto_analytics.md\":\"BKJsN1AA\",\"exocto_appendices.md\":\"Dni294_f\",\"exocto_automation.md\":\"CN2PTACp\",\"exocto_cooltools.md\":\"BTNgrA0k\",\"exocto_index.md\":\"BnPavi-q\",\"exocto_licences.md\":\"DzIeU3HF\",\"exocto_mailinglists.md\":\"CnM_HnlB\",\"exocto_payments.md\":\"CrBxLlhh\",\"exocto_seo101.md\":\"DviR7H5g\",\"exocto_socialmedia.md\":\"C39W_iye\",\"exocto_websites.md\":\"q-QXL0De\",\"index.1.md\":\"BirqA0z4\",\"index.md\":\"CpG2gthS\",\"markdown-examples.md\":\"CUSHEXel\",\"mempath.bak_able-ism.md\":\"DEEoY8Vi\",\"mempath.bak_appendices.md\":\"CmQnH-55\",\"mempath.bak_gender-studies.md\":\"Bm3aYqIc\",\"mempath.bak_index.md\":\"CjZxMHAK\",\"mempath.bak_notes.huggingface.md\":\"Khx3__Av\",\"mempath.bak_onward.md\":\"BVZnlB_v\",\"mempath.bak_openai.playground.md\":\"DWJTSwWP\",\"mempath.bak_outline.huggingface.md\":\"rtMna0fM\",\"mempath.bak_power-dynamics.md\":\"BpdS-0SU\",\"mempath.bak_racism.md\":\"DZ9tBx6B\",\"mempath.bak_sexism.md\":\"BEBA033J\",\"mempath_appendices.md\":\"Czbekzrn\",\"mempath_building.md\":\"DiuxWTcR\",\"mempath_egg.md\":\"CisKm_IF\",\"mempath_enjoying.md\":\"B4curKmU\",\"mempath_flight.md\":\"CVDxb1-C\",\"mempath_flying.md\":\"B6DOnD8x\",\"mempath_hatchling.md\":\"VVGsZ3N1\",\"mempath_helping.md\":\"P__Igwr5\",\"mempath_index.md\":\"Cvas8zRV\",\"mempath_learning.md\":\"BgKY3mQI\",\"mempath_onward.md\":\"QQAwPgA6\",\"rebel_coding_appendices.md\":\"hih51f2p\",\"rebel_coding_index.md\":\"Q72dPgpm\",\"rebel_coding_orientation.md\":\"DBUP6Scl\",\"rebel_coding_step1.md\":\"UGFgpiDv\",\"rebel_coding_step2.md\":\"g93kTiCg\",\"rebel_coding_step3.md\":\"CFJMlHnF\",\"rebel_coding_step4.md\":\"cGlIZ8RL\",\"rebel_coding_step5.md\":\"D7qbvCYY\",\"rebel_coding_step6.md\":\"KTPIgYna\",\"rebel_coding_step7.md\":\"D0XOrhEO\",\"rebel_coding_step8.md\":\"K9SkXD8n\",\"rebel_coding_termintro.md\":\"FZ5Hz2Ty\",\"rebel_coding_v2.md\":\"BQnisPze\",\"rebel_coding_v2orient.md\":\"Cv5u-Osk\",\"welcome_canin.md\":\"CHq_tepX\",\"welcome_dreamfreely.md\":\"Bxqk9nt5\",\"welcome_index.md\":\"DuIGE3qw\",\"welcome_support.md\":\"CYUo6QRX\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"DreamFreely Library\",\"description\":\"Community Conscious Creations\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"Welcome\",\"link\":\"/welcome/\"},{\"text\":\"Support\",\"link\":\"/welcome/support\"}],\"sidebar\":[{\"text\":\"Welcome\",\"items\":[{\"text\":\"Chibu / Hola / Hello\",\"link\":\"/welcome/\"},{\"text\":\"About DreamFreely\",\"link\":\"/welcome/dreamfreely\"},{\"text\":\"About Canin Carlos\",\"link\":\"/welcome/canin\"}]},{\"text\":\"Rebel Coding 101\",\"items\":[{\"text\":\"Intro to Coding\",\"link\":\"/rebel_coding/\"},{\"text\":\"Orientation\",\"link\":\"/rebel_coding/orientation\"},{\"text\":\"Intro to CLI\",\"link\":\"/rebel_coding/termintro\"},{\"text\":\"Step 1: HTML & CSS\",\"link\":\"/rebel_coding/step1\"},{\"text\":\"Step 2: JavaScript\",\"link\":\"/rebel_coding/step2\"},{\"text\":\"Step 3: Python Scrapers\",\"link\":\"/rebel_coding/step3\"},{\"text\":\"Step 4: The Full Stack\",\"link\":\"/rebel_coding/step4\"},{\"text\":\"Appendices\",\"link\":\"/rebel_coding/appendices\"}]},{\"text\":\"Rebel Coding 102\",\"items\":[{\"text\":\"Reviewing the Full-Stack\",\"link\":\"/rebel_coding/v2\"},{\"text\":\"Planning Our App\",\"link\":\"/rebel_coding/v2Orient\"},{\"text\":\"Step 1: Server\",\"link\":\"/rebel_coding/step5\"},{\"text\":\"Step 2: Client\",\"link\":\"/rebel_coding/step6\"},{\"text\":\"Step 3: Deployment\",\"link\":\"/rebel_coding/step7\"},{\"text\":\"Step 4: Scaling, etc\",\"link\":\"/rebel_coding/step8\"},{\"text\":\"More Appendices\",\"link\":\"/rebel_coding/more-appendices\"}]},{\"text\":\"Manifesting Empathy\",\"items\":[{\"text\":\"Welcome\",\"link\":\"/mempath/\"},{\"text\":\"The Egg (0-5)\",\"link\":\"/mempath/egg\"},{\"text\":\"The Hatchling (5-12)\",\"link\":\"/mempath/hatchling\"},{\"text\":\"Flight (12-18)\",\"link\":\"/mempath/flight\"},{\"text\":\"Flying (18-25)\",\"link\":\"/mempath/flying\"},{\"text\":\"Learning (25-35)\",\"link\":\"/mempath/learning\"},{\"text\":\"Building (35-45)\",\"link\":\"/mempath/building\"},{\"text\":\"Helping (45-60)\",\"link\":\"/mempath/helping\"},{\"text\":\"Enjoying (60+)\",\"link\":\"/mempath/enjoying\"},{\"text\":\"Outro\",\"link\":\"/mempath/onward\"},{\"text\":\"Appendices\",\"link\":\"/mempath/appendices\"}]},{\"text\":\"Diversity Inverted\",\"items\":[{\"text\":\"Welcome\",\"link\":\"/divinv/\"},{\"text\":\"Whiteness\",\"link\":\"/divinv/1-whiteness\"},{\"text\":\"Indigeneity\",\"link\":\"/divinv/2-native\"},{\"text\":\"Latinx\",\"link\":\"/divinv/3-latinx\"},{\"text\":\"Blackness\",\"link\":\"/divinv/4-Black\"},{\"text\":\"Onwards\",\"link\":\"/divinv/5-onward\"},{\"text\":\"Appendices\",\"link\":\"/divinv/appendices\"}]},{\"text\":\"The Guidebook\"},{\"text\":\"Manifesting Empathy (archived)\",\"items\":[{\"text\":\"Welcome\",\"link\":\"/mempath.bak/\"},{\"text\":\"Sexism\",\"link\":\"/mempath.bak/sexism\"},{\"text\":\"Racism\",\"link\":\"/mempath.bak/racism\"},{\"text\":\"Able-ism\",\"link\":\"/mempath.bak/able-ism\"},{\"text\":\"Power Dynamics\",\"link\":\"/mempath.bak/power-dynamics\"},{\"text\":\"Onwards\",\"link\":\"/mempath.bak/onward\"},{\"text\":\"Appendices\",\"link\":\"/mempath.bak/appendices\"}]}],\"socialLinks\":[{\"icon\":\"org\",\"link\":\"https://canin.dreamfreely.org\"},{\"icon\":\"kitsu\",\"link\":\"https://shop.dreamfreely.org\"},{\"icon\":\"zcool\",\"link\":\"https://appdeveloperone.com/DreamFreely\"}]},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false,\"additionalConfig\":{}}");</script>
|
||
|
||
</body>
|
||
</html> |