Full Spectrum File Uploads

If you had to build a website that supported user-uploaded files, how would you do that? Would you feel confident that you did it right?

In this talk, we'll walk through all the implementation details and considerations around supporting file uploads in your application. It covers networking, frontend, backend, and architecture, broken into seven sections:

- Understand underlying HTTP
- Enable file uploads in HTML
- Improve user experience with JavaScript
- Receive uploads in Node.js
- Reduce storage costs with Object Storage
- Optimize delivery performance with a CDN
- Securing uploads & malware protection

We'll look at examples using specific tools and implementation, as well lower level and fundamental concepts that you can apply to any application stack.

The various stages of developing AI applications

The world of AI is exploding right now and we're seeing more and more applications adopt some sort of use-case.

In this talk, I'll discuss the different steps I took in my journey to learning about AI. From making my first OpenAI API request, to streaming chat responses, to understanding what an LLM is, and finally, deploying a self-hosted chat-bot.

This is more focused on practical steps and considerations to make to add AI tooling into your application. This is not going to answer the question, "have we accidentally invented Sky Net"

Let's build our first AI chatbot with OpenAI

Want to build the next big AI tool? Great! In this workshop, we'll learn about what AI tools are available, how they work, and how to get started building AI tools using OpenAI.

We'll have some time to workshop issues and ideas, so you can take the initial project and make it your own.

Finally, we'll even get the project deployed to your own VPS, so you can share it with the world.

This workshop is an introduction for web developers to start integrating AI into your projects, so you aren't expected to have much experience with AI.

You should, however, be familiar with web development technologies. Be comfortable working with the command line, know some basic HTML, CSS, and JavaScript, and be familiar with dealing with HTTP requests and responses.

In addition to that knowledge, here are some technical requirements that would be helpful to sort out before showing up:
- Have an OpenAI account (platform.openai.com/signup) with credits and an API key ready
- Have a domain name if you want to deploy publicly
- Have a VPS available if you want to deploy publicly. If you don't have one and would like one, you can sign up for Linode at linode.com/austingil to get $100 in free credits
- Bring a laptop with Node.js, NPM, Git, and a code editor installed
- Clone github.com/austingil/versus then from the project's root, run the 'npm install' command to download dependencies

Please do all this before the day of the workshop so that we can hit the ground running and not have to worry about clogging up the wifi bandwidth by downloading tons of dependencies at the same time.

JSDocs: It's like TypeScript for the rest of us (workshop)

If you’re a JavaScript developer, chances are, you’ve heard about TypeScript. In this talk, I want to share an alternative approach to incrementally enable type-checking without all the tooling.

JSDocs allows you to can introduce type-checking into your project bit-by-bit as it makes sense. You can stick to working within JavaScript projects, or adopt TypeScript syntax when and were it makes sense for you and your team.

I break it into four stages:
- Enabling type-checking in a JavaScript file
- Enabling type-checking in a whole JavaScript project
- Integrating type-checking into CI/CD Pipeline
- Generating type definitions for Open-Source Libraries

To get even more out of this talk, bring your own JavaScript project. Everything we cover can be applied to an existing project :)

Everything you should know about Edge Compute

Edge compute is a new addition to an already complex landscape of compute options: client-side rendering, server-side rendering, static site generation, and more.

Each comes with its own challenges and opportunities. In this talk, we'll look at the existing compute continuum and see where edge fits in. Then we'll take a deeper dive over the edge and cover its unique qualities and limitations. Finally, we'll break down example applications and see where each layer of compute provides its greatest value.

By the end of this talk, you should have a better understanding of the various layers of compute, the specifics of edge compute, and how it all works together to build amazing products at scale.

What's a dev gotta do to make a div around here?

An in-depth journey following your code from conception in the editor through the awkward build processes into deployment pipelines out to the real world of public internet and off to its final destination, being rendered in a user's browser.

The internet has become a complex place. With the advent of frameworks, build tools, and deployment services, the distance between developers and browsers is growing. Developer Experience has improved, but with these abstractions, we've introduced layers of obscurity.

This talk is intended for web developers of all skill levels, as it fills the gaps in knowledge of how our work works. The information is not critical, but it's fascinating nonetheless.

We'll take a deep dive into what happens after you hit save, what processes take place to get your code transformed for production, how does it get deployed, how it gets to the user, and the steps the browser takes to actually render the page.

By the end of this talk, you should have a better understanding of the following:
- Dev servers
- Bundlers
- Transpilers
- CI/CD
- DNS Lookups
- TCP/IP
- SSL/TLS
- HTTP
- Critical Render Path

