Syntax &#8211; Tasty Web Development Treats

838: Productivity Tools for Web Developers Oct 23, 2024

Show notes

Get your productivity game on point! Scott and Wes serve up the best tools for web developers, covering everything from password managers and to-do apps to mind-mapping tools and little scripts that make life easier. Plus, find out what snippet managers they swear by and how they keep their email under control.

Show Notes

00:00 Welcome to Syntax!
03:01 Brought to you by Sentry.io.
03:44 Syntax meetup San Francisco.
04:26 Breakdancing update.
- Kid Cruz Instagram.
05:18 Password management.
- 1Password.
08:30 Apple stomping on apps.
09:50 To-do applications.
- Things.
- Getting Things Done.
- Tweek.
18:18 To-do in code.
- Todo Tree.
- Better Comments.
20:21 Snippets.
25:55 Mind-mapping.
- MindNode.
- FigJam.
29:01 Note-taking.
- Obsidian.
- Stashpad.
- ObservableHQ.
- Jupyter.
36:34 Little scripts.
- Script Kit.
39:50 Email.
- Superhuman.
48:11 Some honorable mentions.
- Habitpath.io.
- Focus.
52:10 Sick Picks + Shameless Plugs.

Sick Picks

Scott: The Legend of SwordQuest.
Wes: The Economics of Everyday Things.

Hit us up on Socials!

837: You Should Drop Express and Try Hono Oct 21, 2024

Show notes

CJ joins Scott and Wes to dive into why he’s all-in on Hono, a fast and lightweight web framework for every JavaScript runtime. From familiar route creation to type-safe middleware, find out how Hono keeps things simple, powerful, and ready to use inside Next.js.

Show Notes

00:00 Welcome to Syntax!
00:46 Brought to you by Sentry.io.
01:11 What is Hono?
- Watch CJ’s Video Here
03:21 Syntax Meetup San Francisco.
04:02 Why I like Hono, and why you should try it.
04:08 Familiar route creation.
- Connect: an extensible HTTP server framework for node.
05:45 Supports every JS Runtime.
07:00 How a service worker works.
08:48 Helpers.
09:16 Middleware.
10:40 Sentry middleware.
10:55 JSX support.
13:21 Organizing route handlers while keeping Types.
14:24 Type safety.
- hono-open-api-starter.
- zod-openapi.
15:46 Defining base type.
- Pinojs
17:36 Validation.
18:52 Hono RPC client.
22:09 Hono inside of Next.js.
23:30 Testing.
25:22 The community.
27:34 Type support.

Hit us up on Socials!

836: Real Talk on Web Accessibility with Marcy Sutton Todd Oct 18, 2024

Show notes

835: How to Pick a JavaScript Framework Oct 16, 2024

Show notes

Do you really need a framework? Scott and Wes bring on CJ to break down when frameworks like Vue, Svelte, and Astro are worth it—and when they might just add complexity. They dive into everything from rendering strategies to auth solutions, deployment options, and how to choose the right tool for the job.

Show Notes

00:00 Welcome to Syntax!
01:32 Brought to you by Sentry.io.
03:17 What is a framework?
- Syntax Meetup San Francisco.
08:21 Examples of frameworks for Vue, Svelte and Angular.
12:39 What questions do you need to answer?
12:44 What or where do you need to ship?
14:12 How do you render it?
18:22 Where are you deploying it?
24:03 How do you store data?
24:09 Existing API.
26:03 Integrated server.
26:22 Database.
- Supabase.
26:59 Does it have RPC or server actions?
34:27 Do you need authentication?
38:45 Auth packages.
- LuciaJS.
- Lucia announcement.
- Lucia preview.
- NPM Arctic Oauth.
- Auth utilities.
- Better-Auth.
- Scott’s Drop-In Auth.
42:10 Does it include email?
42:52 What does the TypeScript story look like?
43:32 How does it handle images?
44:35 How do we work with CSS?
46:02 How long has it been around?
47:37 How mature is the ecosystem?
48:35 Is there community support?
50:21 Portability.
51:18 Hiring.
52:17 Sick Pick + Shameless Plugs.

Sick Picks

Shameless Plugs

Scott: Syntax on YouTube

Hit us up on Socials!

834: AI Will Improve Your Web Development Workflow Oct 14, 2024

Show notes

