View code2.jsx
import React, { useEffect, useState } from 'react'; | |
import logo from './logo.svg'; | |
import './App.css'; | |
import { Map, TileLayer, Marker, Popup, Tooltip } from 'react-leaflet' | |
import tmi from 'tmi.js' | |
// https://nominatim.openstreetmap.org/search?format=json&q=stockholm,sweden | |
// Firebase App (the core Firebase SDK) is always required and must be listed first | |
import * as firebase from "firebase/app" |
View code.jsx
import React, { useEffect, useState } from 'react'; | |
import logo from './logo.svg'; | |
import './App.css'; | |
import { Map, TileLayer, Marker, Popup, Tooltip } from 'react-leaflet' | |
import tmi from 'tmi.js' | |
// !<command> <args> ? !register Sweden ? | |
// !checkin SE I am streaming |
View index.html
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
<title>Intro to XState</title> | |
<link rel="stylesheet" href="styles.css" /> | |
</head> | |
<body> | |
<div id="box"></div> |
View noc.html
<script | |
src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/p5.min.js"></script> | |
<script> | |
class Particle { | |
constructor() { | |
this.position = createVector(20, 20) | |
this.radius = 15 | |
this.velocity = createVector(1, 1) | |
this.acceleration = createVector(0.0, 0.0) |
View vanilla-hofs-with-reduce.js
const isMoreThan5 = number => number > 5 | |
const numbers = [ 2, 4, 8, 9 ] | |
const result = filter(isMoreThan5, numbers) | |
const addThree = number => number + 3 | |
const result = map(addThree, numbers) | |
result | |
function map(transform, array) { | |
const initialArray = [] | |
const mapReducer = (mappedArray, currentItem) => |
View vanillahofs.js
const numbers = [ 2, 4, 8, 9 ] | |
const addTwo = number => number + 1 | |
const isMoreThan5 = number => number > 5 | |
const result = | |
//numbers.filter(isMoreThan5) | |
filterArray(isMoreThan5, numbers) | |
//mapArray(addTwo, numbers | |
result | |
function filterArray(predicate, array) { |
View client.html
<style> | |
.buttons div { | |
border: 2px solid black; | |
margin: 10px; | |
padding: 1rem; | |
font-size: 3rem; | |
font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; | |
text-align: center; | |
} |
View snake2.js
<title>hello!!</title> | |
<canvas | |
name=canvas | |
width=300 height=300 style="border: solid 2px red"> | |
</canvas> | |
<script> | |
canvas = document.body.children[0] | |
context = canvas.getContext('2d') |
View afternoon.html
<html> | |
<!-- http://bit.ly/vanillaneural --> | |
<head> | |
<link href="style.css" rel="stylesheet" /> | |
</head> | |
<body> | |
<div class="legend legendX">Scariness</div> | |
<div class="legend legendY">Actual power</div> | |
<canvas id="mycanvas" width="1000" height="1000"></canvas> | |
NewerOlder