Maintainable & Resilient Projects Through Internal UI Libraries

In this talk I’ll discuss the benefits of creating your own, internal UI library. It’s something I consider to be a best practice which will make your applications more maintainable and resilient to change. We’ll look at what it means, how to begin, and what options are available to help you.

Vuetensils: A Tasty Toolset for Vue.js

What began as a repository of common UI patterns that I've been copying and pasting from project to project would eventually be published with the hopes of making the web more accessible, without compromising on performance or bespoke styles. It took years of research, trial-and-error, and hours coming up with a clever name. Today, Vuetensils provides a collection of naked UI components providing the markup, accessibility, and functionality you want, and nothing more. You bring the styles.

Lessons learned building a Vite tranpiler plugin

One day, I had an idea for a JavaScript library that was going to change the world. It would allow me to write code one way in development, but run differently in production. This led me down the wonderful world of transpilers and Vite plugins.

Turns out, it's kind of hard to write a perfect library that changes the world. Mine turned out to be a bit crap, but the good news is that I learned a lot and want to share with you, so yours will be even better!

In this talk, we'll look at taking an idea from a concept to a creation, what a transpiler is and why we need one, how to write a plugin to transform code into better code, and some considerations around library designs.

JSDocs: It's like TypeScript for the rest of us

If you’re a JavaScript developer, chances are, you’ve heard about TypeScript. In this talk, I want to share an alternative approach to incrementally enable type-checking without all the tooling.

JSDocs allows you to introduce type-checking into your project bit-by-bit as it makes sense. You can stick to working within JavaScript projects, or adopt TypeScript syntax when and where it makes sense for you and your team.

I break it into four stages:
Enabling type-checking in a JavaScript file
Enabling type-checking in a whole JavaScript project
Integrating type-checking into CI/CD Pipeline
Generating type definitions for Open-Source Libraries

Make Accessibility Easier to Get Right and Harder to Get Wrong (workshop)

Want to learn about accessibility through hands-on experience? Then check out this workshop where we'll go over these highlights:

- Gain practical knowledge around disabilities and accessibility without getting overwhelmed.
- Discover tools and methods to improve how you audit your own projects for accessibility.
- Practice hand-on empathy exercises.
- Learn how to navigate applications with a keyboard and screen-reader.
- Build reusable components that enforce accessible practices.
- Recognize common pitfalls in component design.
- Incorporate tooling to catch errors in your editor, UI, Git workflow, repository, and CI/CD pipeline.

Building Super-Powered Forms For the Web (workshop)

Forms are foundational for almost every website you interact with today. So shouldn’t we invest in building the best forms we can?

I spent several years studying everything about forms that I could. Now, I want to show you how to use modern techniques to build forms with super powers.

Things you'll learn:
- The perfect markup for semantic, accessible inputs
- CSS-only UX improvements that no longer need JS
- Custom input validation without a library
- Using JavaScript to improve accessibility
- Submitting forms without a full page reload
- Adding retry logic on failed submissions
- Preventing data-loss from reloads or navigation
- Avoiding race-conditions on multiple requests
- Building forms that work even when JavaScript fails
- Ways we can improve server-side APIs

We'll be doing everything from scratch and cover several examples and look at both the frontend and backend considerations, all while focusing on:
- Semantics
- Accessibility
- Design
- User experience
- Progressive Enhancement

Make Accessibility Easier to Get Right and Harder to Get Wrong

Want to build accessible websites, but worried you're not an accessibility expert? Let's make things easier for everyone by building accessibility supports into the entire development lifecycle.

We'll look at integrating tools in:
- Design tools
- Code editor
- Components
- Browser
- Tests
- Git repos
- CI/CD pipelines

This will help you and your team avoid some of the most common accessibility issues, and free up more time for the a11y folks to work on bigger issues.

Building Superpowered Forms For the Web

Forms are foundational for almost every website you interact with today. So shouldn’t we invest in building the best forms we can?

I spent several years studying everything about forms that I could. Now, I want to show you how to use modern techniques to build forms with superpowers.

Things you'll learn:
- The perfect markup for semantic, accessible inputs
- CSS-only UX improvements that no longer need JS
- Custom input validation without a library
- How JavaScript can improve accessibility
- Submitting forms without a full page reload
- Adding retry logic on failed submissions
- Preventing data-loss from reloads or navigation
- Avoiding race-conditions on multiple requests
- Building forms that work even when JavaScript fails
- Ways we can improve server-side APIs