Scott and Wes serve up ways developers can use AI tools like Claude, GitHub Copilot, and more to boost productivity. From error tracing to refactoring code and automating mundane tasks, they break down how AI can handle the heavy lifting so you can focus on the fun stuff!

Show Notes

00:00 Welcome to Syntax!
01:23 Brought to you by Sentry.io.
01:43 Using AI tools effectively.
05:29 Stack trace reading and error finding.
08:37 San Francisco Syntax Meetup!
09:19 Research and validation.
12:19 Completing mundane tasks.
14:10 Refactoring.
18:56 Simple typescript.
20:29 Summarizing docs and source code.
23:56 Quick hits.

Hit us up on Socials!

833: Next Gen Fullstack React with TanStack Oct 11, 2024

Show notes

Scott and Wes talk with Tanner Linsley, creator of TanStack, about the React ecosystem, and the evolution and futue of TanStack’s suite of tools, including TanStack Router and TanStack Start.

Show Notes

00:00 Welcome to Syntax!
02:59 What is TanStack Start?
- UnJS
- Nitro
- Vinxi
06:17 What is the Vite Environment API?
07:21 Was it always the plan to use Vite?
08:02 TanStack Router and client-side vs server-side
16:18 How TanStack Start will work
27:26 Moving from Create React App to TanStack
30:42 Brought to you by Sentry.io
31:15 Will TanStack Router ever support other frameworks?
33:54 How will TanStack Start handle forms?
36:13 TanStack Virtual
39:41 What is the future of TanStack?
- Convex
42:49 How Tanner writes documentation
47:55 Server functions and middleware
54:41 When will TanStack Start be in beta?
57:00 Sick Picks + Shameless Plugs

Sick Picks

Tanner:
- LG C4
- Ultra Slim Fit TV Wall Mount

Shameless Plugs

Tanner:
- TanStack Blog
- @TKDodo

Hit us up on Socials!

832: Potluck: When to Use a Framework × Goodbye Webpack × Custom Events in React + More! Oct 09, 2024

Show notes

Scott and Wes answer your burning questions! They cover everything from moving off create-react-app and the benefits of Next.js, to transitioning from junior to senior dev, working with QA teams, and even dive into game development with Godot.

Show Notes

00:00 Welcome to Syntax!
00:31 DenverScript.
03:14 Brought to you by Sentry.io.
03:54 Question 1: Moving off create-react-app.
- Proposal: TC39 Import Attributes.
- HTML iframe srcdoc Attribute.
09:10 Question 2: Working together with QA teams.
13:46 Question 3: Benefits of React with Next.js Framework.
- Svelte Turnstile.
- Next.js Pages Router vs Next.js App Router.
17:38 Question 4: What are your real names?
19:22 Question 5: Thoughts on RTO and WFH.
27:50 Question 6: Where can I find you Sick Picks?
- Sick Picks.
- Sick Picks Scraper.
29:34 Question 7: From JR developer to SR developer.
31:41 Question 8: Godot and game development.
- Godot Engine.
- GDScript.
- Phind.
39:37 Question 9: Inherent advantage between Callbacks and Events.
44:44 Question 10: Transitioning to freelance with corporate experience.
49:44 Question 11: Dealing with negative feedback.
57:05 Sick Picks & Shameless Plugs.

Sick Picks

Scott: audiobookshelf, Plappa App.
Wes: New Syntax Swag.

Shameless Plugs

Scott: Syntax on YouTube.

Hit us up on Socials!

831: Preventing Spam and Fraud Oct 07, 2024

Show notes

From CAPTCHAs to shadow banning, Scott and Wes break down the best strategies for keeping your app safe from spam and fraud. They cover tools like email verification, rate limiting, shadow banning, and more to protect your users and data.

Show Notes

00:00 Welcome to Syntax!
00:15 The problem.
02:47 Brought to you by Sentry.io.
04:23 CAPTCHA.
06:24 Data collection.
07:11 Stripe Radar score calculation.
09:12 Rate limiting.
11:34 Shadow banning.
13:53 Email verification.
15:38 Tie to accounts.
16:23 Tied to real identity.
19:36 Manual approval.
21:19 Blocking ASN.
23:17 Honey pot field.
24:28 SMS verification.
25:05 Mechanical Turk.

Hit us up on Socials!