HalfStack Online May 2020

Worldwide Creative JS+Web Celebration

Sessions

  • 4:00AM – 4:09AM

    Welcome to HalfStack Online!
    Dylan Schiemann

    Let's get started!

  • 4:09AM – 4:37AM

    Building motion-controlled web applications
    Charlie Gerard

    Navigating a website mostly involves typing on a keyboard and swiping on a trackpad or touchscreen. However, a few recent tools developed around motion tracking are unlocking the ability to interact with web interfaces using gestures and computer vision.

    Previously being mainly developed in Python, this technology is now being actively made available to web developers with frameworks like Tensorflow.js. In this talk, we’ll look into different tools, applications and challenges of this technology, and how to get started experimenting with it in JavaScript.

  • 4:37AM – 5:10AM

    Responsive design in 2020: It's not just screen sizes anymore
    Kilian Valkhof

    After a decade of responsive design, responsive no longer just means adapts to your screen size. Nowadays, websites can adapt to many different user preferences, device capabilities and even situational changes. They do this with media queries, feature policies and even through CSS variables. Kilian explains what that means for your development workflow and how you can use these capabilities to provide a better experience for your users and truly respond to their preferences.

  • 5:10AM – 5:19AM

    HalfStack Outtakes and break

    Watch some outtakes from past HalfStack events and get mesmerized by our sponsor video or take a short break

  • 5:19AM – 5:20AM

    Deep Thoughts with Dylan Schiemann Part 1: Upside Down
    Dylan Schiemann

    Jack Handey or Dylan Schiemann, you decide

  • 5:20AM – 5:42AM

    Building an over-engineered weather station
    Guy Wilson

    Guy will demonstrate a weather station built using an Arduino and Raspberry Pi, with a web front-end deployed on the cloud. The software is written in C, C++ and JavaScript with Node.js

  • 5:42AM – 6:19AM

    All tooled up and nowhere to go?
    Chris Heilmann

    Not being able to go out and use the normal distractions might be a good time to take stock and look at what we have. You could re-arrange your cupboards and wardrobes or order all those USB cables you collected over the years. Or you could take a look at what tools and tool options are available to us as developers these days. In this quick talk Chris Heilmann will take you on a tour of the Chromium developer tools universe and point out some things that are useful but may have slipped under the radar in our quest to always find the next new thing.

  • 6:19AM – 6:28AM

    HalfStack Outtakes and break
  • 6:28AM – 6:31AM

    Deep Thoughts with Dylan Schiemann Part 2: Thought Ocean
    Dylan Schiemann

    Jack Handey or Dylan Schiemann, the debate continues.

  • 6:31AM – 7:11AM

    Multiplayer gaming architecture and design
    Srushtika Neelakantam

    “Do you play games?”.... Duh! “Ever thought of building one yourself?”...Yes, but, umm...

    The innate nature of games, in general, is to seem difficult to build. With lots of moving pieces involved (quite literally), game development seems like it’s restricted to devs who’ve dipped their feet deep into the holy waters of networking, mathematics, graphics, and the like. However, with the web evolving ever so rapidly and with all the new protocols and libraries that have spanned in the recent years, it’s now super simple to get started with building browser-based multiplayer games.

    In this talk, we’ll understand the architecture, system design, networking protocols, and caveats to keep in mind if you’d like to get started with building multiplayer browser-based games, all while playing a multiplayer version of a classic retro.

  • 7:11AM – 7:46AM

    Programatically Performant
    Jonathan Fielding

    Many talks about performance focus on how you can improve your websites speed. This is really helpful if you know you have a performance problem however it will not help you identify whether there is a problem in the first place. This talk is slightly different, it focuses on how you can gather data yourself, helping you understand if you have a problem and what impact it is having on your users.

  • 7:46AM – 8:26AM

    Let's build a point of sale system, with a Vue or two!
    Ramon Huidobro

    "Can you have it show order data across multiple monitors by tomorrow?"

    This is the story of that one time Ramon was contracted to build a point of sale system in 3 weeks, using Vue.js, a Raspberry Pi, and a thermal printer. It was a chaotic but educational journey, with valuable takeaways!

  • 8:26AM – 8:58AM

    Live Coding: Music performance with Sonic Pi
    Mynah Marie

    Enjoy an incredible live coding + music performance with Mynah Marie!

  • 8:58AM – 9:30AM

    Geppetto's Guide to Living Puppets
    Michael Jolley

    It all started with a colon and parenthesis. That simple smiley face brought us emojis and then animojis. What if we could bring those digital representations of our tone & sentiment to life in the real world? Join us as we learn from Geppetto's Guide to Living Puppets and build an animatronic puppet that mimics our movements using the Vonage Video API, Azure Functions, Particle IoT devices and yes, an animatronic puppet.

  • 9:31AM – 10:10AM

    Freqi: musical tuning systems with JavaScript
    Richard Bultitude

    How do you tune an oscillator or pitch an audio file up? How do I make an octave with more than 12 notes in it? What are the mathematics behind instrument tuning anyway? If you've ever asked yourself these questions or you just want find out why I asked them, join me for a brief tour of music theory and code.

  • 10:10AM – 10:55AM

    Locomotion: Going places in VR
    Ada Rose Cannon

    In VR, with an advanced headset, one can explore a scene by walking in the real world. We’re often limited to the size of the room we’re in but the VR world can go on forever!

    When you add a virtual method for moving around the scene, it lets users explore your VR scene even if their headset or their environment doesn’t allow them to walk around. This is sometimes called locomotion or teleportation. In this session we'll explore locomotion with WebXR by building a scene using VR controllers to explore the virtual environment.

  • 10:55AM – 11:28AM

    Games Games Games
    Joe Hart

    Digital Funny Man Joe Hart shows off a couple of new interactive video games and parody games while imploring you to join him on his ridiculous journey of building small niche games for people and groups you love.

  • 11:28AM – 11:36AM

    HalfStack Outtakes and break
  • 11:36AM – 11:41AM

    Cream Tea Break Outtake
    Tony Edwards

    HalfStack Interviewer Tony Edwards explains a proper solution to a proper British problem.

  • 11:41AM – 12:19PM

    Live JS Music
    Dylan Beattie

    Dylan writes songs about code, writes code about songs, and he's been called 'software's answer to Weird Al'. Join Dylan Beattie for a unique live musical performance. Classic rock hits from the Beatles to Bon Jovi, lovingly refactored, packed with nerdy jokes, and performed live - with lyrics on screen so you can all sing along. You'll laugh, you'll cry, you might even dance.

  • 12:19PM – 1:00PM

    PoseDance: Build a TikTok Trainer
    Jen Looper

    Do you scroll through TikTok, amazed at the goofy, yet complicated dance moves featuring today's youths? Those kids are popping off while you're sitting around, coding SQL queries. Fortunately, we are technologists, and there's no problem we can't solve, including getting better at TikTok dancing. In this talk, Jen will show you how she perfected her moves by building PoseDance, your friendly TikTok trainer. We'll discuss how Jen leveraged PoseNet, which allows you to pinpoint body motion and draw a 'skeleton' on a video. Combined with a webcam mapping your own dance skeleton, a bit of math to compare the matching points, Azure functions to authenticate a user, and PlayFab as a game-friendly backend to keep scores and create a leaderboard, you've got the perfect quarantine pastime, making a perfect fool of yourself in front of a webcam. Come dance with Jen!

    Jen is a Google Developer Expert and a Cloud Advocate Lead at Microsoft with over 20 years' experience as a web and mobile developer, specializing in creating cross-platform web & mobile apps.

  • 1:00PM – 1:28PM

    An Introduction To IoT (Internet of Toilets 🚽); Or How I Built an IoT Kitty Litter Box Using JavaScript
    Joe Karlsson

    Joe's favorite things in life are cats 🐈, computers 🖥 and crappy ideas 💩, so he decided to combine all three and make an IoT (Internet of Things) litter box using a Raspberry Pi and JavaScript! If you have ever wanted to get build your own IoT project, but didn’t know how to start, then this is the talk for you.

    Together, we will go through how Joe setup my IoT Litter Box from start to finish. Including how to setup Node.js on a Raspberry Pi and how to connect sensors to a Raspberry Pi and how to read the sensor inputs with Node.js.

  • 1:28PM – 1:31PM

    Paint your own dance controller
    Ramon Huidobro
  • 1:31PM – 1:39PM

    Break
  • 1:39PM – 2:10PM

    Beats in the Browser
    Ken Wheeler

    The title says it all

  • 2:10PM – 2:37PM

    R&B GraphQL
    Rahat Chowdhury

    In this talk we will live code a small application built off of one of Rahat's pre-built API's, a list of our favorite R&B songs from the 90's. We will be combining run-time GraphQL using Apollo and build time GraphQL using Gatsby to create R&B GraphQL a truly dynamic PWA.

  • 2:37PM – 2:45PM

    Deep Thoughts with Dylan Schiemann Part 3: Counteracting Developer-asana
    Dylan Schiemann

    Jack Handey or Dylan Schiemann, you decide

  • 2:45PM – 2:53PM

    Break
  • 2:53PM – 2:57PM

    Worth the Risk (Demo) Produced by Sinima Beats
    Rahat Chowdhury

    JS-inspired rap by Rahat

  • 2:57PM – 4:05PM

    Live Coding: Humanizing Technology and Algorithms Through Artistic Expression
    Mynah Marie

    Creating music or visuals on the fly using code is fun. But is it more than that? Can we find deeper implications in the practice of live coding than pure entertainment? Is it possible to express “human emotions” using algorithms? In this talk, Mynah Marie will give an overview of the particularities of the creative process when using a programming language as a medium of expression. She’ll also give an overview of various creative approaches and the motivations for choosing one over another. Finally, she’ll take a closer look at concrete benefits that the practice of live coding can bring, on an individual scale as well as on a community level and open up the discussion about potentials and possibilities for the future.

  • 4:05PM – 4:33PM

    FashionTech for all Futures
    Chelsea Klukas

    The Future Looks Fabulous! Chelsea Klukas has been working at the intersection of Fashion and Technology for over 8 years. Her in fashion work includes projection mapping, sensors, and new hardware development for augmenting human expression through wearables. Learn how MakeFashion and Lumen Couture have developed, and the journey of working with artists, rapid prototyping, and bringing far-out concepts to market.

  • 4:33PM – 4:35PM

    HalfStack Outtakes and break
  • 4:35PM – 4:38PM

    Deep Thoughts with Dylan Schiemann Part 4: Thought Scrolling
    Dylan Schiemann

    Jack Handey or Dylan Schiemann, the debate concludes.

  • 4:38PM – 5:17PM

    Data Visualizations, Internationalization, and COVID-19
    Naomi Meyer

    Building custom data visualizations with full international support is not always easy.

    This past year, Naomi has worked to add new data visualizations features and modify legacy visualizations, for an international audience - on her team at Adobe. It’s been a learning process to correctly format strings, numbers, dates, times, currencies, calendars, x/y axis, and more!

    In this talk, Naomi will share some of the useful techniques she's learned about customizing data visualizations for a global audience. With a focus on JavaScript and high level ideas to keep in mind when designing, coding, testing, internationalizing, and localizing data visualizations for the world including some COVID-19 visualizations.

  • 5:17PM – 6:30PM

    JS Danger
    JS Party

    JS Party’s don’t-call-it-jeopardy game show where 3 contestants put their web dev knowledge to the test. Can you out-wit our “expert” panel? Play along to find out!

  • 6:30PM – 7:01PM

    Hacking programmer patterns into Age of Empires
    Alex Blom

    Before Minecraft there was Age of Empires - and the scenario editor. The editor allowed players to create custom maps for single and multi player use. What was originally a simple system for map design was wildly extended by players - to include flying dragons, health and management systems, RPG style games and even rudimentary source protection. The engine supported none of this.

    As JavaScript developers we’re used to extending tools beyond their intended use. This talk will be a fun reflection on the lengths early mapping communities went to create crazy workarounds - such as while loops - in tools never designed to support such complex logic.

  • 7:01PM – 7:32PM

    Full 3D worlds in plain old CSS & JavaScript
    Pantelis Kalogiros

    Can we build full 3D worlds using only CSS? Do we need to wait for widespread WebGL2 and webGPU adoption before we start building our next project?

    We will delve deep into the inner workings of CSS and 3D transformations, and explore how to build complex and fast web experiences with common place APIs. We could have been doing it all this time! We will also explore how the browser's rendering pipeline works and how we can structure our JS code for achieving realtime performance.

  • 7:32PM – 7:42PM

    8 Million Reasons to Fail
    Amie Dansby

    Amie's background is in Game Programming and Simulation and she started her career at Marvel Studios, working on Captain America and X-Men Destiny. She's a full time software developer and active in the maker, LEGO, hacker and cosplay communities, and continues to obsess over new technologies.

  • 7:42PM – 7:44PM

    Quick recap before the final music performance

  • 7:44PM – 8:18PM

    Live Coding Music Ensemble by Supercontinent

    Experience this incredible live coding music ensemble featuring David Ogborn (Dundas, Canada, @_dktr0), Eldad Tsabary (Montreal, Canada, @eldadtsabary), Abhinay Khoparzi (Allahabad, India, @khoparzi), Shelly Knotts (Newcastle Upon Tyne, UK, @shelly_knotts), Chiho Oka (Tokyo, Japan, @chihooka, Jessica Rodriguez (Hamilton, Canada, @Jessica31249273, Melandri Laubscher (Cape Town, South Africa), Celeste Betancur (Medellín, Colombia), and Mynah Marie (@EarthAbigail)!

  • 8:18PM – 8:30PM

    Fin

    We'll stay on the stream for about 10 minutes to give people time to wrap up the end of the day!

Presenters

  • Dylan Schiemann

  • Charlie Gerard

  • Kilian Valkhof

  • Guy Wilson

  • Chris Heilmann

  • Srushtika Neelakantam

  • Jonathan Fielding

  • Ramon Huidobro

  • Mynah Marie

  • Michael Jolley

  • Richard Bultitude

  • Ada Rose Cannon

  • Joe Hart

  • Tony Edwards

  • Dylan Beattie

  • Jen Looper

  • Joe Karlsson

  • Ken Wheeler

  • Rahat Chowdhury

  • Chelsea Klukas

  • Naomi Meyer

  • JS Party

  • Alex Blom

  • Pantelis Kalogiros

  • Amie Dansby

  • Jo Franchetti

Proudly sponsored by

  • Salesforce Engineering
  • mozilla
  • Lowe's
  • SitePen
  • Workiva
  • ag-Grid
  • Choice Hotels
  • GoDaddy
  • orangejellyfish
  • Now4real
  • EventHandler
  • CMD
  • Formidable
  • Dazn
  • Nrwl
  • Twilio
  • Mark 43
  • Wix Engineering
  • Induro
  • Esri
  • FabConFab
  • durchblicker
  • Trigo
  • TalkScript
  • mod streaming
  • Samsung Internet
  • DHD
  • Tidelift
  • Not a Bot
  • Future Sync
  • Venturplex
  • Isle of Code
  • Iced Dev
  • Tito
  • GitKraken
  • Balsamiq
  • OddBird
  • Signature Consultants
  • Kontent
  • Snyk
  • Sticker Mule
  • InfoQ
  • QCon
  • React GraphQL Academy
  • Manning Publications
  • JS Party
  • OpenJS Foundation
  • Polypane