├── .eslintignore ├── .eslintrc.cjs ├── .gitignore ├── .npmrc ├── .prettierignore ├── .prettierrc ├── README.md ├── package.json ├── pnpm-lock.yaml ├── src ├── app.d.ts ├── app.html ├── hooks.server.ts ├── lib │ ├── Controls.svelte │ ├── Tip.svelte │ ├── constants.ts │ ├── get_repo_file.ts │ ├── get_repo_files.ts │ └── html_to_markdown.ts ├── routes │ ├── +layout.server.ts │ ├── +layout.svelte │ ├── +page.svelte │ ├── api │ │ ├── login │ │ │ └── +server.ts │ │ └── oauth │ │ │ └── +server.ts │ ├── shows │ │ ├── +page.server.ts │ │ ├── +page.svelte │ │ └── [id] │ │ │ ├── +page.server.ts │ │ │ └── +page.svelte │ └── style.css └── shows │ ├── 000 - Syntax Preview.md │ ├── 001 - React Tools.md │ ├── 002 - Webcam and audio access with WebRTC and getUserMedia().md │ ├── 003 - CSS Preprocessors and Structuring CSS.md │ ├── 004 - JavaScript Tooling.md │ ├── 005 - How to Slam Dunk Freelancing.md │ ├── 006 - Accepting Money on the Internet.md │ ├── 007 - Scott Tolinski Origin Story.md │ ├── 008 - Wes Bos Origin Story.md │ ├── 009 - JavaScript Utility Libraries.md │ ├── 010 - CSS in JS.md │ ├── 011 - Productivity Hot Tips.md │ ├── 012 -Why is Everyone Switching to VS Code.md │ ├── 013 - The Command Line for Web Developers.md │ ├── 014 - Our Stacks Explained.md │ ├── 015 - Advice for Newbies.md │ ├── 016 - QA.md │ ├── 017 - Buzz Words.md │ ├── 018 - CSS Grid.md │ ├── 019 - Conferences.md │ ├── 020 - Fitness.md │ ├── 021 - CSS4.md │ ├── 022 - Failure.md │ ├── 023 - 2017 In Review.md │ ├── 024 - What is CSS BEM.md │ ├── 025 - Breakout Email Management.md │ ├── 026 - Redux.md │ ├── 027 - GraphQL.md │ ├── 028 - Async Await.md │ ├── 029 - Hosting.md │ ├── 030 - QA.md │ ├── 031 - Personal.md │ ├── 032 - Sending Email.md │ ├── 033 - Images, Videos and Big Zips.md │ ├── 034 - Static Site Generators.md │ ├── 035 - Keeping Up.draft.md │ ├── 035 - Keeping Up.md │ ├── 036 - Freelancing Hot Tips.md │ ├── 037 - Recording Setups.md │ ├── 038 - 20 Performance Tips.md │ ├── 039 - Is jQuery Dead.md │ ├── 040 - Testing.md │ ├── 041 - BURNOUT.md │ ├── 042 - potluck.md │ ├── 043 - Method Madness.md │ ├── 044 - Learning.md │ ├── 045 - potluck.md │ ├── 046 - What's New in Javascript.md │ ├── 047 - How to Get Better at Debugging.md │ ├── 048 - VS Code Round Two.md │ ├── 049 - potluck.md │ ├── 050 - Progressive Web Apps.md │ ├── 051 - Workflows.md │ ├── 052 - Marketing.md │ ├── 053 - Domain Management.md │ ├── 054 - Potluck copy.md │ ├── 055 - Roles.md │ ├── 056 - Design Systems.md │ ├── 057 - Dot Files.md │ ├── 058 - Advice for Beginners.md │ ├── 059 - Refactoring.md │ ├── 060 - The Undocumented Web.md │ ├── 061 - Lock files.md │ ├── 062 - Potluck.md │ ├── 063 - Cross-Origin.md │ ├── 064 - Gear.md │ ├── 065 - curriculum.md │ ├── 066 - React.md │ ├── 067 - Goals.md │ ├── 068 - Design.md │ ├── 069 - Framer.md │ ├── 070 - Potluck.md │ ├── 071 - Stumped.md │ ├── 072 - Accessibility.md │ ├── 073 - Documentation.md │ ├── 074 - habits.md │ ├── 075 - Feedback.md │ ├── 076 - Specialization.md │ ├── 077 - Positivity.md │ ├── 078 - Potluck.md │ ├── 079 - Stumped.md │ ├── 080 - New JS.md │ ├── 081 - Hacktoberfest.md │ ├── 082 - New JS Part 2.md │ ├── 083 - Old Browsers.md │ ├── 084 - Fitness.md │ ├── 085 - CSS Grid and Flexbox.md │ ├── 086 - Potluck.md │ ├── 087 - Polyfills.md │ ├── 088 - Checklist.md │ ├── 089 - Stumped.md │ ├── 090 - LIVE.md │ ├── 091 - Stickers.md │ ├── 092 - React Hooks.md │ ├── 093 - Liked.md │ ├── 094 - Potluck.md │ ├── 095 - Dependency.md │ ├── 096 - Gift Guide.md │ ├── 097 - CSS Variables.md │ ├── 098 - State of Javascript.md │ ├── 099 - Running a Business.md │ ├── 100 - Episode 100.md │ ├── 101 - where are they now.md │ ├── 102 - Potluck.md │ ├── 103 - where are they now part 2.md │ ├── 104 - CSS Layout.md │ ├── 105 - Pointer Elements.md │ ├── 106 - Year in Review.md │ ├── 107 - CSS Units.md │ ├── 108 - Potluck.md │ ├── 109 - CSS Grid 2.md │ ├── 110 - Balance.md │ ├── 111 - tidying up code.md │ ├── 112 - freelance.md │ ├── 113 - code tidying.md │ ├── 114 - freelance part 2.md │ ├── 115 - code quality.md │ ├── 116 - Potluck.md │ ├── 117 - email.md │ ├── 118 - smart home.md │ ├── 119 - side projects.md │ ├── 120 - gatsby-vs-next.md │ ├── 121 - youtube.md │ ├── 122 - life management.md │ ├── 123 - authentication.md │ ├── 124 - potluck.md │ ├── 125 - communication.md │ ├── 126 - bootcamps.md │ ├── 127 - react suspense.md │ ├── 128 - freelance clients.md │ ├── 129 - Frontend Frameworks.md │ ├── 130 - vue.md │ ├── 131 - bike shedding.md │ ├── 132 - potluck.md │ ├── 133 - portfolios.md │ ├── 134 - live.md │ ├── 135 - cranky devs.md │ ├── 136 - working remotely.md │ ├── 137 - css frameworks.md │ ├── 138 - new in web dev.md │ ├── 139 - ama.md │ ├── 140 - potluck.md │ ├── 141 - async await.md │ ├── 142 - travis neilson.md │ ├── 143 - shadow dom.md │ ├── 144 - side hustles.md │ ├── 145 - ama.md │ ├── 146 - CSS cool parts.md │ ├── 147 - weaknesses.md │ ├── 148 - potluck.md │ ├── 149 - workshops.md │ ├── 150 - gatsby themes.md │ ├── 151 - std lib.md │ ├── 152 - debugging.md │ ├── 153 - intl methods.md │ ├── 154 - SVGs.md │ ├── 155 - growth.md │ ├── 156 - potluck.md │ ├── 157 - headless cms.md │ ├── 158 - fundamentals.md │ ├── 159 - front end security.md │ ├── 160 - graphql and wordpress.md │ ├── 161 - vscode.md │ ├── 162 - js fundamentals.md │ ├── 163 - Web Dev Sick Picks.md │ ├── 164 - Kanye West.md │ ├── 165 - VS Code Part 2.md │ ├── 166 - What is State Potluck.md │ ├── 167 - VSCode Love Part 3.md │ ├── 168 - Blogging.md │ ├── 169 - Remote internet.md │ ├── 170 - State in React.md │ ├── 171 - How To Publish A React Component To NPM.md │ ├── 172 - Potluck.md │ ├── 173 - svelte.md │ ├── 174 - APIs.md │ ├── 175 - stumpd.md │ ├── 176 - steam.md │ ├── 177 - PHP to Node.md │ ├── 178 - courses.md │ ├── 179 - TLD.md │ ├── 180 - potluck.md │ ├── 181 - automating stuff.md │ ├── 182 - practical.md │ ├── 183 - habits.md │ ├── 184 - single codebase.md │ ├── 185 - feature release planning.md │ ├── 186 - potluck.md │ ├── 187 - float tank.md │ ├── 188 - server side.md │ ├── 189 - SSR.md │ ├── 190 - WordPress.md │ ├── 191 - iphone.md │ ├── 192 - spooky.md │ ├── 193 - spooky.md │ ├── 194 - potluck.md │ ├── 195 - domains.md │ ├── 196 - design.md │ ├── 197 - CSS.md │ ├── 198 - problem solving.md │ ├── 199 - courses.md │ ├── 200.md │ ├── 201 - CSS.md │ ├── 202 - potluck.md │ ├── 203 - github actions.md │ ├── 204 - gift guide.md │ ├── 205 - macbooks.md │ ├── 206 - state.md │ ├── 207 - courses.md │ ├── 208 - year end.md │ ├── 209 - Keystone.md │ ├── 210 - potluck.md │ ├── 211 - node modules.md │ ├── 212 - pika.md │ ├── 213 - firefox.md │ ├── 214 - fitness.md │ ├── 215 - uses.md │ ├── 216 - tech.md │ ├── 217 - community.md │ ├── 218 - potluck.md │ ├── 219 - skills.md │ ├── 220 - synology.md │ ├── 221 - hobbies.md │ ├── 222 - GUIs.md │ ├── 223 - framer.md │ ├── 224 - serverless.md │ ├── 225 - servers.md │ ├── 226 - potluck.md │ ├── 227 - queries.md │ ├── 228 - serverless.md │ ├── 229 - cloudflare.md │ ├── 230 - soft skills.md │ ├── 231 - hiring.md │ ├── 232 - react hooks.md │ ├── 233 - purchasing.md │ ├── 234 - potluck.md │ ├── 235 - passwords.md │ ├── 236 - mental.md │ ├── 237 - abstraction.md │ ├── 238 - wfh.md │ ├── 239 - 5 things.md │ ├── 240 - emergency ui.md │ ├── 241 - 5 more things.md │ ├── 242 - potluck.md │ ├── 243 - prettier.md │ ├── 244 - potluck.md │ ├── 245 - js events.md │ ├── 246 - bootcamps.md │ ├── 247 - new website.md │ ├── 248 - new in JS.md │ ├── 249 - new website.md │ ├── 250 - scott teaches wes.md │ ├── 251 - IE11.md │ ├── 252 - potluck.md │ ├── 253 - slow connection.md │ ├── 254 - headless cms breakdown.md │ ├── 255 - slow connection 2.md │ ├── 256 - webrtc.md │ ├── 257 - scott goes linux.md │ ├── 258 - fundamentals leftovers.md │ ├── 259 - css functions.md │ ├── 260 - potluck.md │ ├── 261 - rural internet.md │ ├── 262 - react wish list.md │ ├── 263 - forms.md │ ├── 264 - jerome hardaway.md │ ├── 265 - domains.md │ ├── 266 - video.md │ ├── 267 - turbolinks.md │ ├── 268 - potluck.md │ ├── 269 - target.md │ ├── 270 - meteor.md │ ├── 271 - upgrading.md │ ├── 272 - react roundup.md │ ├── 273 - process.md │ ├── 274 - css.md │ ├── 275 - gatsby.md │ ├── 276 - potluck.md │ ├── 277 - stumpd.md │ ├── 278 - potluck.md │ ├── 279 - season wrap.md │ ├── 280 - potluck.md │ ├── 281 - backyard offices.md │ ├── 282 - webdev past.md │ ├── 283 - timeblock.md │ ├── 284 - good CSS.md │ ├── 285 - first bucks.md │ ├── 286 - git fundamentals.md │ ├── 287 - records.md │ ├── 288 - web dev past.md │ ├── 289 - enums.md │ ├── 290 - potluck.md │ ├── 291 - restarting.md │ ├── 292 - freelancing.md │ ├── 293 - stretching.md │ ├── 294 - spooky.md │ ├── 295 - temporary date.md │ ├── 296 - spooky.md │ ├── 297 - certifications.md │ ├── 298 - voice coding.md │ ├── 299 - bundlers.md │ ├── 300.md │ ├── 301 - css grid.md │ ├── 302 - conferences.md │ ├── 303 - validation.md │ ├── 304 - potluck.md │ ├── 305 - commits.md │ ├── 306 - gift guide.md │ ├── 307 - react hooks.md │ ├── 308 - gatsby.md │ ├── 309 - tech chat.md │ ├── 310 - severless.md │ ├── 311 - ps5.md │ ├── 312 - potluck.md │ ├── 313 - hosting.md │ ├── 314 - 2020.md │ ├── 315 - productivity.md │ ├── 316 - predictions.md │ ├── 317 - nothing.md │ ├── 318 - reactathon.md │ ├── 319 - css.md │ ├── 320 - potluck.md │ ├── 321 - avif.md │ ├── 322 - deno.md │ ├── 323 - levelup.md │ ├── 324 - typescript.md │ ├── 325 - keyboard.md │ ├── 326 - reviews.md │ ├── 327 - ts compilers.md │ ├── 328 - potluck.md │ ├── 329 - cypress.md │ ├── 330 - react query.md │ ├── 331 - hireable skills.md │ ├── 332 - desk setups.md │ ├── 333 - ask us anything.md │ ├── 334 - potluck.md │ ├── 335 - env variables.md │ ├── 336 - auth.md │ ├── 337 - graphql codegen.md │ ├── 338 - syntax highlight.md │ ├── 339 - n1.md │ ├── 340 - servers.md │ ├── 341 - vscode.md │ ├── 342 - potluck.md │ ├── 343 - css nesting.md │ ├── 344 - dev tools.md │ ├── 345 - container queries.md │ ├── 346 - tshirts.md │ ├── 347 - git rebase.md │ ├── 348 - typescript fundamentals.md │ ├── 349 - future tech.md │ ├── 350 - potluck.md │ ├── 351 - technical debt.md │ ├── 352 - potluck.md │ ├── 353 - stylin.md │ ├── 354 - HTML elements.md │ ├── 355 - drag and drop.md │ ├── 356 - bike shedding.md │ ├── 357 - money.md │ ├── 358 - react-typescript.md │ ├── 359 - vaccine bot.md │ ├── 360 - potluck.md │ ├── 361 - sveltekit.md │ ├── 362 - miriam suzanne.md │ ├── 363 - CSRF.md │ ├── 364 - potluck.md │ ├── 365 - js proposals.md │ ├── 366 - dev tools.md │ ├── 367 - js buzz words.md │ ├── 368 - syntax highlight.md │ ├── 369 - vite.md │ ├── 370 - react 18.md │ ├── 371 - CSS linting.md │ ├── 372 - potluck.md │ ├── 373 - favicons.md │ ├── 374 - shoptalk.md │ ├── 375 - git the latest.md │ ├── 376 - potluck.md │ ├── 377 - utility types.md │ ├── 378 - beginners.md │ ├── 379 - link tag.md │ ├── 380 - potluck.md │ ├── 381 - css.md │ ├── 382 - new devs.md │ ├── 383 - toxic clients.md │ ├── 384 - stumped.md │ ├── 385 - typescript.md │ ├── 386 - potluck.md │ ├── 387 - starlink.md │ ├── 388 - ES2022.md │ ├── 389 - webhooks.md │ ├── 390 - sveltekit.md │ ├── 391 - new tech.md │ ├── 392 - frontend feud.md │ ├── 393 - php.md │ ├── 394 - potluck.md │ ├── 395 - CSS Color.md │ ├── 396 - podcasting.md │ ├── 397 - utility functions.md │ ├── 398 - potluck.md │ ├── 399 - horror stories.md │ ├── 400 - horror stories.md │ ├── 401 - pnpm.md │ ├── 402 - stumpd.md │ ├── 403 - astro.md │ ├── 404 - tomek.md │ ├── 405 - nextjs.md │ ├── 406 - potluck.md │ ├── 407 - new laptops.md │ ├── 408 - troubleshooting.md │ ├── 409 - Github Co-pilot is Gonna Take ur Job.md │ ├── 410 - title.md │ ├── 411 - Meta tags.md │ ├── 412 - JavaScript and Hardware.md │ ├── 413 - How To Do Things In Svelte.md │ ├── 414 - Potluck - enums, WASM, Lighthouse, Redirects .md │ ├── 415 - Gatsby v4.md │ ├── 416 - GitPod, iPad Coding Web3 WTF NFT.md │ ├── 417 - Holiday Snackluk.md │ ├── 418 - 2021 In Review.md │ ├── 419 - JS One Liners.md │ ├── 420 - 2022 predictions.md │ ├── 421 - Remix.md │ ├── 422 - Potluck.md │ ├── 423 - CSS JS Hacks We’re Fine With.md │ ├── 424 - What to Focus on in 2022.md │ ├── 425 - Updating Project Dependencies.md │ ├── 426 - Monorepos.md │ ├── 427 - Teamwork Makes The Dream Work.md │ ├── 428 - Syntax Highlight.md │ ├── 429 - Pros and Cons of JavaScript Servers.md │ ├── 430 - Creator of Wordle.md │ ├── 431 - Code Explorers.md │ ├── 432 - Potluck.md │ ├── 433 - JavaScript in 2022.md │ ├── 434 - Ben Vinegar.md │ ├── 435 - This vs That.md │ ├── 436 - React to State of JS.md │ ├── 437 - Sticker drop.md │ ├── 438 - React to State of JS Part 2.md │ ├── 439 - SSR vs JamStack vs Serverless.md │ ├── 440 - Potluck Auth.md │ ├── 441 - SSL Certs, Approvals and Cloudflare.md │ ├── 442 - Our Stacks Explained.md │ ├── 443 - Vitest.md │ ├── 444 - portfolio review.md │ ├── 445 - Types in JS.md │ ├── 446 - Content creation.md │ ├── 447 - How To Be Consistent.md │ ├── 448 - potluck.md │ ├── 449 - 3D in the browser.md │ ├── 450 - potluck.md │ ├── 451 - Coupon engine.md │ ├── 452 - JavaScript STUMPd.md │ ├── 453 - Axios over Fetch.md │ ├── 454 - WTF is the Edge.md │ ├── 455 - TypeScript Fundamentals.md │ ├── 456 - 10 Browser APIs.md │ ├── 457 - Supper club monorepos.md │ ├── 458 - Why do we need Web Interop.md │ ├── 459 - Potluck.md │ ├── 460 - Supper club turbo repo.md │ ├── 461 - Scotts office.md │ ├── 462 - TypeScript Tooling.md │ ├── 463 - Supper Club Tom.md │ ├── 464 - Cache Control Headers Explained.md │ ├── 465 - git in vscode.md │ ├── 466 - Supper club.md │ ├── 467 - Stopping Malicious Actors.md │ ├── 468 - Syntax Live at Reactathon.md │ ├── 469 - Supper club No Code Connor Finlayson.md │ ├── 470 - New CSS.md │ ├── 471 - potluck.md │ ├── 472 - supper club.md │ ├── 473 - New Viewport Units.md │ ├── 474 - home automation.md │ ├── 475 - supperclub Tim Leland.md │ ├── 476 - Hasty browser.md │ ├── 477 - Communication.md │ ├── 478 - Supperclub DX with Shawn.md │ ├── 479 - CSS5.md │ ├── 480 - Speaking at conferences.md │ ├── 481 - Supperclub Voice coding.md │ ├── 482 - clamping.md │ ├── 483 - Potluck Peer Dependencies Vitest.md │ ├── 484 - Supperclub .md │ ├── 485 - stumpd.md │ ├── 486 - Code styles.md │ ├── 487 - Supper Club neo4js.md │ ├── 488 - hasty.md │ ├── 489 - Potluck Node.md │ ├── 490 - Supper club Syed Balkhi.md │ ├── 491 - Hasty Spark coding.md │ ├── 492 - Our Web Dev Wish List.md │ ├── 493 - Supper Club.md │ ├── 494 - Hasty Browsers and engines.md │ ├── 495 - Potluck.md │ ├── 496 - Supper Headless Commerce.md │ ├── 497 - CSS Proposals.md │ ├── 498 - Agency or solo work.md │ ├── 499 - Supper Rich Harris.md │ ├── 500 - Episode 500!.md │ ├── 501 - Fundamentals Web Workers.md │ ├── 502 - Supper Club Brandon Roberts.md │ ├── 503 - hasty Margins.md │ ├── 504 - Syntax highlight.md │ ├── 505 - Supper club with Steve Ruiz.md │ ├── 506 - Deno.md │ ├── 507 - Potluck.md │ ├── 508 - supperclub.md │ ├── 509 - hasty.md │ ├── 510 - Building an API in 2022.md │ ├── 511 - Supper club.md │ ├── 512 - AI and coding.md │ ├── 513 - Productivity.md │ ├── 514 - supper club.md │ ├── 515 - framework.md │ ├── 516 - Wes office.md │ ├── 517 - supper Brian.md │ ├── 518 - Blahs.md │ ├── 519 - Potluck.md │ ├── 520 - Supper with Nikolas Burk.md │ ├── 521 - hasty.md │ ├── 522 - tasty Use The Platform.md │ ├── 523 - Supper.md │ ├── 524 - Hasty Bookmarklets.md │ ├── 525 - HTTP Archive.md │ ├── 526 - supper Alex.md │ ├── 527 - Hasty Qwik.md │ ├── 528 - Tasty.md │ ├── 529 - Supper.md │ ├── 530 - Hasty.md │ ├── 531 - Tasty Scary part 2.md │ ├── 532 - Supper club.md │ ├── 533 - Zod.md │ ├── 534 - Potluck.md │ ├── 535 - Supper club.md │ ├── 536 - Hasty Short video.md │ ├── 537 - Hasty CSS.md │ ├── 538 - Supper Deno.md │ ├── 539 - Hasty.md │ ├── 540 - Tasty.md │ ├── 541 - Supper Wes Scott.md │ ├── 542 - Tasty Serverless.md │ ├── 543 - Tasty Potluck.md │ ├── 544 - Supper Club bun.md │ ├── 545 - Hasty GitHub Roadmap.md │ ├── 546 - Tasty Preferences.md │ ├── 547 - Supper with Vu Le.md │ ├── 548 - Hasty Render Methods.md │ ├── 549 - Tasty.md │ ├── 550 - Supper with Jonny.md │ ├── 551 - Tasty Serverless.md │ ├── 552 - Potluck.md │ ├── 553 - Supper.md │ ├── 554 - Hasty Apps.md │ ├── 555 - Tasty.md │ ├── 556 - Supper Kilian Valkhof.md │ ├── 557 - Tasty TypeScript.md │ ├── 558 - Tasty 2023 Predictions.md │ ├── 559 - Supper with Sarah.md │ ├── 560 - Hasty errors.md │ ├── 561 - Tasty Goals.md │ ├── 562 - Supper.md │ ├── 563 - Hasty.md │ ├── 564 - Potluck.md │ ├── 565 - Supper.md │ ├── 566 - Hasty Container Queries.md │ ├── 567 - Tasty State of js.md │ ├── 568 - Supper.md │ ├── 569 - Hasty CSS Wishlist.md │ ├── 570 - Tasty node.md │ ├── 571 - Supper rust.md │ ├── 572 - Hasty Polish and perf.md │ ├── 573 - Tasty TypeScript.md │ ├── 574 - Supper.md │ ├── 575 - Hasty.md │ ├── 576 - Tasty.md │ ├── 577 - Supper Ryan.md │ ├── 578 - Hasty.md │ ├── 579 - Tasty Warp.md │ ├── 580 - Supper Fred Schott.md │ ├── 581 - Hasty clean code.md │ ├── 582 - AI Coding.md │ ├── 583 - Supper Builder.md │ ├── 584 - Node in the browser.md │ ├── 585 - speed on apps.md │ ├── 586 - Supper Erc.md │ ├── 587 - Hasty Web Streams.md │ ├── 588 - Tasty Syntax web.md │ ├── 589 - Supper Dax.md │ ├── 590 - Hasty tunnels.md │ ├── 591 - Tasty Potluck.md │ ├── 592 - Supper.md │ ├── 593 - Hasty.md │ ├── 594 - Potluck.md │ ├── 595 - Supper.md │ ├── 596 - Hasty Import maps.md │ ├── 597 - Tasty.md │ ├── 598 - Supper Fabian.md │ ├── 599 - Hasty.md │ ├── 600 - Six Hundred.md │ ├── 601 - Nate supper.md │ ├── 602 - Hasty.md │ ├── 603 - Tasty.md │ ├── 604 - Supper ESLint.md │ ├── 605 - Hasty CSS Color.md │ ├── 606 - Tasty Potluck.md │ ├── 607 - Supper Termageddon.md │ ├── 608 - Hasty RPC.md │ ├── 609 - Tasty Syntax giveaway.md │ ├── 610 - Supper.md │ ├── 611 - bluesky.md │ ├── 612 - tasty ui.md │ ├── 613 - supper dylan.md │ ├── 614 - hasty signals.md │ ├── 615 - tasty.md │ ├── 616 - adam CSS.md │ ├── 617 - hasty node.md │ ├── 618 - potluck.md │ ├── 619 - supper braum.md │ ├── 620 - hasty Javascript.md │ ├── 621 - tasty.md │ ├── 622 - Supper GitHub Next.md │ ├── 623 - Hasty.md │ ├── 624 - tasty typescript.md │ ├── 625 - supper AI.md │ ├── 626 - hasty planning.md │ ├── 627 - electronics tasty.md │ ├── 628 - supper Nick.md │ ├── 629 - hasty.md │ ├── 630 - Potluck tasty.md │ ├── 631 - Supper Dustin.md │ ├── 632 - Hasty Domains.md │ ├── 633 - ORM Tasty.md │ ├── 634 - Supper.md │ ├── 635 - Hasty Lightning CSS.md │ ├── 636 - Tasty.md │ ├── 637 - Supper.md │ ├── 638 - Hasty.md │ ├── 639 - Tasty Stumpd.md │ ├── 640 - Supper Steve.md │ ├── 641 - Hasty helper.md │ ├── 642 - Tasty potluck.md │ ├── 643 - Supper with Jake.md │ ├── 644 - Hasty Toast.md │ ├── 645 - Tasty.md │ ├── 646 - Supper.md │ ├── 647 - Hasty.md │ ├── 648 - Tasty.md │ ├── 649 - Supper.md │ └── 650 - Tasty Threads.md ├── static └── favicon.png ├── svelte.config.js ├── tsconfig.json └── vite.config.ts /.eslintignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /build 4 | /.svelte-kit 5 | /package 6 | .env 7 | .env.* 8 | !.env.example 9 | 10 | # Ignore files for PNPM, NPM and YARN 11 | pnpm-lock.yaml 12 | package-lock.json 13 | yarn.lock 14 | -------------------------------------------------------------------------------- /.eslintrc.cjs: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: '@typescript-eslint/parser', 4 | extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'], 5 | plugins: ['svelte3', '@typescript-eslint'], 6 | ignorePatterns: ['*.cjs'], 7 | overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }], 8 | settings: { 9 | 'svelte3/typescript': () => require('typescript') 10 | }, 11 | parserOptions: { 12 | sourceType: 'module', 13 | ecmaVersion: 2020 14 | }, 15 | env: { 16 | browser: true, 17 | es2017: true, 18 | node: true 19 | } 20 | }; 21 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /build 4 | /.svelte-kit 5 | /package 6 | .env 7 | .env.* 8 | !.env.example 9 | vite.config.js.timestamp-* 10 | vite.config.ts.timestamp-* 11 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | engine-strict=true 2 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /build 4 | /.svelte-kit 5 | /package 6 | .env 7 | .env.* 8 | !.env.example 9 | 10 | # Ignore files for PNPM, NPM and YARN 11 | pnpm-lock.yaml 12 | package-lock.json 13 | yarn.lock 14 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "useTabs": true, 3 | "singleQuote": true, 4 | "trailingComma": "none", 5 | "printWidth": 100, 6 | "plugins": ["prettier-plugin-svelte"], 7 | "pluginSearchDirs": ["."], 8 | "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }] 9 | } 10 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Sentry.io Hackweek 2 | 3 | ## Syntax.fm Shownotes multiplayer editor 4 | 5 | #### Stack 6 | 7 | - SvelteKit 8 | - TipTap 9 | - Y.js 10 | - GitHub REST API 11 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "notes", 3 | "version": "0.0.1", 4 | "private": true, 5 | "scripts": { 6 | "dev": "vite dev", 7 | "build": "vite build", 8 | "preview": "vite preview", 9 | "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", 10 | "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", 11 | "lint": "prettier --plugin-search-dir . --check . && eslint .", 12 | "format": "prettier --plugin-search-dir . --write ." 13 | }, 14 | "devDependencies": { 15 | "@sveltejs/adapter-auto": "^2.1.0", 16 | "@sveltejs/kit": "^1.18.0", 17 | "@types/js-yaml": "^4.0.5", 18 | "@types/node": "^20.5.4", 19 | "@typescript-eslint/eslint-plugin": "^5.59.7", 20 | "@typescript-eslint/parser": "^5.59.7", 21 | "eslint": "^8.41.0", 22 | "eslint-config-prettier": "^8.5.0", 23 | "eslint-plugin-svelte3": "^4.0.0", 24 | "prettier": "^2.8.8", 25 | "prettier-plugin-svelte": "^2.8.1", 26 | "svelte": "^3.59.1", 27 | "svelte-check": "^3.3.2", 28 | "tslib": "^2.5.2", 29 | "typescript": "^5.0.0", 30 | "vite": "^4.3.8" 31 | }, 32 | "type": "module", 33 | "dependencies": { 34 | "@hocuspocus/provider": "^2.4.0", 35 | "@tiptap/core": "^2.0.4", 36 | "@tiptap/extension-collaboration": "^2.1.7", 37 | "@tiptap/extension-document": "^2.0.4", 38 | "@tiptap/extension-link": "^2.1.0", 39 | "@tiptap/extension-placeholder": "^2.0.4", 40 | "@tiptap/pm": "^2.0.4", 41 | "@tiptap/starter-kit": "^2.0.4", 42 | "gray-matter": "^4.0.3", 43 | "js-yaml": "^4.1.0", 44 | "rehype-highlight": "^6.0.0", 45 | "rehype-parse": "^8.0.5", 46 | "rehype-raw": "^6.1.1", 47 | "rehype-remark": "^9.1.2", 48 | "rehype-stringify": "^9.0.3", 49 | "remark-frontmatter": "^4.0.1", 50 | "remark-gfm": "^3.0.1", 51 | "remark-parse": "^10.0.2", 52 | "remark-rehype": "^10.1.0", 53 | "remark-stringify": "^10.0.3", 54 | "toml": "^3.0.0", 55 | "turndown": "^7.1.2", 56 | "unified": "^11.0.0", 57 | "yaml": "^2.3.1", 58 | "yjs": "^13.6.7" 59 | } 60 | } 61 | -------------------------------------------------------------------------------- /src/app.d.ts: -------------------------------------------------------------------------------- 1 | // See https://kit.svelte.dev/docs/types#app 2 | // for information about these interfaces 3 | declare global { 4 | namespace App { 5 | // interface Error {} 6 | // interface Locals {} 7 | // interface PageData {} 8 | // interface Platform {} 9 | } 10 | } 11 | 12 | export {}; 13 | -------------------------------------------------------------------------------- /src/app.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | %sveltekit.head% 8 | 9 | 10 |
%sveltekit.body%
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/hooks.server.ts: -------------------------------------------------------------------------------- 1 | import type { Handle } from '@sveltejs/kit'; 2 | import { sequence } from '@sveltejs/kit/hooks'; 3 | 4 | const userURL = 'https://api.github.com/user'; 5 | 6 | export const oauth: Handle = async function ({ event, resolve }) { 7 | const oauth: string = event.cookies.get('oauth'); 8 | const user = await getUser(oauth); 9 | 10 | event.locals.user = user; 11 | const response = await resolve(event); 12 | return response; 13 | }; 14 | 15 | export const handle: Handle = sequence(oauth); 16 | 17 | function getUser(accessToken: string) { 18 | return fetch(userURL, { 19 | headers: { 20 | Accept: 'application/json', 21 | Authorization: `Bearer ${accessToken}` 22 | } 23 | }).then((r) => r.json()); 24 | } 25 | -------------------------------------------------------------------------------- /src/lib/constants.ts: -------------------------------------------------------------------------------- 1 | export const SHOW_REPO_URL = `https://api.github.com/repos/syntaxfm/hackweek-md-multiplayer-editor/contents/src/shows`; 2 | -------------------------------------------------------------------------------- /src/lib/get_repo_file.ts: -------------------------------------------------------------------------------- 1 | export async function get_repo_file(fileUrl: string) { 2 | const response = await fetch(fileUrl); 3 | 4 | if (!response.ok) { 5 | throw new Error(`Error fetching file content: ${response.status}`); 6 | } 7 | 8 | const content = await response.text(); 9 | return content; 10 | } 11 | -------------------------------------------------------------------------------- /src/lib/get_repo_files.ts: -------------------------------------------------------------------------------- 1 | import { SHOW_REPO_URL } from '$lib/constants'; 2 | 3 | export async function get_repo_files(token: string) { 4 | const response = await fetch(SHOW_REPO_URL, { 5 | headers: { 6 | Authorization: `token ${token}`, 7 | Accept: 'application/vnd.github+json' 8 | } 9 | }); 10 | 11 | if (!response.ok) { 12 | const headers = response.headers; 13 | const resetTimestamp = parseInt(headers.get('x-ratelimit-reset') || '0', 10); 14 | const resetDate = new Date(resetTimestamp * 1000); // Convert to milliseconds 15 | const now = new Date(); 16 | const timeRemaining = resetDate.getTime() - now.getTime(); 17 | 18 | console.log(`Rate limit will reset at ${resetDate}`); 19 | console.log(`Time remaining: ${timeRemaining / 60000} minutes`); 20 | throw new Error(`Error fetching repository content: ${response.status}`); 21 | } 22 | 23 | const data = await response.json(); 24 | return data; 25 | } 26 | -------------------------------------------------------------------------------- /src/lib/html_to_markdown.ts: -------------------------------------------------------------------------------- 1 | import { unified, type Processor } from 'unified'; 2 | import rehypeParse from 'rehype-parse'; 3 | import remarkStringify from 'remark-stringify'; 4 | import rehypeRemark from 'rehype-remark'; 5 | 6 | const processor: Processor = unified() 7 | .use(rehypeParse) // Parse HTML 8 | .use(rehypeRemark) // Convert HTML to Markdown AST 9 | .use(remarkStringify, { 10 | bullet: '*', // Use '*' for bullets 11 | listItemIndent: 'one' // Indent by one space 12 | }); // Stringify Markdown 13 | 14 | export async function html_to_markdown(html: string) { 15 | const processed = await processor.process(html); 16 | return processed.value; 17 | } 18 | -------------------------------------------------------------------------------- /src/routes/+layout.server.ts: -------------------------------------------------------------------------------- 1 | import type { PageServerLoad } from './$types'; 2 | 3 | export const load: PageServerLoad = async ({ locals }) => { 4 | return { 5 | user: locals.user 6 | }; 7 | }; 8 | -------------------------------------------------------------------------------- /src/routes/+layout.svelte: -------------------------------------------------------------------------------- 1 | 5 | 6 |
7 |
8 | 15 |
16 | 17 | 18 |
19 | 20 | 42 | -------------------------------------------------------------------------------- /src/routes/+page.svelte: -------------------------------------------------------------------------------- 1 | 7 | 8 | {#if user?.login} 9 | See your shows 10 | {:else} 11 | Login 12 | {/if} 13 | -------------------------------------------------------------------------------- /src/routes/api/login/+server.ts: -------------------------------------------------------------------------------- 1 | import { PUBLIC_GITHUB_ID } from '$env/static/public'; 2 | const ghAuthURL = 'https://github.com/login/oauth/authorize'; 3 | 4 | export async function GET() { 5 | const sessionId = '1234'; 6 | 7 | return new Response('', { 8 | status: 302, 9 | headers: { 10 | location: `${ghAuthURL}?client_id=${PUBLIC_GITHUB_ID}&state=${sessionId}` 11 | } 12 | }); 13 | } 14 | -------------------------------------------------------------------------------- /src/routes/api/oauth/+server.ts: -------------------------------------------------------------------------------- 1 | import { PUBLIC_GITHUB_ID } from '$env/static/public'; 2 | import { GITHUB_SECRET } from '$env/static/private'; 3 | const tokenURL = 'https://github.com/login/oauth/access_token'; 4 | 5 | export async function GET({ url, cookies }) { 6 | const code = url.searchParams.get('code'); 7 | const accessToken = await getAccessToken(code); 8 | cookies.set('oauth', accessToken, { 9 | httpOnly: true, 10 | path: '/' 11 | }); 12 | 13 | return new Response('', { 14 | status: 302, 15 | headers: { 16 | location: '/shows' 17 | } 18 | }); 19 | } 20 | 21 | function getAccessToken(code) { 22 | return fetch(tokenURL, { 23 | method: 'POST', 24 | headers: { 'Content-Type': 'application/json', Accept: 'application/json' }, 25 | body: JSON.stringify({ 26 | client_id: PUBLIC_GITHUB_ID, 27 | client_secret: GITHUB_SECRET, 28 | code 29 | }) 30 | }) 31 | .then((r) => r.json()) 32 | .then((r) => { 33 | return r.access_token; 34 | }); 35 | } 36 | -------------------------------------------------------------------------------- /src/routes/shows/+page.server.ts: -------------------------------------------------------------------------------- 1 | import { get_repo_files } from '$lib/get_repo_files'; 2 | import type { PageServerLoad } from './$types'; 3 | 4 | export const load: PageServerLoad = async function ({ cookies }) { 5 | const oauth_token = cookies.get('oauth'); 6 | if (oauth_token) { 7 | const files = await get_repo_files(oauth_token); 8 | 9 | return { 10 | files 11 | }; 12 | } 13 | }; 14 | -------------------------------------------------------------------------------- /src/routes/shows/+page.svelte: -------------------------------------------------------------------------------- 1 | 6 | 7 | {#if user} 8 | {#if files} 9 | 21 | {/if} 22 | {/if} 23 | 24 | 49 | -------------------------------------------------------------------------------- /src/routes/shows/[id]/+page.svelte: -------------------------------------------------------------------------------- 1 | 6 | 7 |
8 | 9 |
10 | -------------------------------------------------------------------------------- /src/shows/000 - Syntax Preview.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 0 3 | title: Preview 4 | date: 1498579200000 5 | url: https://traffic.libsyn.com/syntax/Syntax000.mp3?dest-id=532671 6 | --- 7 | 8 | ## Show Notes 9 | 10 | It's Coming! Subscribe now so we can launch this puppy with a bang! 11 | -------------------------------------------------------------------------------- /src/shows/001 - React Tools.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 1 3 | title: React Tools 4 | date: 1499256000000 5 | url: https://traffic.libsyn.com/syntax/syntax001_4.mp3 6 | --- 7 | 8 | ## Show Notes 9 | * [Wes Bos' Site](https://wesbos.com) 10 | * [Level Up Tutorials site](https://www.leveluptutorials.com/) 11 | * [Level Up Tutorials YouTube channel](https://www.youtube.com/user/LevelUpTuts) 12 | * [Scott Tolinski personal site](http://www.scotttolinski.com/) 13 | * [Cloudflare](https://www.cloudflare.com/) 14 | * [Next.js](https://learnnextjs.com/) 15 | * [Hacker News Example in Next.js](https://github.com/now-examples/next-news) 16 | * [GraphQL](http://graphql.org/learn/) 17 | * [Graphcool](https://www.graph.cool/) 18 | * [create-react-app](https://github.com/facebookincubator/create-react-app) 19 | * [React dev-tools](https://github.com/facebook/react-devtools) 20 | * [Redux dev-tools](https://github.com/gaearon/redux-devtools) 21 | * [Preact.js](https://preactjs.com/) 22 | * [React Storybook](https://github.com/storybooks/storybook) 23 | * [Meteor](https://www.meteor.com/) 24 | * [Blaze](http://blazejs.org/) 25 | 26 | ## Sick Picks 27 | 28 | * Wes: [Parcel App](https://parcelapp.net/) 29 | * Scott: [Fish shell](https://fishshell.com/) 30 | 31 | ## Shameless Plugs 32 | 33 | * [Learn Node](http://wesbos.com/learn-node/) 34 | * [React Native for everyone](https://www.leveluptutorials.com/store/products/tutorials/lut-dd014) 35 | 36 | #### Twitter 37 | * [@wesbos](https://twitter.com/wesbos) 38 | * [@stolinski](https://twitter.com/stolinski) 39 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 40 | -------------------------------------------------------------------------------- /src/shows/002 - Webcam and audio access with WebRTC and getUserMedia().md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 2 3 | title: Webcam and audio access with WebRTC and getUserMedia() 4 | date: 1499860800000 5 | url: https://traffic.libsyn.com/syntax/syntax002.mp3 6 | --- 7 | 8 | ## Show Notes 9 | * [WebRTC](https://webrtc.org/) 10 | * [Apple WebRTC Support](https://www.theregister.co.uk/2016/04/13/apple_rolling_webrtc_into_webkit/) 11 | * [GetUserMedia](https://w3c.github.io/mediacapture-main/getusermedia.html) 12 | * [Slack](https://slack.com) 13 | * [WebTorrent](https://webtorrent.io) 14 | * https://github.com/webtorrent/webtorrent 15 | * [Soctt WebRtc Mirror](https://github.com/stolinski/bboy-tools/blob/master/client/tools/Timemachine.js) 16 | * [MediaRecorder](https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder) 17 | * [Electron](https://electron.atom.io/) 18 | * [Kap](https://getkap.co/) 19 | * [Wes Security Cam](https://github.com/wesbos/HTML5-Security-Camera) 20 | * [Scott Colorbars YouTube](https://www.youtube.com/watch?v=4cuqYDnekpg) 21 | * [Wes Face Detection](https://github.com/wesbos/HTML5-Face-Detection) 22 | * [Fluent Conf](https://conferences.oreilly.com/fluent/fl-ca) 23 | 24 | ## Sick Picks 25 | * Wes: 26 | * [Peak Design Everyday Backpack](https://www.peakdesign.com/everyday-backpack) 27 | * [Everyday Backpack Video](https://www.youtube.com/watch?v=Wf8US4LJp1w) 28 | * [Splice](https://splice.com/) 29 | * Scott: 30 | * [Quik by GoPro](https://quik.gopro.com) 31 | 32 | ## Shameless Plugs 33 | #### [JavaScript30](https://javascript30.com) 34 | A Free 30 Day Vanilla JS Coding Challenge Course. Build 30 things in 30 days with 30 tutorials. 35 | No Frameworks No Compilers No Libraries No Boilerplate. Join 101,746 others. 36 | 37 | #### [Level Up Tutorials](https://leveluptutorials.com/) 38 | Over 860 free video tutorials for beginners, intermediate and expert web professionals. Level Up your skills with clear, high production, free video tutorials. 39 | 40 | #### Twitter 41 | * [@wesbos](https://twitter.com/wesbos) 42 | * [@stolinski](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 44 | -------------------------------------------------------------------------------- /src/shows/004 - JavaScript Tooling.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 4 3 | title: JavaScript Tooling 4 | date: 1501020859844 5 | url: https://traffic.libsyn.com/syntax/Syntax004.mp3 6 | --- 7 | 8 | ## Sponsor 9 | 10 | * [Deliciousbrains WP Migrate DB Pro](https://deliciousbrains.com/syntax) - Use the code SYNTAX for 20% off 11 | 12 | ## Show Notes 13 | 14 | * [WesBos Website](http://wesbos.com) 15 | * [Level Up Tutorials](https://leveluptutorials.com) 16 | * [WHY USE WWW?](http://www.yes-www.org/why-use-www/) 17 | * [Webpack](https://webpack.github.io/) 18 | * [Babel](https://babeljs.io/) 19 | * [ESLint](http://eslint.org/) 20 | * [Prettier](https://github.com/prettier/prettier) 21 | * [Babili](https://github.com/babel/babili) 22 | * [Prepack](https://prepack.io/) 23 | 24 | ## Sick Picks 25 | 26 | * Scott: [Figma](https://www.figma.com) 27 | * Wes: [CalDigit TS3 Dock](http://www.caldigit.com/thunderbolt-3-dock/#TS3) 28 | 29 | ## Shameless Plugs 30 | 31 | #### [JavaScript30](https://javascript30.com) 32 | A Free 30 Day Vanilla JS Coding Challenge Course. Build 30 things in 30 days with 30 tutorials. 33 | No Frameworks No Compilers No Libraries No Boilerplate. Join 101,746 others. 34 | 35 | #### [React Native for everyone](https://www.leveluptutorials.com/store/products/tutorials/lut-dd014) 36 | 37 | #### Twitter 38 | * [@wesbos](https://twitter.com/wesbos) 39 | * [@stolinski](https://twitter.com/stolinski) 40 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 41 | -------------------------------------------------------------------------------- /src/shows/005 - How to Slam Dunk Freelancing.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 5 3 | title: How to Slam Dunk Freelancing 4 | date: 1501684018000 5 | url: https://traffic.libsyn.com/syntax/Syntax005.mp3 6 | --- 7 | 8 | ## Sponsor 9 | 10 | * [Deliciousbrains WP Migrate DB Pro](https://deliciousbrains.com/syntax) - Use the code SYNTAX for 20% off 11 | 12 | ## Show Notes 13 | 14 | * [Stickers](https://bos.af) - SOLD OUT MORE SOON 15 | * [Scott's Personal Website on Gatsby](http://scotttolinski.com/) 16 | * [Gatsby Codealong](https://www.youtube.com/watch?v=xqaThBnesfY) 17 | * [Gatsby](https://github.com/gatsbyjs/gatsby) 18 | * [MJML Email Framework](https://mjml.io/) 19 | * [The E-Myth Revisited Book](http://amzn.to/2f8y8Li) 20 | * [Design is a Job](http://amzn.to/2uZ9CQw) 21 | * [Breaking the Time Barrier](https://www.freshbooks.com/blog/breakingthetimebarrier) 22 | * [Basecamp](https://basecamp.com/) 23 | * [Trello](https://trello.com/) 24 | * [Freshbooks](http://www.shareasale.com/r.cfm?B=963929&U=976068&M=52946&urllink=) 25 | * [Wave](https://www.waveapps.com/) 26 | 27 | ## Sick Picks 28 | * Wes: 29 | * [Hyper Key + Karabiner Elements](https://github.com/tekezo/Karabiner-Elements/) 30 | * [Better Touch Tool](https://www.boastr.net/) 31 | * Scott: [King of the Road](https://www.viceland.com/en_us/show/king-of-the-road) 32 | 33 | #### Twitter 34 | * [@wesbos](https://twitter.com/wesbos) 35 | * [@stolinski](https://twitter.com/stolinski) 36 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 37 | -------------------------------------------------------------------------------- /src/shows/006 - Accepting Money on the Internet.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 6 3 | title: Accepting Money on the Internet 💰💸 4 | date: 1502292600000 5 | url: https://traffic.libsyn.com/syntax/Syntax006.mp3 6 | --- 7 | 8 | In this episode we talk about how to accept money on the internet including the ups of Stripe, the downs of PayPal. 9 | 10 | ## Sponsor 11 | 12 | * [Freshbooks](https://freshbooks.com/syntax) - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. 13 | 14 | ## Show Notes 15 | 16 | * [Apollo](http://www.apollodata.com/) 17 | * [React Apollo](http://dev.apollodata.com/react/) 18 | * [GraphCool](https://graph.cool) 19 | * [Stripe](http://stripe.com/) 20 | * [PayPal](http://paypal.com/) 21 | * [Braintree](https://www.braintreepayments.com/) 22 | * [Stripe Docs](https://stripe.com/docs) 23 | * [HTML5 Autocomplete Types](https://wiki.whatwg.org/wiki/Autocomplete_Types) 24 | * [Stripe Radar](https://stripe.com/docs/radar) 25 | * [Royal Bank PayPal WorkAround](http://travelblogbreakthrough.com/canadian-paypal-users-transfer-usd-bank/) 26 | * [Stripe Atlas](https://stripe.com/atlas) 27 | * [Transferwise](https://transferwise.com/u/wesleyb22) 28 | * [Stripe Bitcoin](https://stripe.com/bitcoin) 29 | 30 | ## Sick Picks 31 | * Wes: [ChefSteps](https://www.youtube.com/user/chefsteps) 32 | * Scott: [What Cha Tea](http://what-cha.com/) 33 | 34 | ## Shameless Plugs 35 | * [Wes' Courses](https://wesbos.com/courses) 36 | * [Level UP Tutorials Youtube](https://www.youtube.com/user/LevelUpTuts) 37 | * [How to GraphQL](https://www.howtographql.com) 38 | 39 | #### Twitter 40 | * [@wesbos](https://twitter.com/wesbos) 41 | * [@stolinski](https://twitter.com/stolinski) 42 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 43 | -------------------------------------------------------------------------------- /src/shows/007 - Scott Tolinski Origin Story.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 7 3 | title: Scott Tolinski Origin Story 🎧 📹 💻 🕺 4 | date: 1502292600000 5 | url: https://traffic.libsyn.com/syntax/Syntax007.mp3 6 | --- 7 | 8 | In this episode, Scott talks about his unconventional career path and how to grow your career by working on what you love. 9 | 10 | ## Sponsor 11 | 12 | * [Freshbooks](https://freshbooks.com/syntax) - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. 13 | 14 | ## Show Notes 15 | 16 | * [UofM Performing Arts Technology](https://www.music.umich.edu/departments/pat/index.php) 17 | * [Devin Kerr](http://www.devinkerr.com/) 18 | * [Jamie Schefman](http://partybabymusic.com/) 19 | * [Michelle Chamuel](http://michellechamuel.com/) 20 | * [Guitar World](http://www.guitarworld.com/) 21 | * [Ghostly International](http://www.ghostly.com/) 22 | * [Q LTD](http://qltd.com/) 23 | * [Michigan Creative](https://creative.umich.edu/) 24 | * [Ford](http://www.ford.com/) 25 | * [GTB](https://www.gtb.com/) 26 | * [Level Up Tutorials](https://www.leveluptutorials.com/) 27 | * [Scott Concussion](https://www.youtube.com/edit?o=U&video_id=ApwQLpJgmqc) 28 | * [Atya](https://getatya.com) 29 | 30 | ## Sick Picks 31 | * Scott: [Good Hertz](https://goodhertz.co/) 32 | 33 | ## Shameless Plugs 34 | * [Wes' Courses](https://wesbos.com/courses) 35 | * [Level UP Tutorials Youtube](https://www.youtube.com/user/LevelUpTuts) 36 | 37 | #### Twitter 38 | * [@wesbos](https://twitter.com/wesbos) 39 | * [@stolinski](https://twitter.com/stolinski) 40 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 41 | -------------------------------------------------------------------------------- /src/shows/010 - CSS in JS.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 10 3 | title: CSS in JS 💅👩‍🎤💁🚒 (Drama Free!) 4 | date: 1504705105555 5 | url: https://traffic.libsyn.com/syntax/Syntax010.mp3 6 | --- 7 | 8 | The most requested syntax episode ever! We break down CSS in JavaScript. Pros/Cons? What is it? What problems does it solve? What libraries should you use? Is it stupid or amazing? 9 | 10 | ## Sponsor 11 | 12 | * [Freshbooks](https://freshbooks.com/syntax) - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. 13 | 14 | ## Follow us on twitter! 15 | * [Wes Bos](https://twitter.com/wesbos) 16 | * [Scott Tolinski](https://twitter.com/stolinski) 17 | * [Syntax](https://twitter.com/SyntaxFM) 18 | 19 | ## Show Notes 20 | 21 | * [BEM](http://getbem.com/) 22 | * [Styled Components](https://www.styled-components.com/) 23 | * [Emotion](https://github.com/tkh44/emotion) 24 | * [Radium](https://github.com/FormidableLabs/radium) 25 | * [Glamorous](https://github.com/paypal/glamorous) 26 | * [Styled JSX](https://github.com/zeit/styled-jsx) 27 | 28 | ## Sick Picks 29 | * Scott: [Boxyapp Mail Client](http://www.boxyapp.co/) 30 | * Wes: [Airpods](http://amzn.to/2wFYNpc) 31 | 32 | ## Shameless Plugs 33 | * [Grab Level Up Tuts before the price goes up!](https://www.leveluptutorials.com/) 34 | * [Modern Dev Tools](https://moderndevtools.com/) 35 | 36 | #### Twitter 37 | * [@wesbos](https://twitter.com/wesbos) 38 | * [@stolinski](https://twitter.com/stolinski) 39 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 40 | -------------------------------------------------------------------------------- /src/shows/015 - Advice for Newbies.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 15 3 | title: Advice for New Developers, Imposter Syndrome and Interviewing at Google 4 | date: 1507727231000 5 | url: https://traffic.libsyn.com/syntax/Syntax015.mp3 6 | --- 7 | 8 | Scott and Wes dish out some tasty advice to developers who are new to web development. How do you get better? How do you deal with imposter syndrome? 9 | 10 | ## Sponsor 11 | * [Freshbooks](https://freshbooks.com/syntax) - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. 12 | 13 | ## Shameless Plugs 14 | * [Wes just updated his ES6 course!](https://ES6.io) 15 | * [Mastering Figma is now Launched!](https://www.leveluptutorials.com/store/products/tutorials/lut-dd015) 16 | 17 | ## Show Notes 18 | This show is light on links :) 19 | 20 | * [The Gap by Ira Glass](https://vimeo.com/85040589) 21 | * [Hackathon Starter](https://github.com/sahat/hackathon-starter) 22 | 23 | ## Sick Picks 24 | 25 | * Scott: [Nintendo Switch](https://www.nintendo.com/switch/) 26 | * Wes: [Creative Market Fonts](https://creativemarket.com/fonts) 27 | 28 | ## Tweet us your tips! 29 | * [Wes Bos](https://twitter.com/wesbos) 30 | * [Scott Tolinski](https://twitter.com/stolinski) 31 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) 32 | 33 | -------------------------------------------------------------------------------- /src/shows/016 - QA.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 16 3 | title: Tasty Treats — Rems VS Ems, Remote Work, Making Money, Getting good at Design + more! 🍬 4 | date: 1508333006044 5 | url: https://traffic.libsyn.com/syntax/Syntax016.mp3 6 | --- 7 | 8 | ## Show Notes 9 | 10 | 11 | * **Q**: Rems vs Ems vs Pixels? What do you use? 12 | * **Q**: What activity, that isn't developer related, benefits you most as a developer? 13 | * [Becoming a Supple Leopard](https://www.amazon.com/gp/product/1936608588/ref=as_li_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1936608588&linkCode=as2&tag=leveluptuts01-20&linkId=b9f598d6432ce7394e5b0510fe0bebba) 14 | * **Q**: Is a hot dog a sandwich? 🌭 15 | * **Q** If Google offered you a job today, would you take it? 16 | * [Mike Rowe: Why Entrepreneurs Crave the 'Reverse Commute'](https://www.youtube.com/watch?v=3K-b7CZaPpw) 17 | * **Q**: How did Wes and Scott Meet? 18 | * **Q**: What are your thoughts on CMSs, like WordPress, adding JavaScript frameworks, like React? 19 | * **Q**: Where do you find remote work? 20 | * **Q**: How do you make money? 21 | * **Q**: Can a back-end dev become a good designer? 22 | * [Hero Patterns](http://www.heropatterns.com/) 23 | * [Steve Schoger's Twitter](https://twitter.com/steveschoger) 24 | * **Q**: Do you ever feel tired? 25 | * **Q**: What do you think about live streaming? 26 | * Should we do a Syntax live stream?! 27 | * **Q**: What stack should a new developer use? 28 | * **Q**: What is your process for deciding on new tools? 29 | * [React FAQ](https://reactfaq.site/) - sign up for Tim's newsletter! 30 | * **Q**: Where do you see yourself in 5 years? 31 | 32 | ## Sick Picks 33 | * Scott: [Fivestar Notebook](http://amzn.to/2xNmnCH) 34 | * Wes: Read about your credit card benefits + perks! 35 | 36 | ## Tweet us your tips! 37 | * [Wes Bos](https://twitter.com/wesbos) 38 | * [Scott Tolinski](https://twitter.com/stolinski) 39 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) 40 | 41 | -------------------------------------------------------------------------------- /src/shows/017 - Buzz Words.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 17 3 | title: 22 Buzz Words Explained — Mutations, Pure Functions , Serverless, Hoisting, MVC + More 4 | date: 1509540868534 5 | url: https://traffic.libsyn.com/syntax/Syntax017.mp3 6 | --- 7 | 8 | Buzz Words! WTF Do they mean?! Do They Mean Things?? Let's Find Out! 9 | 10 | ## Sponsor 11 | * [Freshbooks](https://freshbooks.com/syntax) - Get 30 days free. Make sure to enter SYNTAX into the "How did you hear about us" section. 12 | 13 | ## The Buzz Words 14 | 15 | This is the order in which we talk about the different concepts. If you have anything to add to the next buzzwords show, tweet us [@SyntaxFM](https://twitter.com/syntaxfm) 16 | 17 | * Serverless / Cloud Functions 18 | * Composition in functional programming 19 | * [funfunfunction](https://www.youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q) 20 | * Progressive Enhancement 21 | * Singleton 22 | * APIs + SDKs 23 | * Pure Functions + Side Effects 24 | * [Date-fns](https://date-fns.org/) 25 | * Immutable / Mutable / Mutations 26 | * [Immutable.js](https://facebook.github.io/immutable-js/) 27 | * [JavaScript30 Array Cardio](https://javascript30.com/) 28 | * Isomorphic / Universal JavaScript 29 | * Microservices 30 | * Scoping 31 | * Closures 32 | * **M**odel **V**iew **C**ontroller Pattern 33 | * [Learn Node](https://learnnode.com/) with a stupid explanation of MVC 34 | * Bike Shedding 35 | * Tree Shaking 36 | * Hoisting 37 | * ES Next 38 | * Asynchronous / Synchronous 39 | 40 | ## Sick Picks 41 | * Scott: [Ghost in the Wires: My Adventures as the World's Most Wanted Hacker](http://amzn.to/2gVP4pH) 42 | * Wes: [Apollo Reddit App for iOS](https://apolloapp.io/) 43 | 44 | ## Shameless Plugs 45 | * Scott: [React 16 for Everyone](https://www.leveluptutorials.com/store/products/tutorials/lut-dd016) 46 | 47 | ## Tweet us your tasty treats! 48 | * [Wes Bos](https://twitter.com/wesbos) 49 | * [Scott Tolinski](https://twitter.com/stolinski) 50 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) 51 | 52 | -------------------------------------------------------------------------------- /src/shows/024 - What is CSS BEM.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 24 3 | title: All About CSS BEM! 4 | date: 1513817245817 5 | url: https://traffic.libsyn.com/syntax/Syntax024.mp3 6 | --- 7 | 8 | Scott and Wes dive into CSS BEM — What is it? Why do you need it? How does it work? 9 | 10 | ## Sign up for D3 in 5 Days — Sponsor 11 | 12 | D3 has a bit of a bad reputation for being hard to learn so Ben Clinkinbeard has put together this awesome 5 day email course that will get you comfortable with the 3 or 4 fundamental concepts that are needed to create amazing data visualizations with D3.js. [Get it now](http://d3in5days.com/syntax/) 13 | 14 | ## The Show Notes! 15 | 16 | 01:00 17 | 18 | * Minisode! What do you think? 19 | * Meijer is the best! 20 | 21 | 05:00 22 | 23 | * What is CSS BEM? 24 | * What problems does CSS BEM solve? 25 | * Block, Element, Modifier! 26 | 27 | 8:00 28 | 29 | * What about really long class names? 30 | 31 | 9:00 32 | 33 | * Use with Sass/Stylus 34 | 35 | 12:00 36 | 37 | * What about styled components?! 38 | 39 | 15:00 40 | 41 | * Listener Question: Do / should you use Dropbox for a website with Git and node_modules? 42 | 43 | 44 | ## Tweet us your tasty treats! 45 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 46 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 47 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 48 | * [Wes' Twitter](https://twitter.com/wesbos) 49 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 50 | * [Scott's Twitter](https://twitter.com/stolinski) 51 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 52 | -------------------------------------------------------------------------------- /src/shows/026 - Redux.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 26 3 | title: All About Redux && Cookies vs JWT 4 | date: 1514988000000 5 | url: https://traffic.libsyn.com/syntax/Syntax026.mp3 6 | --- 7 | 8 | ## Dev Lifts — Sponsor 9 | 10 | [Dev Lifts](http://devlifts.io) will create a personal training plan tailored to your 2018 health and fitness goals. Use the code **SYNTAX** for $50 off. 11 | 12 | Join with a friend and we'll make you a Buddy Plan that you can do together (nutrition will still be tailored on a per-individual basis, but workouts will be something you can both do together)! Plus, use the coupon code below and you'll both get $100 off. 13 | 14 | Enter each other's email address as the coupon code and your discount will be applied to your invoices (invoices are sent manually currently, so I'll apply the discount for you both once you've both signed up). Valid thru January 31, 2018. 15 | 16 | ## The Show Notes! 17 | 18 | 01:00 19 | 20 | * [Scott's New Redux Course](https://www.leveluptutorials.com/store/products/tutorials/lut-dd018) 21 | * [Redux Docs](https://redux.js.org/) 22 | * What is Redux? Why do we need it? 23 | 24 | 06:00 25 | 26 | * Modifying Your State 27 | * Immutability 28 | 29 | 07:15 30 | 31 | * Actions + Actions Creators 32 | * Dispatching 33 | 34 | 09:00 35 | 36 | * Reducers 37 | 38 | 14:00 39 | 40 | * [Wes' Redux Tutorial](https://LearnRedux.com) 41 | 42 | 18:30 43 | 44 | * What is the difference between Cookies and JWT? 45 | 46 | ## Tweet us your tasty treats! 47 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 48 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 49 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 50 | * [Wes' Twitter](https://twitter.com/wesbos) 51 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 52 | * [Scott's Twitter](https://twitter.com/stolinski) 53 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 54 | -------------------------------------------------------------------------------- /src/shows/053 - Domain Management.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 53 3 | title: Hasty Treat - Domain Management 4 | date: 1530536400092 5 | url: https://traffic.libsyn.com/syntax/Syntax053.mp3 6 | --- 7 | 8 | In this Hasty Treat (Short episode) Scott and Wes discus all things domains. Where to get them, how to set them up and how to save time managing them all in one place. 9 | 10 | ## Netlify — Sponsor 11 | 12 | [Netlify](https://netlify.com/syntax) is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [netlify.com/syntax](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 3:30 17 | 18 | * What is a domain? 19 | 20 | 4:59 21 | 22 | * What is DNS? 23 | 24 | 6:00 25 | 26 | * Nameservers 27 | 28 | 8:30 29 | 30 | * What is a DNS provider? 31 | * [DNS Simple](https://dnsimple.com/) 32 | * [Cloudflare](https://www.cloudflare.com/) 33 | * [Hover](https://www.hover.com/) 34 | * [Name](https://www.name.com/) 35 | * [Domainr](https://domainr.com/) 36 | * [iwantmyname](https://iwantmyname.com/) 37 | 38 | 13:30 39 | 40 | * Different types of DNS records 41 | 42 | 17:00 43 | 44 | * Different kinds of domains 45 | * .com, .tv, .io, etc. 46 | 47 | ## Tweet us your tasty treats! 48 | 49 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 50 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 51 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 52 | * [Wes' Twitter](https://twitter.com/wesbos) 53 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 54 | * [Scott's Twitter](https://twitter.com/stolinski) 55 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 56 | -------------------------------------------------------------------------------- /src/shows/055 - Roles.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 55 3 | title: Hasty Treat - User Role Systems 4 | date: 1531141200658 5 | url: https://traffic.libsyn.com/syntax/Syntax055.mp3 6 | --- 7 | 8 | In this Hasty Treat (Short episode) Scott and Wes discuss user roles, what to think about when creating your own, security implications, etc. 9 | 10 | ## Netlify — Sponsor 11 | 12 | [Netlify](https://netlify.com/syntax) is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [netlify.com/syntax](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 3:30 17 | 18 | * How to manage user role systems 19 | 20 | 11:30 21 | 22 | * Client side best practices 23 | * Don't rely on front-end role systems as a security measure 24 | 25 | 14:13 26 | 27 | * Where to store your roles 28 | * Start simple and get more complex as needed 29 | 30 | ## Tweet us your tasty treats! 31 | 32 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 33 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 34 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 35 | * [Wes' Twitter](https://twitter.com/wesbos) 36 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 37 | * [Scott's Twitter](https://twitter.com/stolinski) 38 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 39 | -------------------------------------------------------------------------------- /src/shows/057 - Dot Files.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 57 3 | title: Hasty Treat - Dot Files 4 | date: 1531746000805 5 | url: https://traffic.libsyn.com/syntax/Syntax057.mp3 6 | --- 7 | 8 | In this Hasty Treat (Short episode) Scott and Wes discuss dot files, what they are, how to use and manage them as well as best practices and more. 9 | 10 | ## Netlify — Sponsor 11 | 12 | [Netlify](https://netlify.com/syntax) is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [netlify.com/syntax](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 3:15 - What is a dot file? 17 | 18 | * Access tokens 19 | * Settings for editors, etc. 20 | 21 | 4:40 - Dot file examples 22 | 23 | * .gitignore 24 | * .gitkeep 25 | * .rc 26 | * .babelrc 27 | * .bashrc 28 | * .eslintrc 29 | * .env 30 | * .DS_Store 31 | * .editorconfig 32 | * .meteorignore 33 | 34 | 23:46 - How to keep your dot files in sync 35 | 36 | ## Hot Tip 37 | * In MacOS, toggle dot files with "Shift + Cmd + ." 38 | 39 | ## Links 40 | [Wes' dot files repo](https://github.com/wesbos/dotfiles) 41 | [Prettier](https://prettier.io/) 42 | 43 | ## Tweet us your tasty treats! 44 | 45 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 46 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 47 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 48 | * [Wes' Twitter](https://twitter.com/wesbos) 49 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 50 | * [Scott's Twitter](https://twitter.com/stolinski) 51 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 52 | -------------------------------------------------------------------------------- /src/shows/061 - Lock files.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 61 3 | title: Hasty Treat - Whats the deal with npm, yarn and lock files?! 4 | date: 1532955600332 5 | url: https://traffic.libsyn.com/syntax/Syntax061.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes discuss npm, yarn, lock files, why they're useful, why you would or wouldn't want to track them in Git and much more! 9 | 10 | ## Netlify — Sponsor 11 | 12 | [Netlify](https://netlify.com/syntax) is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [netlify.com/syntax](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 4:10 17 | 18 | * What is npm and yarn? 19 | 20 | 8:00 21 | 22 | * What's the difference between npm and yarn? 23 | 24 | 12:00 25 | 26 | * What is semver? 27 | 28 | 16:40 29 | 30 | * What is the dependency tree? 31 | * This is the problem that lock files solve 32 | 33 | 20:32 34 | 35 | * Cool new features of npm and yarn 36 | * npx 37 | * security warnings 38 | 39 | ## Tweet us your tasty treats! 40 | 41 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 42 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 43 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 44 | * [Wes' Twitter](https://twitter.com/wesbos) 45 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 46 | * [Scott's Twitter](https://twitter.com/stolinski) 47 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 48 | -------------------------------------------------------------------------------- /src/shows/063 - Cross-Origin.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 63 3 | title: Hasty Treat - JSON, JSONP and CORS 4 | date: 1533560400265 5 | url: https://traffic.libsyn.com/syntax/Syntax063.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes discuss all things cross-origin - APIs, Javascript, JSON, CORS, and more. 9 | 10 | ## Netlify — Sponsor 11 | 12 | [Netlify](https://netlify.com/syntax) is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [netlify.com/syntax](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 3:52 17 | 18 | * What is JSON? 19 | 20 | 5:09 21 | 22 | * Origin policy in the browser 23 | 24 | 6:00 25 | 26 | * Cookies + how they work 27 | 28 | 6:38 29 | 30 | * How do you get data from one site to another? 31 | 32 | 7:00 33 | 34 | * JSON P (JSON with Padding) 35 | 36 | 9:00 37 | 38 | * CORS (cross-origin resource sharing) 39 | * CORS errors + learning on the fly 40 | 41 | 11:31 42 | 43 | * Canvas elements 44 | 45 | 12:24 46 | 47 | * Proxies 48 | * [Crossorigin.me](https://corsproxy.github.io/) 49 | * [Enable-cors.org](https://enable-cors.org/) 50 | 51 | ## Tweet us your tasty treats! 52 | 53 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 54 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 55 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 56 | * [Wes' Twitter](https://twitter.com/wesbos) 57 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 58 | * [Scott's Twitter](https://twitter.com/stolinski) 59 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 60 | -------------------------------------------------------------------------------- /src/shows/065 - curriculum.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 65 3 | title: Hasty Treat - Building Curriculum for Courses 4 | date: 1534165200725 5 | url: https://traffic.libsyn.com/syntax/Syntax065.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes discuss how they create courses, design and build curriculum, as well as insights and best practices for content creation. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 4:32 - Wes' process 17 | 18 | * Figure out what to make 19 | * Build the thing you're teaching in the course 20 | * Have it reviewed by experts 21 | * Simplify and create a linear flow for what you're teaching 22 | 23 | 16:25 - Scott's process 24 | 25 | * Chose a topic 26 | * Build the thing 27 | * Create the outline as you go 28 | * Have goals in mind, for individual topics 29 | * Record with final code open 30 | 31 | 28:25 - How to get started 32 | 33 | ## Tweet us your tasty treats! 34 | 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 42 | -------------------------------------------------------------------------------- /src/shows/067 - Goals.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 67 3 | title: Hasty Treat - Goal Setting 4 | date: 1534770000249 5 | url: https://traffic.libsyn.com/syntax/Syntax067.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk goal setting - why it's important, when to do it, how to stick to them, and more. Tweet us your goals with the hashtag #syntaxgoals. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 4:14 17 | 18 | * Setting SMART goals (Specific, Measurable, Attainable, Relevant, Time) 19 | 20 | 7:45 21 | 22 | * What kinds of thing should you set goals for? 23 | 24 | 10:49 25 | 26 | * Business goals 27 | 28 | 16:50 29 | 30 | * Visualizing Goals 31 | 32 | 22:58 33 | 34 | * When should you set goals? 35 | 36 | 27:42 37 | 38 | * Accountability 39 | 40 | ## Links 41 | * [ProfitWell](https://www.profitwell.com/) 42 | * [Forever Jobless Goals Worksheet](https://foreverjobless.com/fj-goals-worksheet.pdf) 43 | 44 | ## Tweet us your tasty treats! 45 | 46 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 47 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 48 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 49 | * [Wes' Twitter](https://twitter.com/wesbos) 50 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 51 | * [Scott's Twitter](https://twitter.com/stolinski) 52 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 53 | -------------------------------------------------------------------------------- /src/shows/069 - Framer.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 69 3 | title: Hasty Treat - Framer X and Prototyping Tools 4 | date: 1535374800304 5 | url: https://traffic.libsyn.com/syntax/Syntax069.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about prototyping and design tools in the development space, specifically Framer X - what it is, what it isn't, and some cool stuff coming down the pipeline. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 3:35 17 | 18 | * Framer X - What it is and what it isn't 19 | 20 | 13:20 21 | 22 | * What it means for other prototyping and design tools 23 | 24 | 17:00 25 | 26 | * Future of prototyping and design and development 27 | 28 | 21:40 29 | 30 | * Final thoughts 31 | 32 | ## Links 33 | 34 | * [Scott's Framer X First Look Video](https://youtu.be/oUhoBus1nn0) 35 | * [Sign up for Framer X Beta](https://framer.com/x/) 36 | 37 | ## Tweet us your tasty treats! 38 | 39 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 40 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 41 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 42 | * [Wes' Twitter](https://twitter.com/wesbos) 43 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 44 | * [Scott's Twitter](https://twitter.com/stolinski) 45 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 46 | -------------------------------------------------------------------------------- /src/shows/079 - Stumped.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 79 3 | title: Hasty Treat - Stumped! 02 4 | date: 1538398800682 5 | url: https://traffic.libsyn.com/syntax/Syntax079.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are back for a second edition of Stumped! where they try to stump each other with interview questions from [30 Seconds of Interviews](https://30secondsofinterviews.org/). 9 | 10 | ## NativeScript - Sponsor 11 | 12 | NativeScript is an open source framework for building truly native mobile apps with Angular, Vue.js, TypeScript, or JavaScript. It's is a great way for front-end developers to get started building native mobile apps. Get started today at [nativescript.org/syntax](https://nativescript.org/syntax). 13 | 14 | ## Show Notes 15 | 16 | 5:05 17 | 18 | * What are defer and async attributes on a script tag? 19 | 20 | 7:15 21 | 22 | * What are the differences between var, let, const and no keyword statements? 23 | 24 | 8:45 25 | 26 | * What is a callback? Can you show an example using one? 27 | 28 | 9:52 29 | 30 | * What is recursion and when is it useful? 31 | 32 | 12:06 33 | 34 | * What is the difference between the array methods [map()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) and [forEach()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)? 35 | * [Syntax Ep 043](https://syntax.fm/show/043/20-javascript-array-and-object-methods-to-make-you-a-better-developer) 36 | 37 | 14:02 38 | 39 | * What is Big O Notation? 40 | 41 | 15:28 42 | 43 | * What does 0.1 + 0.2 === 0.3 evaluate to? 44 | * [wtfjs](https://wtfjs.com/) 45 | 46 | 17:44 47 | 48 | * What is CSS BEM? 49 | 50 | ## Tweet us your tasty treats! 51 | 52 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 53 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 54 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 55 | * [Wes' Twitter](https://twitter.com/wesbos) 56 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 57 | * [Scott's Twitter](https://twitter.com/stolinski) 58 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 59 | -------------------------------------------------------------------------------- /src/shows/081 - Hacktoberfest.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 81 3 | title: Hasty Treat - Hacktoberfest 4 | date: 1539003600284 5 | url: https://traffic.libsyn.com/syntax/Syntax081.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about this year's [Hacktoberfest](https://hacktoberfest.digitalocean.com/) - a great way to support open source. 9 | 10 | ## NativeScript - Sponsor 11 | 12 | NativeScript is an open source framework for building truly native mobile apps with Angular, Vue.js, TypeScript, or JavaScript. It's is a great way for front-end developers to get started building native mobile apps. Get started today at [nativescript.org/syntax](https://nativescript.org/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:42 17 | 18 | * [Hacktoberfest - The rules](https://hacktoberfest.digitalocean.com/) 19 | 20 | 7:35 21 | 22 | * Things to PR 23 | 24 | 12:56 25 | 26 | * Things *not* to PR 27 | 28 | 18:05 29 | 30 | * How Pull Requests work 31 | 32 | 21:45 33 | 34 | * Some of our repos 35 | * [Wes' ES6 course blog posts](https://github.com/wesbos/es6-articles) 36 | * [Syntax Show Notes](https://github.com/wesbos/syntax) 37 | * [KeyCode.info](http://keycode.info/) 38 | * [CSSCursor.info](http://csscursor.info/) 39 | 40 | ## Tweet us your tasty treats! 41 | 42 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 43 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 44 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 45 | * [Wes' Twitter](https://twitter.com/wesbos) 46 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 47 | * [Scott's Twitter](https://twitter.com/stolinski) 48 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 49 | -------------------------------------------------------------------------------- /src/shows/089 - Stumped.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 89 3 | title: Hasty Treat - Stumped! 03 4 | date: 1541426400602 5 | url: https://traffic.libsyn.com/syntax/Syntax089.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are back for another edition of Stumped! where they try to stump each other with interview questions. Today's questions are from [Flashcards for Developers](https://www.flashcardsfordevelopers.com/). 9 | 10 | ## EmailOctopus - Sponsor 11 | 12 | Email marketing for less, via Amazon SES. EmailOctopus sends your emails through Amazon's Simple Email Service (SES), saving money without sacrificing deliverability. With simple setup and all the features you would expect, EmailOctopus is as flexible as you need it to be. Get started today at [emailoctopus.com/syntax](https://emailoctopus.com/syntax) and get your first three months free. 13 | 14 | ## Show Notes 15 | 16 | 4:03 17 | 18 | * What's the difference between synchronous and asynchronous code? 19 | 20 | 5:56 21 | 22 | * What's the difference between .call and .apply? 23 | 24 | 7:08 25 | 26 | * How do you share code between files? 27 | 28 | 8:18 29 | 30 | * What's the difference between double equals and triple equals? 31 | 32 | 10:40 33 | 34 | * What's the difference between null, undefined, and undeclared? 35 | 36 | 14:18 37 | 38 | * What is the event loop? 39 | * [Philip Roberts - What the heck is the event loop anyway?](https://www.youtube.com/watch?v=8aGhZQkoFbQ) 40 | 41 | 16:02 42 | 43 | * Why is extending built-ins never a good idea? 44 | 45 | ## Tweet us your tasty treats! 46 | 47 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 48 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 49 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 50 | * [Wes' Twitter](https://twitter.com/wesbos) 51 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 52 | * [Scott's Twitter](https://twitter.com/stolinski) 53 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 54 | -------------------------------------------------------------------------------- /src/shows/091 - Stickers.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 91 3 | title: Hasty Treat - How to become a Sticker Mogul 4 | date: 1542031200406 5 | url: https://traffic.libsyn.com/syntax/Syntax091.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about stickers and break down Wes' entire process for creating and selling his sticker packs. Check out [Bos.af](https://bos.af/) for more info. 9 | 10 | ## LogRocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session replayer and a performance monitor. Get 14 days free over at [https://logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 6:08 17 | 18 | * Design 19 | 20 | 9:23 21 | 22 | * Printing 23 | 24 | 16:08 25 | 26 | * Types of Stickers 27 | 28 | 19:34 29 | 30 | * Selling 31 | 32 | 21:43 33 | 34 | * Envelopes, stamps and shipping 35 | 36 | 30:47 37 | 38 | * Returns 39 | 40 | 32:42 41 | 42 | * The future 43 | 44 | ## Links 45 | 46 | * [Bos.af](https://bos.af/) 47 | * [Patrick DePuydt](https://twitter.com/patrickdepuydt) 48 | * [Alibaba](https://www.alibaba.com/) 49 | * [Sticker Mule](https://www.stickermule.com) 50 | * [Shipstation](https://www.shipstation.com/) 51 | 52 | ## Tweet us your tasty treats! 53 | 54 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 55 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 56 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 57 | * [Wes' Twitter](https://twitter.com/wesbos) 58 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 59 | * [Scott's Twitter](https://twitter.com/stolinski) 60 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 61 | -------------------------------------------------------------------------------- /src/shows/093 - Liked.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 93 3 | title: Hasty Treat - How to become well liked at work 4 | date: 1542636000892 5 | url: https://traffic.libsyn.com/syntax/Syntax093.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about how to be well liked at work - dealing with difficult co-workers, being a better co-worker yourself, and general tips for improving your people skills. 9 | 10 | ## LogRocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session replayer and a performance monitor. Get 14 days free over at [https://logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 5:01 - Foster a culture of asking "why" and "how" 17 | 18 | 7:58 - Show your own mistakes 19 | 20 | 9:26 - Be understanding of people’s life situations and accommodate them accordingly 21 | 22 | 11:36 - Be okay with people taking your time 23 | 24 | 13:10 - Don’t take up other people’s time 25 | 26 | 15:40 - Be nice 27 | 28 | 15:57 - Share things 29 | 30 | 16:50 - Respect personal space 31 | 32 | 18:08 - Respect people's time 33 | 34 | ## Links 35 | 36 | * [Adam Grant - Give and Take: Why Helping Others Drives Our Success](https://www.amazon.com/dp/B00AFPTSI0/) 37 | 38 | ## Tweet us your tasty treats! 39 | 40 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 41 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 42 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 43 | * [Wes' Twitter](https://twitter.com/wesbos) 44 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 45 | * [Scott's Twitter](https://twitter.com/stolinski) 46 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 47 | -------------------------------------------------------------------------------- /src/shows/095 - Dependency.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 95 3 | title: Hasty Treat - Should you install a dependency or roll your own? 4 | date: 1543240800404 5 | url: https://traffic.libsyn.com/syntax/Syntax095.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about installing dependencies vs rolling your own - the advantages and disadvantages, and how to know when to do either. 9 | 10 | ## LogRocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session replayer and a performance monitor. Get 14 days free over at [https://logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:15 - Reasons To roll your own 17 | 18 | * Learning Experience 19 | * Fun 20 | * Features 21 | * Add your own features 22 | * Lightweight - only use what you need 23 | 24 | 8:08 - Reasons not to roll your own 25 | 26 | * Battle Tested 27 | * Actually Tested 28 | * Time 29 | * Money 30 | * Experience 31 | 32 | 11:27 - Fork 33 | 34 | * Something needs extra features 35 | * Upstream your changes 36 | 37 | 13:10 - Some Examples 38 | 39 | * Fetch + function vs Axios 40 | * Date functions vs Stack Overflow copy/paste 41 | * Lodash vs your own - try it with map/reduce/filter first, but lots of cases need Lodash 42 | 43 | ## Links 44 | * [React PowerPlug](http://rena.to/react-powerplug/#/) 45 | * [Lodash](https://lodash.com/) 46 | * [Axios](https://github.com/axios/axios) 47 | * [Stack Overflow](https://stackoverflow.com/) 48 | 49 | ## Tweet us your tasty treats! 50 | 51 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 52 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 53 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 54 | * [Wes' Twitter](https://twitter.com/wesbos) 55 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 56 | * [Scott's Twitter](https://twitter.com/stolinski) 57 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 58 | -------------------------------------------------------------------------------- /src/shows/101 - where are they now.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 101 3 | title: Hasty Treat - Where are they now?! Gulp, Grunt, Bower, Backbone and Compass 4 | date: 1545055200601 5 | url: https://traffic.libsyn.com/syntax/Syntax101.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about libraries that have been super hot in the past, but not so much any more. 9 | 10 | ## Contentful - Sponsor 11 | 12 | Contentful is a great way to manage your data. Update once and publish everywhere. Contentful gives you a ton of flexibility and reliability and everything you need to build excellent front-end content without having to worry about the back-end of your site. Check out [contentful.com/syntax](https://www.contentful.com/syntax/) and get a free pair of socks! 13 | 14 | ## Show Notes 15 | 16 | 4:14 17 | 18 | * Grunt / Gulp 19 | 20 | 8:56 21 | 22 | * Backbone / Marionette 23 | 24 | 13:00 25 | 26 | * Bower / Components 27 | 28 | 15:46 29 | 30 | * Compass 31 | 32 | ## Links 33 | * [Grunt](https://gruntjs.com/) 34 | * [Gulp](https://gulpjs.com/) 35 | * [Backbone](http://backbonejs.org/) 36 | * [Marionette](https://marionettejs.com/) 37 | * [Bower](https://bower.io/) 38 | * [Components](http://component.github.io/) 39 | * [Compass](http://compass-style.org/) 40 | 41 | ## Tweet us your tasty treats! 42 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 43 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 44 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 45 | * [Wes' Twitter](https://twitter.com/wesbos) 46 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 47 | * [Scott's Twitter](https://twitter.com/stolinski) 48 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 49 | -------------------------------------------------------------------------------- /src/shows/105 - Pointer Elements.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 105 3 | title: Hasty Treat - CSS and JS Pointer Events 4 | date: 1546264800065 5 | url: https://traffic.libsyn.com/syntax/Syntax105.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about pointer events in CSS and JS - what they are, their differences, why you may want to use them, potential downfalls and more! 9 | 10 | ## Sanity.io - Sponsor 11 | 12 | Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get up and running by typing `npm i -g @sanity/cli && sanity init` in your command line. Get an awesome supercharged free developer plan on [sanity.io/syntax](https://sanity.io/syntax?utm_source=syntax-fm&utm_campaign=syntax1). 13 | 14 | ## Show Notes 15 | 16 | 3:24 17 | 18 | * CSS pointer events 19 | 20 | 10:50 21 | 22 | * JavaScript pointer events 23 | 24 | 14:24 25 | 26 | * What are pointer events 27 | 28 | 17:56 29 | 30 | * Browser support 31 | 32 | ## Links 33 | * [CSS pointer events](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events) 34 | * [JS pointer events](https://developer.mozilla.org/en-US/docs/Web/API/Pointer_events) 35 | * [Pointer events support in WebKit](https://webkit.org/status/#?search=pointer%20events) 36 | * [Pointer events Polyfill](https://github.com/jquery/PEP) 37 | * [Wes' Javascript 30 Course](https://javascript30.com/) 38 | 39 | ## Tweet us your tasty treats! 40 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 41 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 42 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 43 | * [Wes' Twitter](https://twitter.com/wesbos) 44 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 45 | * [Scott's Twitter](https://twitter.com/stolinski) 46 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/107 - CSS Units.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 107 3 | title: Hasty Treat - CSS Units 4 | date: 1546869600660 5 | url: https://traffic.libsyn.com/syntax/Syntax107.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about CSS units (e.g. rems vs ems, px, ch, vmax), when and why you want to be using them, tips and tricks, and more! 9 | 10 | ## LogRocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session replayer and a performance monitor. Get 14 days free over at [https://logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:32 17 | 18 | * Typography with CSS units 19 | 20 | 12:04 21 | 22 | * Pixels 23 | 24 | 15:17 25 | 26 | * Viewport units 27 | 28 | 15:51 29 | 30 | * ch units 31 | 32 | 16:35 33 | 34 | * inch/cm for print 35 | 36 | 17:19 37 | 38 | * Percentages 39 | 40 | 18:10 41 | 42 | * Media queries 43 | 44 | 19:41 45 | 46 | * Flexbox (flex-grow) 47 | 48 | 20:28 49 | 50 | * CSS Grid: flexible units: 1fr 2fr 51 | 52 | ## Links 53 | * [Sentry](https://sentry.io) 54 | 55 | ## Tweet us your tasty treats! 56 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 57 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 58 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 59 | * [Wes' Twitter](https://twitter.com/wesbos) 60 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 61 | * [Scott's Twitter](https://twitter.com/stolinski) 62 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/113 - code tidying.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 113 3 | title: Hasty Treat - Code Quality Tooling 4 | date: 1548684000294 5 | url: https://traffic.libsyn.com/syntax/Syntax113.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about code quality tooling - how to get your code extra nice and clean, and the tools that will help you along the way. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 3:11 - ESLint / JSHint / Linters in general 17 | 18 | * Eslint took over as a flexible solution for code style and quality 19 | * Use plugins and presets to set your rules for different types of project 20 | * Don't be afraid to tweak rules, they are not the word of god 21 | 22 | 10:55 - Prettier 23 | 24 | * Strictly formatting 25 | * Can work with or without ESLint 26 | * Provides an enforceable standard for teams 27 | * Configurable 28 | * Prettier for CSS, PHP, GraphQL, etc. 29 | 30 | 18:46 - VS Code 31 | 32 | * Red underlines like spellcheck for code 33 | * Tooltip for lint errors 34 | * Fix on save vs fix on command 35 | 36 | ## Links 37 | * [ESLint](https://eslint.org/) 38 | * [JSHint](https://jshint.com/) 39 | * [Prettier](https://prettier.io/) 40 | * [Wes' dotfiles](https://github.com/wesbos/dotfiles) 41 | 42 | ## Tweet us your tasty treats! 43 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 44 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 45 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 46 | * [Wes' Twitter](https://twitter.com/wesbos) 47 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 48 | * [Scott's Twitter](https://twitter.com/stolinski) 49 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/115 - code quality.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 115 3 | title: Hasty Treat - Code Quality Tooling Part 2 4 | date: 1549288800743 5 | url: https://traffic.libsyn.com/syntax/Syntax115.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes continue their discussion about code quality tooling - how to get your code extra nice and clean, and the tools that will help you along the way. 9 | 10 | ## LogRocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session replayer and a performance monitor. Get 14 days free at [https://logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:28 17 | 18 | * Typescript and Types 19 | 20 | 5:42 21 | 22 | * Jest and Testing 23 | 24 | 7:48 25 | 26 | * Exceptions & Error Tracking 27 | 28 | ## Links 29 | * [Sentry](https://sentry.io/) 30 | * [Log Rocket](https://logrocket.com/) 31 | * [Rollbar](https://rollbar.com/) 32 | * [Jest](https://jestjs.io/) 33 | 34 | ## Tweet us your tasty treats! 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/117 - email.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 117 3 | title: Hasty Treat - How To Email Busy People 4 | date: 1549893600896 5 | url: https://traffic.libsyn.com/syntax/Syntax117.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes tackle email, specifically, how to email busy people — how to write emails that actually get read, and don't just get tossed in the archive. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 4:05 17 | 18 | * Subject lines 19 | 20 | 11:26 21 | 22 | * The body 23 | 24 | 14:33 25 | 26 | * Best practices 27 | 28 | ## Tweet us your tasty treats! 29 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 30 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 31 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 32 | * [Wes' Twitter](https://twitter.com/wesbos) 33 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 34 | * [Scott's Twitter](https://twitter.com/stolinski) 35 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/119 - side projects.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 119 3 | title: Hasty Treat - Better Living Through Side Projects 4 | date: 1550498400321 5 | url: https://traffic.libsyn.com/syntax/Syntax119.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about side projects — what you can learn, why they're great, how to come up with ideas, and more! 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 2:17 - Why? 17 | 18 | * Keeps you sharp 19 | * It's actually useful 20 | * Try new technology 21 | 22 | 5:28 - How to come up with ideas 23 | 24 | * What sucks in your life? 25 | * How do you get a competitive advantage in life? 26 | 27 | 12:10 - Quick and dirty tech 28 | 29 | * [Next.js](https://nextjs.org/) 30 | * [Express](https://expressjs.com/) 31 | * [diskDB](https://github.com/arvindr21/diskDB) 32 | * [Meteor](https://www.meteor.com/) 33 | 34 | ## Tweet us your tasty treats! 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/121 - youtube.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 121 3 | title: Hasty Treat - Tips to Succeed on YouTube 4 | date: 1551103200787 5 | url: https://traffic.libsyn.com/syntax/Syntax121.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk tips to succeed on YouTube! 9 | 10 | ## Freshbooks - Sponsor 11 | 12 | Get a 30 day free trial of Freshbooks at [freshbooks.com/syntax](https://freshbooks.com/syntax) and put **SYNTAX** in the "How did you hear about us?" section. 13 | 14 | ## Show Notes 15 | 16 | 1:55 17 | 18 | * How YouTube has affected our careers 19 | 20 | 3:45 21 | 22 | * YouTube money is just OK 23 | 24 | 6:28 25 | 26 | * SEO is king 27 | 28 | 7:15 29 | 30 | * The title is most important 31 | 32 | 8:59 33 | 34 | * Description is important 35 | 36 | 11:00 37 | 38 | * Use Tags. All of them. 39 | 40 | 12:00 41 | 42 | * Scheduled content works 43 | 44 | 13:26 45 | 46 | * Keeping Viewers 47 | 48 | 15:20 49 | 50 | * Pinning comments 51 | 52 | 15:41 53 | 54 | * Liking Comments 55 | 56 | 17:00 57 | 58 | * Practice Finishing Sentences 59 | 60 | 17:34 61 | 62 | * Collaborate when you can 63 | 64 | 19:00 65 | 66 | * Use all the features YouTube has to offer 67 | 68 | 20:44 69 | 70 | * Don't get sucked into the BS 71 | 72 | ## Links 73 | * [TubeBuddy](https://www.tubebuddy.com/) 74 | 75 | ## Tweet us your tasty treats! 76 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 77 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 78 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 79 | * [Wes' Twitter](https://twitter.com/wesbos) 80 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 81 | * [Scott's Twitter](https://twitter.com/stolinski) 82 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/139 - ama.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 139 3 | title: Hasty Treat - AMA - Money x Investments x Online Presence x More! 4 | date: 1556553600732 5 | url: https://traffic.libsyn.com/syntax/Syntax139.mp3 6 | --- 7 | 8 | In this special Hasty Treat, Scott and Wes answer your questions about money, investments, online presence and more! 9 | 10 | ## LogRocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [https://logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:33 - Besides coding/teaching, do you have any another source of income (stocks, bonds, crypto, etc.)? 17 | 18 | 9:03 - How do I build my online presence? 19 | 20 | 13:05 - What's your favorite tasty treat (as in actual food)? 21 | 22 | 16:33 - Wes, lets talk about the + symbol that you use to start the prompt for Cobalt2 — whats up with that? 23 | 24 | 18:41 - How do you get out of a rut? 25 | 26 | ## Links 27 | * [Canadian Couch Potato](https://canadiancouchpotato.com/) 28 | 29 | ## Tweet us your tasty treats! 30 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 31 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 32 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 33 | * [Wes' Twitter](https://twitter.com/wesbos) 34 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 35 | * [Scott's Twitter](https://twitter.com/stolinski) 36 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/141 - async await.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 141 3 | title: Hasty Treat - Async + Await Error Handling Strategies 4 | date: 1557147600789 5 | url: https://traffic.libsyn.com/syntax/Syntax141.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes discuss different error handling strategies. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 2:07 - Try / Catch 17 | 18 | * This can be done at call time or inside the function 19 | 20 | 4:10 - Higher Order Function 21 | 22 | * Makes a function that returns a new function which in turn calls your original function (but with a `.catch` chained on) 23 | 24 | 7:46 - Handle the error when you call it 25 | 26 | * Use async/await but chain a `.catch` onto the end 27 | 28 | 9:03 - Node.js Unhandled Rejection Event 29 | 30 | * `process.on('unhandledRejectionEvent', callback)` 31 | 32 | 9:40 - What to do with those errors 33 | 34 | * Send to error tracking service 35 | * Possible to give the user a reference number 36 | * Display good error text to user 37 | 38 | ## Tweet us your tasty treats! 39 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 40 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 41 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 42 | * [Wes' Twitter](https://twitter.com/wesbos) 43 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 44 | * [Scott's Twitter](https://twitter.com/stolinski) 45 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 46 | -------------------------------------------------------------------------------- /src/shows/143 - shadow dom.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 143 3 | title: Hasty Treat - The SHADOW DOM 4 | date: 1557752400187 5 | url: https://traffic.libsyn.com/syntax/Syntax143.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Shadow Doms - what they are, the individual pieces involved with them, why they're important, and how to get started using them. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry](https://sentry.io/) and using the coupon code "tastytreat". 13 | 14 | ## Show Notes 15 | 16 | 2:41 17 | 18 | * What is the shadow DOM? 19 | 20 | 4:25 21 | 22 | * What elements are shadow DOM? 23 | 24 | 5:47 25 | 26 | * Styling shadow DOM elements 27 | 28 | 8:54 29 | 30 | * Creating your own 31 | 32 | 9:22 33 | 34 | * Frameworks 35 | 36 | ## Links 37 | * [Using shadow DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM) 38 | * [Shadow DOM v1: Self-Contained Web Components](https://developers.google.com/web/fundamentals/web-components/shadowdom?hl=en) 39 | * [Polymer](https://www.polymer-project.org/) 40 | * [Svelte 3](https://github.com/sveltejs/svelte/projects/3) 41 | * [Wildhoney - ReactShadow](https://github.com/Wildhoney/ReactShadow) 42 | 43 | ## Tweet us your tasty treats! 44 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 45 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 46 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 47 | * [Wes' Twitter](https://twitter.com/wesbos) 48 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 49 | * [Scott's Twitter](https://twitter.com/stolinski) 50 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/145 - ama.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 145 3 | title: Hasty Treat - AMA - Our Wives, Careers Outside Tech, and Favorites 4 | date: 1558357200178 5 | url: https://traffic.libsyn.com/syntax/Syntax145.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are back with another AMA. This time they talk about their spouses, careers outside of tech, lots of favorites (movies, colors, clothes), and more! 9 | 10 | ## Clubhouse - Sponsor 11 | 12 | Clubhouse is the first project management software that brings everyone together so that teams can focus on what matters: creating products that customers love. Clubhouse provides a perfect balance of simplicity and structure for better cross-functional collaboration. Check out [https://clubhouse.io/syntaxpodcast](https://clubhouse.io/syntaxpodcast) and get your first two months free. 13 | 14 | ## Show Notes 15 | 16 | 2:58 - What do your wives do? 17 | 18 | 6:40 - If you had to choose a different career, what would you do? 19 | 20 | If you started learning another (programming) language today, what would it be? 21 | 22 | 11:50 - Favorites (e.g. colors, movies, brands, etc.) 23 | 24 | 18:08 - Who inspires you? 25 | 26 | 26:19 - What’s your ratio of client work, learning new tech, and teaching via your courses, talks or Syntax.fm? You guys seem awfully busy, and it’s making me feel kinda lazy. 27 | 28 | ## Links 29 | * [Pigeonhole Live](https://pigeonhole.at/) 30 | 31 | ## Tweet us your tasty treats! 32 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 33 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 34 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 35 | * [Wes' Twitter](https://twitter.com/wesbos) 36 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 37 | * [Scott's Twitter](https://twitter.com/stolinski) 38 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/147 - weaknesses.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 147 3 | title: Hasty Treat - Knowing Your Weaknesses 4 | date: 1558962000031 5 | url: https://traffic.libsyn.com/syntax/Syntax147.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about how to identify and work on your weaknesses. 9 | 10 | ## Logrocket - Sponsor 11 | 12 | [LogRocket](https://logrocket.com/syntax) lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [LogRocket](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:45 - Why care about weaknesses? 17 | 18 | * If we avoid the things we're afraid of or bad at we'll always grow in lopsided ways 19 | 20 | 7:32 - As a developer 21 | 22 | * What skills / languages are you not good at or afraid of? 23 | 24 | 14:06 - As an employee 25 | 26 | * Communication 27 | * Company and personal goals 28 | * Efficiency 29 | * Compatibility 30 | 31 | 16:54 - As a human 32 | 33 | * How you treat people 34 | * Sharing your time 35 | * What you're neglecting 36 | * Your living space 37 | 38 | ## Tweet us your tasty treats! 39 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 40 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 41 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 42 | * [Wes' Twitter](https://twitter.com/wesbos) 43 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 44 | * [Scott's Twitter](https://twitter.com/stolinski) 45 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/153 - intl methods.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 153 3 | title: Hasty Treat - New Intl Methods Are Straight Fire 4 | date: 1560776400687 5 | url: https://traffic.libsyn.com/syntax/Syntax153.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about internationalization - how to deal with different languages, different currencies, and more! 9 | 10 | ## LogRocket - Sponsor 11 | 12 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 5:48 - Intl.NumberFormat 17 | 18 | 9:17 - Intl.ListFormat 19 | 20 | 12:17 - Intl.DateTimeFormat / Intl.RelativeTimeFormat 21 | 22 | 14:27 - Intl.PluralRules 23 | 24 | ## Links 25 | * [Standard built-in objects](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects#Internationalization) 26 | * [Language Subtag Registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) 27 | 28 | ## Tweet us your tasty treats! 29 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 30 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 31 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 32 | * [Wes' Twitter](https://twitter.com/wesbos) 33 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 34 | * [Scott's Twitter](https://twitter.com/stolinski) 35 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 36 | -------------------------------------------------------------------------------- /src/shows/155 - growth.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 155 3 | title: Hasty Treat - Making Yourself Uncomfortable To Grow 4 | date: 1561381200757 5 | url: https://traffic.libsyn.com/syntax/Syntax155.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about pushing yourself in uncomfortable areas to grow as a programmer, be a better developer, and become more efficient in general. 9 | 10 | ## Netlify - Sponsor 11 | 12 | Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [Netlify](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 3:50 - CSS Preprocessor parable 17 | 18 | 6:09 - Efficiency 19 | 20 | 10:40 - When to learn new systems 21 | 22 | 13:03 - Common pain points 23 | 24 | 14:42 - Pushing yourself to foster growth 25 | 26 | ## Tweet us your tasty treats! 27 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 28 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 29 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 30 | * [Wes' Twitter](https://twitter.com/wesbos) 31 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 32 | * [Scott's Twitter](https://twitter.com/stolinski) 33 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 34 | -------------------------------------------------------------------------------- /src/shows/163 - Web Dev Sick Picks.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 163 3 | title: Hasty Treat - Web Dev Resource Sick Picks 4 | date: 1563800400176 5 | url: https://traffic.libsyn.com/syntax/Syntax163.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about all of their favorite web dev resources — a full episode of sick picks! 9 | 10 | ## LogRocket - Sponsor 11 | 12 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [LogRocket](https://logrocket.com/syntax). 13 | 14 | ## Show Notes 15 | 16 | 2:03 - Twitter Accounts 17 | 18 | * Scott: [HeyDesigner](https://twitter.com/heydesigner) 19 | * Wes: [Mathias Bynens](https://twitter.com/mathias) 20 | 21 | 5:00 - Web Dev Resources 22 | 23 | * Scott: [Scotch.io](https://scotch.io/) 24 | * Wes: [Webgems.io](https://webgems.io/) 25 | 26 | 7:37 - Design Resources 27 | 28 | * Scott: [UI Movement](https://uimovement.com/) 29 | * Wes: [Creative Market](https://creativemarket.com/) 30 | 31 | 11:36 - Desktop Tools 32 | 33 | * Scott: [Pock](https://pock.dev/) 34 | * Wes: [MongoDB Compass](https://www.mongodb.com/products/compass) 35 | 36 | 14:59 - YouTube 37 | 38 | * Scott: 39 | * [JSConf](https://www.youtube.com/user/jsconfeu) 40 | * [stance](https://www.youtube.com/user/stanceelements) 41 | 42 | * Wes: 43 | * [Andrew Camarata](https://www.youtube.com/channel/UCUujfNBK9uv3cIW-P5PX7vA) 44 | * [dotconferences](https://www.youtube.com/user/dotconferences) 45 | 46 | ## Links 47 | * [Studio3t](https://studio3t.com/) 48 | 49 | ## Tweet us your tasty treats! 50 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 51 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 52 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 53 | * [Wes' Twitter](https://twitter.com/wesbos) 54 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 55 | * [Scott's Twitter](https://twitter.com/stolinski) 56 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/165 - VS Code Part 2.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 165 3 | title: Hasty Treat - VSCode Treats Part 2 4 | date: 1564416000607 5 | url: https://traffic.libsyn.com/syntax/Syntax165.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about more of their favorite VSCode tasty treats - extensions, features, keyboard shortcuts and more! 9 | 10 | ## Netlify - Sponsor 11 | 12 | Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [Netlify](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 3:45 - Extensions 17 | 18 | * [Git Blame](https://marketplace.visualstudio.com/items?itemName=waderyan.gitblame) 19 | * [Apollo GraphQL](https://marketplace.visualstudio.com/items?itemName=apollographql.vscode-apollo) 20 | * [VS Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) 21 | 22 | 9:36 - Features 23 | 24 | * Indent lines in explorer - Workbench > Tree Indent & Guides 25 | * Breadcrumbs 26 | * Commit all & visual git commands 27 | * Change branch in lower left 28 | * Rename Symbol 29 | 30 | ## Links 31 | * [Syntax 161: Hasty Treat - VSCode Extensions & Themes](https://syntax.fm/show/161/hasty-treat-vscode-extensions-and-themes) 32 | * [Alfred](https://www.alfredapp.com/) 33 | * [Playlist.js](https://www.npmjs.com/package/playlist-js) 34 | 35 | ## Tweet us your tasty treats! 36 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 37 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 38 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 39 | * [Wes' Twitter](https://twitter.com/wesbos) 40 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 41 | * [Scott's Twitter](https://twitter.com/stolinski) 42 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/169 - Remote internet.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 169 3 | title: Hasty Treat - Remote Internet 4 | date: 1565614800542 5 | url: https://traffic.libsyn.com/syntax/Syntax169.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about remote internet! Remote internet is an important because it opens up living options to developers as the industry moves toward more remote work. 9 | 10 | ## Netlify Sponsor 11 | 12 | Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [Netlify](https://netlify.com/syntax) for more info. 13 | 14 | ## Show Notes 15 | 16 | 4:31 - Remote internet options 17 | 18 | 7:55 - Modems and routers 19 | 20 | 10:52 - Antennas 21 | 22 | 13:47 - Boosters 23 | 24 | 14:54 - Plans, data and speeds 25 | 26 | 20:11 - Other things to think about 27 | 28 | ## Links 29 | * [Deadmau5 house](https://www.youtube.com/watch?v=dBiqFNNfudA) 30 | * [ZTE MF288](https://www.amazon.com/Hotspot-ZTE-Unlocked-Antennas-Caribbean/dp/B07VWKS38P) 31 | * [Netgear LB1120](https://www.netgear.com/home/products/mobile-broadband/lte-modems/LB1120.aspx) 32 | * [Mofi Routers](https://mofinetwork.com/) 33 | * [ZBT WE826T](https://openwrt.org/toh/zbt/we-826) 34 | * [Rogers](https://www.rogers.com/consumer/wireless) 35 | * [Ubiquiti Networks](https://www.ui.com/) 36 | * [Tomato Firmware](https://www.flashrouters.com/learn/router-basics/what-is-tomato) 37 | 38 | ## Tweet us your tasty treats! 39 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 40 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 41 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 42 | * [Wes' Twitter](https://twitter.com/wesbos) 43 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 44 | * [Scott's Twitter](https://twitter.com/stolinski) 45 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/173 - svelte.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 173 3 | title: Hasty Treat - Wes & Scott Look At Svelte 3 4 | date: 1566824400550 5 | url: https://traffic.libsyn.com/syntax/Syntax173.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Svelte 3 — initial impressions and more! 9 | 10 | ## Netlify - Sponsor 11 | Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up [netlify.com/syntax](https://netlify.com/syntax) for more info. 12 | 13 | ## Show Notes 14 | 15 | 2:16 - What is Svelte? 16 | 17 | 11:32 - Sapper 18 | 19 | 13:05 - Svelte Native 20 | 21 | 14:58 - Questions we have 22 | 23 | * What's the Typescript story here? 24 | * How hard would it be to convert a large React app to Svelte? 25 | * Will Svelte be able to capture the market share it needs to grow and compete? 26 | * Would you (Wes & Scott) use this? 27 | 28 | ## Links 29 | * [https://svelte.dev/examples#hello-world](https://svelte.dev/examples#hello-world) 30 | * [Mustache](http://mustache.github.io/) 31 | * [Webpack](https://webpack.js.org) 32 | * [Rollup.js](https://rollupjs.org/guide/en/) 33 | * [Next.js](https://nextjs.org) 34 | * [Sapper](https://sapper.svelte.dev/) 35 | * [Svelte Native](https://svelte-native.technology/) 36 | * [React Native](https://reactnative.com/) 37 | * [Svelte - Typescript support](https://github.com/sveltejs/svelte/issues/1639) 38 | * [Rethinking Reactivity](https://www.youtube.com/watch?v=AdNJ3fydeao) 39 | 40 | ## Tweet us your tasty treats! 41 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 42 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 43 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 44 | * [Wes' Twitter](https://twitter.com/wesbos) 45 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 46 | * [Scott's Twitter](https://twitter.com/stolinski) 47 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/175 - stumpd.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 175 3 | title: Hasty Treat - Stump'd 4 | date: 1567429200493 5 | url: https://traffic.libsyn.com/syntax/Syntax175.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are back with another edition of Stump'd! where they try to stump each other with interview questions. 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 3:54 - What is the difference between NULL and undefined? 16 | 17 | 5:40 - What is short circuit evaluation in JS? 18 | 19 | 7:25 - What is `use strict`? 20 | 21 | 9:07 - What is the only value not equal to itself in JS? 22 | 23 | 10:36 - When would you create a static class member? 24 | 25 | 11:54 - What is a pure function? 26 | 27 | 13:08 - What is JSONP? 28 | 29 | 14:24 - Describe the layout of the CSS box model? 30 | 31 | ## Tweet us your tasty treats! 32 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 33 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 34 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 35 | * [Wes' Twitter](https://twitter.com/wesbos) 36 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 37 | * [Scott's Twitter](https://twitter.com/stolinski) 38 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/177 - PHP to Node.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 177 3 | title: Hasty Treat - Moving from PHP to Node 4 | date: 1568034000490 5 | url: https://traffic.libsyn.com/syntax/Syntax177.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about moving from PHP to Node — pitfalls to avoid, best practices and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 3:43 - Servers need to be started and baby sat 16 | 17 | 4:48 - There is no built-in file system based routing 18 | 19 | 6:34 - Some "gotchas" 20 | 21 | 7:02 - Functional programming 22 | 23 | 8:17 - Async vs sync 24 | 25 | 11:11 - Event lifecycles 26 | 27 | 12:09 - Dependencies 28 | 29 | 14:17 - Keyed arrays 30 | 31 | ## Links 32 | * [Wes' tweet thread](https://twitter.com/wesbos/status/1166355311126634496) 33 | * [Forever](https://www.npmjs.com/package/forever) 34 | * [PM2](http://pm2.keymetrics.io/) 35 | 36 | ## Tweet us your tasty treats! 37 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 38 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 39 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 40 | * [Wes' Twitter](https://twitter.com/wesbos) 41 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 42 | * [Scott's Twitter](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/179 - TLD.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 179 3 | title: Hasty Treat - The TLD Game 4 | date: 1568638800822 5 | url: https://traffic.libsyn.com/syntax/Syntax179.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are playing a game! It's called the TLD game, where Scott and Wes try to stump each other with questions about top level domains. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 1:55 - The rules of the game 16 | 17 | We pick a TLD from a list, and the other person needs to guess: 18 | 19 | 1. Is it for a country or business? -5 points 20 | 2. What country, business, or type of business is it for? -5 points 21 | 3. How much per year does it cost to register? You may also say "unregisterable" +/- off by $$ 22 | 4. is scott.___ and wes.___ available? -10 for each 23 | 24 | 5:40 - .BO 25 | 26 | 7:51 - .BZH 27 | 28 | 9:50 - .BANANAREPUBLIC 29 | 30 | 11:15 - .BABY 31 | 32 | 14:04 - .KR 33 | 34 | 16:09 - .MOTO 35 | 36 | 17:25 - .AW 37 | 38 | 19:16 - .IM 39 | 40 | ## Links 41 | * [101Domain](https://www.101domain.com/) 42 | 43 | ## Tweet us your tasty treats! 44 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 45 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 46 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 47 | * [Wes' Twitter](https://twitter.com/wesbos) 48 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 49 | * [Scott's Twitter](https://twitter.com/stolinski) 50 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/181 - automating stuff.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 181 3 | title: Hasty Treat - Automating Stuff 4 | date: 1569243600529 5 | url: https://traffic.libsyn.com/syntax/Syntax181.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are talking about automation — apps, workflows, resources, and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 3:16 - Alfred workflows 16 | 17 | 9:32 - Smart home routines 18 | 19 | 13:16 - Bash scripts & aliases 20 | 21 | 17:06 - Remove node_modules 22 | 23 | * `find . -name "node_modules" -type d -prune -exec rm -rf '{}' +` 24 | 25 | 18:43 - Other 26 | 27 | ## Links 28 | * [Alfred](https://www.alfredapp.com/) 29 | * [Wyze Cam](https://www.wyze.com/) 30 | * [Google Home](https://store.google.com/gb/product/google_home) 31 | * [Drip](https://www.drip.com/) 32 | * [Divvy](https://mizage.com/divvy/) 33 | * [Z](https://github.com/rupa/z) 34 | * [Wes' Video on Z](https://www.youtube.com/watch?v=qbNn5zJLZU0) 35 | 36 | ## Tweet us your tasty treats! 37 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 38 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 39 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 40 | * [Wes' Twitter](https://twitter.com/wesbos) 41 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 42 | * [Scott's Twitter](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/187 - float tank.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 187 3 | title: Hasty Treat - Float Tank Experiences 4 | date: 1571058000188 5 | url: https://traffic.libsyn.com/syntax/Syntax187.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about their experiences with float tanks! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 2:28 - What is a float tank? 15 | 16 | 6:47 - What are the benefits? 17 | 18 | 8:50 - How did you feel during the float? 19 | 20 | 17:28 - Would you do it again? 21 | 22 | ## Links 23 | * [The Joe Rogan Experience](http://podcasts.joerogan.net/) 24 | 25 | ## Tweet us your tasty treats! 26 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 27 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 28 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 29 | * [Wes' Twitter](https://twitter.com/wesbos) 30 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 31 | * [Scott's Twitter](https://twitter.com/stolinski) 32 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/189 - SSR.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 189 3 | title: Hasty Treat - React Server Side Rendering 4 | date: 1571662800494 5 | url: https://traffic.libsyn.com/syntax/Syntax189.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about server side rendering — what it is, how to use it, best practices, things to avoid, and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 3:20 - What is SSR? 16 | 17 | 4:16 - Why SSR at all? 18 | 19 | 8:39 - Platforms that do SSR out of the box 20 | 21 | 11:18 - Gotchas 22 | 23 | * useLayoutEffect 24 | `import { useEffect, useLayoutEffect } from 'react'` 25 | `const useIsoLayoutEffect =` 26 | `typeof window !== 'undefined' ? useLayoutEffect : useEffect` 27 | `export default useIsoLayoutEffect` 28 | 29 | 18:20 - Tools 30 | 31 | ## Links 32 | * [Next.js](https://nextjs.org/) 33 | * [Gatsby](https://www.gatsbyjs.org/) 34 | * [Webpack](https://webpack.js.org) 35 | * [Parcel](https://parceljs.org/) 36 | * [Meteor](https://www.meteor.com/) 37 | * [React](https://reactjs.org/) 38 | * [NoSSR component](https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/NoSsr/NoSsr.js) 39 | * [Syntax 127: Hasty Treat - React Suspense](https://syntax.fm/show/127/hasty-treat-react-suspense) 40 | 41 | ## Tweet us your tasty treats! 42 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 43 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 44 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 45 | * [Wes' Twitter](https://twitter.com/wesbos) 46 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 47 | * [Scott's Twitter](https://twitter.com/stolinski) 48 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/191 - iphone.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 191 3 | title: Hasty Treat - Scott Moves to iPhone 4 | date: 1572267600974 5 | url: https://traffic.libsyn.com/syntax/Syntax191.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott talks about moving to iPhone — his experiences with both Android and iOS, the advantages and disadvantages of both, and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 1:59 - My device history 16 | 17 | * OG Droid → Nexus → Pixel 18 | * Misconceptions of android 19 | * It's Windows for phones 20 | * It's cheaper or not as nice 21 | 22 | 5:03 - Why switch? 23 | 24 | 6:39 - Who wins what? 25 | 26 | * Android 27 | * Homescreen 28 | * Low light photography 29 | * Usability 30 | * Squeeze assistant 31 | * Google search integrated everywhere 32 | * Search 33 | * Keyboard 34 | * Notification 35 | 36 | * iOS 37 | * Apps 38 | * Performance 39 | * Camera overall 40 | * Device quality 41 | * Fun stuff 42 | * Haptics 43 | 44 | ## Links 45 | * [1Password](https://1password.com/) 46 | * [LastPass](https://www.lastpass.com/) 47 | * [Gboard](https://play.google.com/store/apps/details?id=com.google.android.inputmethod.latin&hl=en_US) 48 | 49 | 50 | ## Tweet us your tasty treats! 51 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 52 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 53 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 54 | * [Wes' Twitter](https://twitter.com/wesbos) 55 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 56 | * [Scott's Twitter](https://twitter.com/stolinski) 57 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/193 - spooky.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 193 3 | title: Hasty Treat - Spooky Stories 4 | date: 1572876000779 5 | url: https://traffic.libsyn.com/syntax/Syntax193.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes bring you _more_ web dev horror stories! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 2:26 - Perf Woes 16 | 17 | 3:42 - Always Backup Your Backups 18 | 19 | 4:54 - Kill Children 20 | 21 | 6:03 - Robots Don't Eat Food 22 | 23 | 8:32 - Email Goof Up 24 | 25 | 9:44 - Hundreds of Thousands of Date Issues 26 | 27 | 10:46 - Spooky August 28 | 29 | 12:32 - You're up to .bat 30 | 31 | 13:17 - Printed Code 32 | 33 | 15:12 - ThinkGeek 34 | 35 | 16:12 - It would take a while to Ketchup on all these orders 36 | 37 | 17:05 - This story makes me want to stick my head in async 38 | 39 | ## Tweet us your tasty treats! 40 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 41 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 42 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 43 | * [Wes' Twitter](https://twitter.com/wesbos) 44 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 45 | * [Scott's Twitter](https://twitter.com/stolinski) 46 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/195 - domains.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 195 3 | title: Hasty Treat - Buying and Selling Domain Names 4 | date: 1573480800714 5 | url: https://traffic.libsyn.com/syntax/Syntax195.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about domain names — buying and selling, best practices and more! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 2:50 - Buying a domain 16 | 17 | 10:47 - Selling a domain 18 | 19 | 13:50 - Transferring a domain 20 | 21 | ## Links 22 | * [who.is](https://who.is/) 23 | * [GoDaddy](https://www.godaddy.com/) 24 | * [JavaScript.co](https://javascript.co/) 25 | * [BeginnerJavaScript.com](https://www.beginnerjavascript.com/) 26 | * [LearnNode.com](https://learnnode.com/) 27 | * [BeginnerJS.com](https://beginnerjs.com/) 28 | * [KitBos.com](https://kitbos.com/) 29 | * [Cloudflare](https://www.cloudflare.com/) 30 | * [Learn.li](http://learn.li/) 31 | * [Learnli.co](http://learnli.co/) 32 | * [Escrow.com](http://escrow.com/) 33 | * [Hover](https://hover.com/) 34 | * [Bob.com](http://bob.com) 35 | * [Sedo.com](https://sedo.com/) 36 | * [Park.io](https://park.io/) 37 | 38 | ## Tweet us your tasty treats! 39 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 40 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 41 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 42 | * [Wes' Twitter](https://twitter.com/wesbos) 43 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 44 | * [Scott's Twitter](https://twitter.com/stolinski) 45 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/199 - courses.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 199 3 | title: Hasty Treat - So you want to make a course... Will people buy it? 4 | date: 1574690400961 5 | url: https://traffic.libsyn.com/syntax/Syntax199.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about making courses — techniques, best practices, things to avoid, and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 3:07 - Validating your ideas 16 | 17 | 4:44 - Generating ideas 18 | 19 | 6:38 - Figuring out which ideas will stick 20 | 21 | 10:00 - Show your expertise 22 | 23 | 14:02 - Pay attention to what's popular 24 | 25 | 15:50 - Collect email addresses 26 | 27 | ## Links 28 | * [Microsoft Excel Stream Highlights](https://www.youtube.com/watch?v=xubbVvKbUfY) 29 | * [Refactoring UI](https://refactoringui.com/) 30 | * [Adam Wathan](https://twitter.com/adamwathan) 31 | * [Steve Schoger](https://twitter.com/steveschoger) 32 | * [Scott's Svelte 3 course](https://www.leveluptutorials.com/tutorials/svelte-for-beginners) 33 | * [Wes' Sublime Text articles](https://wesbos.com/category/sublime-text/) 34 | 35 | ## Tweet us your tasty treats! 36 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 37 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 38 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 39 | * [Wes' Twitter](https://twitter.com/wesbos) 40 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 41 | * [Scott's Twitter](https://twitter.com/stolinski) 42 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/201 - CSS.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 201 3 | title: Hasty Treat - New CSS Logical Properties 4 | date: 1575295200678 5 | url: https://traffic.libsyn.com/syntax/Syntax201.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about new CSS Logical Properties. 9 | 10 | ## Hasura - Sponsor 11 | Hasura is an open source real-time GraphQL engine. It connects to your databases & microservices and instantly gives you a production-ready GraphQL API. Check it out at [Hasura.io](https://hasura.io/). 12 | 13 | ## Show Notes 14 | 15 | 2:27 - The Box Model 16 | 17 | 5:32 - Grid and Flexbox 18 | 19 | 10:17 - Widths and Heights 20 | 21 | 11:20 - Text Align 22 | 23 | ## Links 24 | * [New CSS Logical Properties!](https://medium.com/@elad/new-css-logical-properties-bc6945311ce7) 25 | * [Elad Shechter](https://twitter.com/eladsc) 26 | * [Adam Argyle](https://twitter.com/argyleink) 27 | 28 | ## Tweet us your tasty treats! 29 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 30 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 31 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 32 | * [Wes' Twitter](https://twitter.com/wesbos) 33 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 34 | * [Scott's Twitter](https://twitter.com/stolinski) 35 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/203 - github actions.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 203 3 | title: Hasty Treat - What Are Github Actions? 4 | date: 1575900000500 5 | url: https://traffic.libsyn.com/syntax/Syntax203.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Gihub Actions — what they do, why you might be interested in them, best practices and more! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 2:30 - What are Github Actions? 16 | 17 | 4:40 - Examples of Github Actions 18 | 19 | 6:02 - Will Github Actions replace continuous integration services? 20 | 21 | 9:19 - Libraries 22 | 23 | ## Links 24 | * [Codeship](https://codeship.com/) 25 | * [Github Actions](https://github.com/marketplace?type=actions) 26 | * [nextdiff](https://github.com/zeit/nextdiff/blob/master/screenshot.js) 27 | * [Figma Action](https://github.com/marketplace/actions/figma-action) 28 | 29 | ## Tweet us your tasty treats! 30 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 31 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 32 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 33 | * [Wes' Twitter](https://twitter.com/wesbos) 34 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 35 | * [Scott's Twitter](https://twitter.com/stolinski) 36 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/207 - courses.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 207 3 | title: Hasty Treat - How We Launch Courses 4 | date: 1577109600835 5 | url: https://traffic.libsyn.com/syntax/Syntax207.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about launching courses — a behind-the-scenes look at their platforms, processes, best practices, and what it takes to get a course published. 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 2:13 - Scott's process 16 | 17 | 8:48 - Wes' process 18 | 19 | 20:57 - Additional tips 20 | 21 | ## Links 22 | * [Beginner Javascript](https://beginnerjavascript.com) 23 | * [Level Up Tutorials](https://www.leveluptutorials.com/) 24 | * [Figma](https://www.figma.com/) 25 | * [Tim Smith](https://ttimsmith.com/) 26 | * [YouTube](https://youtube.com) 27 | * [Vimeo](https://vimeo.com/) 28 | * [HandBrake](https://handbrake.fr/) 29 | * [Screenflow](https://www.telestream.net/screenflow/) 30 | * [Backblaze B2](https://www.backblaze.com/b2/cloud-storage.html) 31 | * [VS Code](https://code.visualstudio.com/) 32 | 33 | ## Tweet us your tasty treats! 34 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 35 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 36 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 37 | * [Wes' Twitter](https://twitter.com/wesbos) 38 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 39 | * [Scott's Twitter](https://twitter.com/stolinski) 40 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/209 - Keystone.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 209 3 | title: Hasty Treat - Wes Teaches Scott about Keystone.js 4 | date: 1577714400995 5 | url: https://traffic.libsyn.com/syntax/Syntax209.mp3 6 | --- 7 | 8 | In this Hasty Treat, Wes teaches Scott about Keystone.js — best practices, things to avoid, why you should check it out, and more! 9 | 10 | ## Freshbooks - Sponsor 11 | Get a 30 day free trial of Freshbooks at [freshbooks.com/syntax](https://freshbooks.com/syntax) and put SYNTAX in the "How did you hear about us?" section. 12 | 13 | ## Show Notes 14 | 15 | 3:10 - What is Keystone? 16 | 17 | 7:38 - How do you handle mutations? 18 | 19 | 14:26 - What's the hosting situation like? 20 | 21 | 19:34 - Shortcomings 22 | 23 | 21:40 - Plugins 24 | 25 | ## Links 26 | * [KeystoneJS](https://www.keystonejs.com/) 27 | * [Prisma](https://www.prisma.io/) 28 | * [Hasura](https://hasura.io/) 29 | * [Next.js](https://nextjs.org/) 30 | * [GraphQL](https://graphql.org/) 31 | * [Stripe API](https://stripe.com/docs/api) 32 | * [WordPress](https://wordpress.org/) 33 | * [ThinkMail](https://www.thinkmail.com/) 34 | * [Drupal](https://www.drupal.org/) 35 | * [Redux](https://redux.js.org/) 36 | * [Now](https://zeit.co/home) 37 | * [MongoDB](https://www.mongodb.com/) 38 | * [MongoDB Compass](https://www.mongodb.com/products/compass) 39 | * [pm2](https://pm2.keymetrics.io/) 40 | * [TypeScript](https://www.typescriptlang.org/) 41 | * [Apollo Helpers](https://www.keystonejs.com/keystonejs/apollo-helpers/) 42 | * [GraphCool](https://www.graph.cool/) 43 | 44 | ## Tweet us your tasty treats! 45 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 46 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 47 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 48 | * [Wes' Twitter](https://twitter.com/wesbos) 49 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 50 | * [Scott's Twitter](https://twitter.com/stolinski) 51 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/211 - node modules.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 211 3 | title: Hasty Treat - Modules in Node 4 | date: 1578319200102 5 | url: https://traffic.libsyn.com/syntax/Syntax211.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about modules in Node — what are they, how they're different from browser modules, and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 3:06 - How were they done before? 16 | 17 | 5:11 - How do they work? 18 | 19 | 7:07 - How to use Modules in Node 20 | 21 | 9:57 - Gotchas 22 | 23 | 13:18 - What should you use? 24 | 25 | ## Links 26 | * [Node](https://nodejs.org/) 27 | * [Node Modules](https://github.com/nodejs/modules) 28 | * [Babel](https://babeljs.io/) 29 | * [ESM](https://www.npmjs.com/package/esm) 30 | * [Meteor](https://www.meteor.com/) 31 | * [Keystone](https://www.keystonejs.com/) 32 | * [MJS](http://clive.tries.fed.wiki/view/michael-jackson-script) 33 | 34 | ## Tweet us your tasty treats! 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/213 - firefox.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 213 3 | title: Hasty Treat - A Month On Firefox 4 | date: 1578924000521 5 | url: https://traffic.libsyn.com/syntax/Syntax213.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about a month of using Firefox — what they liked, what they didn't, and whether or not they'll keep using it. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 3:42 - Dev tools are really good 15 | 16 | 19:16 - Browsing experience 17 | 18 | 22:40 - Setup and switchover tips 19 | 20 | 26:45 - What we didn't like 21 | 22 | 29:57 - Will we stay? 23 | 24 | ## Links 25 | * [Firefox](https://www.mozilla.org/en-US/firefox/new/) 26 | * [Errors in Firefox](https://twitter.com/wesbos/status/1202334015841280003) 27 | * [Debugging messages in Firefox](https://twitter.com/wesbos/status/1202284172351553537/photo/1) 28 | * [Harald Kirschner](https://twitter.com/digitarald) 29 | * [GraphQL](https://graphql.org/) 30 | * [1Password](https://1password.com/) 31 | * [WhatsApp](https://www.whatsapp.com/) 32 | * [Videostream for Chromecast](https://chrome.google.com/webstore/detail/videostream-for-google-ch/cnciopoikihiagdjbjpnocolokfelagl?hl=en) 33 | 34 | ## Tweet us your tasty treats! 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/229 - cloudflare.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 229 3 | title: Hasty Treat - Scott asks Wes about Cloudflare 4 | date: 1583758800768 5 | url: https://traffic.libsyn.com/syntax/Syntax229.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott asks Wes about Cloudflare — which services he uses, which ones he doesn't, why, and more! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 2:45 - What do you personally use Cloudflare for? 16 | 17 | * DNS provider 18 | * Domain registration at cost 19 | * Caching 20 | * DDoS protection 21 | * Hiding server IP address 22 | * Free HTTPS 23 | * Firewall rules 24 | * Scrape shield 25 | * Lightweight stats 26 | * Serverless functions 27 | * DNS 28 | * Cloudflare Warp 29 | 30 | 16:40 - What are you not using? 31 | 32 | * KV storage 33 | * Video streaming 34 | * Deep customization around blocking/errors 35 | 36 | 19:49 - How do you set it up? 37 | 38 | ## Links 39 | * [Cloudflare](https://www.cloudflare.com/) 40 | * [Beginner Javascript](https://beginnerjavascript.com/) 41 | * [Digital Ocean](https://www.digitalocean.com/) 42 | * [DNS Simple](https://dnsimple.com/) 43 | * [Let's Encrypt](https://letsencrypt.org/) 44 | * [Syntax Ep 224: Serverless / Cloud Functions - Part 1](https://syntax.fm/show/224/serverless-cloud-functions-part-1) 45 | * [Begin](https://begin.com/) 46 | * [7-Eleven hit "Dance The Slurp"](https://www.youtube.com/watch?v=px1Tn0LTqcs) 47 | 48 | ## Tweet us your tasty treats! 49 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 50 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 51 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 52 | * [Wes' Twitter](https://twitter.com/wesbos) 53 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 54 | * [Scott's Twitter](https://twitter.com/stolinski) 55 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/231 - hiring.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 231 3 | title: Hasty Treat - Hiring an Assistant 4 | date: 1584363600920 5 | url: https://traffic.libsyn.com/syntax/Syntax231.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about how to hire an assistant — something that can make your life a lot easier as a solo developer. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 2:34 - Finding someone 16 | 17 | * Virtual Assistant 18 | * Offset timezones can be handy 19 | * Flexible is great - two hours here, two hours there 20 | 21 | 5:55 - Types of tasks to delegate 22 | 23 | * Support 24 | * Email replies 25 | * Mail and shipping items 26 | * Invoicing 27 | * Expenses 28 | * Research - find emails for X 29 | * Blog post edits 30 | * Sponsorships 31 | 32 | 14:50 - Standard Operating Procedures 33 | 34 | * If something happens more than once, make an SOP 35 | * Common questions that come up 36 | 37 | 18:07 - Tools 38 | 39 | * 1Password 40 | * Missive 41 | * Custom backend tools for: 42 | * Managing courses 43 | * Issuing refunds 44 | * Chromebook 45 | * Google Docs 46 | 47 | 21:52 - Hours 48 | 49 | ## Links 50 | * [1Password](https://1password.com/) 51 | * [Missive](https://missiveapp.com/) 52 | * [Notion](https://www.notion.so/) 53 | * [Freshbooks](https://freshbooks.com/syntax) 54 | * [Syntax Ep 184: Desktop & Mobile Apps With a Single Codebase](https://syntax.fm/show/184/desktop-and-mobile-apps-with-a-single-codebase) 55 | 56 | ## Tweet us your tasty treats! 57 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 58 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 59 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 60 | * [Wes' Twitter](https://twitter.com/wesbos) 61 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 62 | * [Scott's Twitter](https://twitter.com/stolinski) 63 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/233 - purchasing.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 233 3 | title: Hasty Treat - Purchasing Power Parity 4 | date: 1584968400415 5 | url: https://traffic.libsyn.com/syntax/Syntax233.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about purchasing power parity — what it is, and how Wes has implemented it on his course website. 9 | 10 | ## Prismic - Sponsor 11 | Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at [prismic.io/syntax](https://prismic.io/syntax). 12 | 13 | ## Show Notes 14 | 15 | 2:36 - What is it? 16 | 17 | 5:43 - How do you calculate it? 18 | 19 | * Big Mac Index 20 | * [Purchasing Power Parity](https://github.com/rwieruch/purchasing-power-parity) 21 | * [Spotify Pricing Index](https://mts.io/projects/spotify-pricing/) 22 | * [Glassdoor](https://www.glassdoor.com/) 23 | * Just ask developers what they make 24 | 25 | 8:04 - How do you implement it? 26 | 27 | * Cloudflare headers 28 | * Dealing with VPNs 29 | * Does it work with sales? 30 | 31 | 16:09 - Is it client-side only? 32 | 33 | ## Links 34 | * [country-emoji npm package](https://www.npmjs.com/package/country-emoji) 35 | 36 | ## Tweet us your tasty treats! 37 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 38 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 39 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 40 | * [Wes' Twitter](https://twitter.com/wesbos) 41 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 42 | * [Scott's Twitter](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/237 - abstraction.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 237 3 | title: Hasty Treat - Abstraction 4 | date: 1586178000870 5 | url: https://traffic.libsyn.com/syntax/Syntax237.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about abstraction in general as well as javascript programming. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 1:48 - What the heck is abstraction? 16 | 17 | * I like to think of it as sweeping under the rug 18 | * Vue and React devs should be very familiar with the concept 19 | 20 | 4:44 - When to abstract 21 | 22 | * When things are getting too heavy 23 | * Personal preference 24 | * Some people have an arbitrary line limit 25 | 26 | 7:25 - When not to abstract 27 | 28 | * When savings are minimal 29 | * When it just adds a pointless layer 30 | 31 | 9:40 - Personal code abstractions vs public 32 | 33 | * My personal focus is on API simplicity and baked-in smart defaults 34 | * More specific 35 | * Public APIs need to be more flexible or at least for some components 36 | 37 | ## Links 38 | * [React](https://reactjs.org/) 39 | * [Vue](https://vuejs.org/) 40 | * [Svelte](https://svelte.dev/) 41 | * [Max MSP](https://www.instructables.com/id/Intro-to-MaxMSP/) 42 | * [chakra UI](https://chakra-ui.com/) 43 | 44 | ## Tweet us your tasty treats! 45 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 46 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 47 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 48 | * [Wes' Twitter](https://twitter.com/wesbos) 49 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 50 | * [Scott's Twitter](https://twitter.com/stolinski) 51 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/245 - js events.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 245 3 | title: Hasty Treat - Things You Should Know About Javascript Events 4 | date: 1588597200626 5 | url: https://traffic.libsyn.com/syntax/Syntax245.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about javascript events, and how to avoid some common pitfalls! 9 | 10 | ## Prismic - Sponsor 11 | Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at [prismic.io/syntax](https://prismic.io/syntax). 12 | 13 | ## Show Notes 14 | 15 | 02:23 - Event bubbling 16 | 17 | * Some events bubble, some don't 18 | * Clicks bubble 19 | * Mouseevents bubble 20 | * Focus doesn't bubble 21 | 22 | 04:10 - Event capturing 23 | 24 | * Capture: down, bubble up 25 | * Canceling: prevent default 26 | * target` vs currentTarget 27 | * currentTarget is what got clicked 28 | * target is what you listened for the click on 29 | * event.isTrusted 30 | * addEventListener once: true 31 | 32 | ## Links 33 | * [Javascript30](https://javascript30.com/) 34 | * [BeginnerJavascript](https://beginnerjavascript.com/) 35 | 36 | ## Tweet us your tasty treats! 37 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 38 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 39 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 40 | * [Wes' Twitter](https://twitter.com/wesbos) 41 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 42 | * [Scott's Twitter](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/253 - slow connection.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 253 3 | title: Hasty Treat - Developing for Slow and Spotty Connections 4 | date: 1591016400405 5 | url: https://traffic.libsyn.com/syntax/Syntax253.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about how to develop for slow internet connections. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 02:26 - Types of Slow connections 16 | 17 | * Slow upload 18 | * Slow download 19 | * This could be that your kids are watching a show and your partner is on a zoom call 20 | * High latency 21 | * Intermittent 22 | 23 | 07:47 - Loading UI 24 | 25 | * Show loading UI for everything, but after X seconds 26 | * Page transitions on SPAs 27 | * Form switches - enter country, get list of provinces/shipping/whatever 28 | 29 | 11:58 - Account for XHR failures 30 | 31 | * Sometimes I'm in a loading state forever 32 | * State machines will account for this 33 | 34 | 13:26 - "Still working" timeouts 35 | 36 | * Some sort of timeout so the user can get feedback 37 | 38 | ## Links 39 | * [Sentry](https://sentry.io) 40 | * [Sapper](https://sapper.svelte.dev/) 41 | * [Backblaze](https://www.backblaze.com/) 42 | 43 | ## Tweet us your tasty treats! 44 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 45 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 46 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 47 | * [Wes' Twitter](https://twitter.com/wesbos) 48 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 49 | * [Scott's Twitter](https://twitter.com/stolinski) 50 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/259 - css functions.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 259 3 | title: Hasty Treat - Some Neat CSS Functions That You Should Know About 4 | date: 1592830800219 5 | url: https://traffic.libsyn.com/syntax/Syntax259.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about CSS functions, what they are, how to use them, and more! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 02:13 - attr() 16 | 17 | 04:14 - calc() 18 | 19 | 06:05 - :is() 20 | 21 | 07:20 - sin, cos, tan, acos, asin, sqrt, pow 22 | 23 | 08:52 - clamp() 24 | 25 | 12:13 - minmax() 26 | 27 | 14:24 - fit-content() 28 | 29 | 15:35 - filter 30 | 31 | * blur() 32 | * grayscale() 33 | * sepia() 34 | * opacity() 35 | * contrast() 36 | * url() 37 | 38 | ## Links 39 | * [https://twitter.com/wesbos/status/1256229763225657348/photo/1](https://twitter.com/wesbos/status/1256229763225657348/photo/1) 40 | 41 | ## Tweet us your tasty treats! 42 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 43 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 44 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 45 | * [Wes' Twitter](https://twitter.com/wesbos) 46 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 47 | * [Scott's Twitter](https://twitter.com/stolinski) 48 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/265 - domains.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 265 3 | title: Hasty Treat - The Domain Name Game 4 | date: 1594645200954 5 | url: https://traffic.libsyn.com/syntax/Syntax265.mp3 6 | --- 7 | 8 | In this Hasty Treat it's another edition of the Top Level Domain Game! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 02:25 - How it works 16 | 17 | We pick a TLD from a list, and the other person needs to guess: 18 | 19 | 1. Is it for a country or business? +5 points 20 | 2. What country, business, or type of business is it for? +5 points 21 | 3. How much per year does it cost to register? You may also say "unregisterable" +/- off by $$ [https://www.101domain.com/](https://www.101domain.com/) 22 | 4. Is scott.**_ and wes._** available? -10 points for each 23 | 24 | 04:00 - .sd 25 | 26 | * Scott: 5 + -5 + -126 + -10 + 10 = -126 27 | 28 | 05:46 - .ong 29 | 30 | * Wes: 5 + -5 + -30 + 20 = -10 31 | 32 | 07:53 - .koeln 33 | 34 | * Scott: 5 + -5 + -20 + 20 = -126 35 | 36 | 09:23 - .co.ke 37 | 38 | * Wes: 10 + -15 + 0 = -15 39 | 40 | 11:00 - .tr 41 | 42 | * Scott: 5 + -5 + 0 + 0 = -126 43 | 44 | 12:25 - .ist 45 | 46 | * Wes: -5 + 5 + -10 + 0 = -25 47 | 48 | 13:57 - .xn—45q11c 49 | 50 | * Scott: 5 + 5 + -295 + 10 = 20 = -401 51 | 52 | 16:40 - .reit 53 | 54 | * Wes: 10 + -1460 + 10 = -1465 55 | 56 | ## Tweet us your tasty treats! 57 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 58 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 59 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 60 | * [Wes' Twitter](https://twitter.com/wesbos) 61 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 62 | * [Scott's Twitter](https://twitter.com/stolinski) 63 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/267 - turbolinks.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 267 3 | title: Hasty Treat - Turbolinks + Server Generated HTML + JS Sprinkles 4 | date: 1595250000426 5 | url: https://traffic.libsyn.com/syntax/Syntax267.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about turbolinks — what it is, how to use is, popular apps using is, and more! 9 | 10 | ## Prismic - Sponsor 11 | Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at [prismic.io/syntax](https://prismic.io/syntax). 12 | 13 | ## Show Notes 14 | 15 | 02:50 - What is turbolinks? 16 | * Generate HTML on the server 17 | * Send it over the ajax request 18 | * Load it in the page 19 | 20 | 03:55 - Who is using Turbolinks? 21 | * [GitHub](https://github.com/) 22 | * [Basecamp](https://basecamp.com/) 23 | * [Hey.com](https://hey.com) 24 | 25 | 05:24 - Turbo Links javascript browser bundle 26 | * Intercepts any link click 27 | * Fetches the page HTML 28 | 29 | 09:19 - JS Sprinkles 30 | * Vanilla JS 31 | * [jQuery](https://jquery.com/) 32 | * [Stimulus](https://stimulusjs.org/) 33 | * [Alpine JS](https://github.com/alpinejs/alpine) 34 | 35 | ## Links 36 | * [Turbolinks](https://github.com/turbolinks/turbolinks) 37 | * [Syntax 254: Headless CMS Break Down & Roundup](https://syntax.fm/show/254/headless-cms-break-down-and-roundup) 38 | * [pjax](https://pjax.herokuapp.com/) 39 | * [Svelte](https://svelte.dev/) 40 | * [Next.js](https://nextjs.org/) 41 | 42 | ## Tweet us your tasty treats! 43 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 44 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 45 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 46 | * [Wes' Twitter](https://twitter.com/wesbos) 47 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 48 | * [Scott's Twitter](https://twitter.com/stolinski) 49 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/273 - process.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 273 3 | title: Hasty Treat - How To Refine Your Process 4 | date: 1597064400502 5 | url: https://traffic.libsyn.com/syntax/Syntax273.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about refining your processes, how to evaluate them, make them better, and more! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 04:18 - Find slow process 16 | * Getting through email 17 | * Cleaning my desk 18 | 19 | 06:29 - Set clear goals (smart goals) 20 | * Is my inbox less crazy? 21 | * Don't spend too much time 22 | * Do a 30-day challenge 23 | 24 | 09:46 - Ask around 25 | * What are people you know using and why 26 | * Time-blocking 27 | * Batching 28 | * Eat that frog 29 | 30 | ## Links 31 | * [Streaks](https://streaksapp.com/) 32 | * [Matt Cutts — Try something new for 30 days](https://www.ted.com/talks/matt_cutts_try_something_new_for_30_days) 33 | * [1Writer](https://1writerapp.com/) 34 | * [Notable](https://notable.app/) 35 | * [Dropbox](https://www.dropbox.com/) 36 | * [Notion](https://www.notion.so/) 37 | * [Obsidian](https://obsidian.md/) 38 | * [Todoist](https://todoist.com/) 39 | 40 | ## Tweet us your tasty treats! 41 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 42 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 43 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 44 | * [Wes' Twitter](https://twitter.com/wesbos) 45 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 46 | * [Scott's Twitter](https://twitter.com/stolinski) 47 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/277 - stumpd.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 277 3 | title: Hasty Treat - Stump'd 4 | date: 1598274000463 5 | url: https://traffic.libsyn.com/syntax/Syntax277.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes are back with another edition of Stump'd! where they try to stump each other with interview questions. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 03:28 - What is the difference between HTML and React event handling? 16 | 17 | 05:55 - What are JavaScript data types? 18 | 19 | 07:00 - In which states can a Promise be? 20 | 21 | 07:48 - Discuss the differences between an HTML specification and a browser’s implementation thereof. 22 | 23 | 09:14 - What is a stateless component? 24 | 25 | 10:10 - What is a pure function? 26 | 27 | 10:51 - What is the output of the following code? 28 | 29 | ``` 30 | const a = [1, 2, 3] 31 | const b = [1, 2, 3] 32 | const c = "1,2,3" 33 | 34 | console.log(a == c) 35 | console.log(a == b) 36 | ``` 37 | 38 | 13:35 - What is memoization? 39 | 40 | 15:15 - How do you pass an argument to an event handler in React? 41 | 42 | 15:59 - What is HTML5 Web Storage? Explain localStorage and sessionStorage. 43 | 44 | ## Links 45 | * [30 Seconds of Interviews](https://30secondsofinterviews.org/) 46 | 47 | ## Tweet us your tasty treats! 48 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 49 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 50 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 51 | * [Wes' Twitter](https://twitter.com/wesbos) 52 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 53 | * [Scott's Twitter](https://twitter.com/stolinski) 54 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/283 - timeblock.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 283 3 | title: Hasty Treat - Time Block Planning 4 | date: 1600088400352 5 | url: https://traffic.libsyn.com/syntax/Syntax283.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about time block planning — what it is and how it can help you increase your productivity! 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 15 | 01:50 - What is time block planning 16 | 17 | 03:12 - How TBP has helped Scott stay focused 18 | 19 | 04:46 - How it helps family life 20 | 21 | 05:57 - How to plan your week 22 | 23 | 11:00 - How to deal with setbacks 24 | 25 | ## Links 26 | * [Cal Newport](https://www.calnewport.com/) 27 | * [Todoist](https://todoist.com/) 28 | * [Deep Work](https://www.amazon.com/Deep-Work-Focused-Success-Distracted/dp/1455586692) 29 | * [Deep Questions](https://www.calnewport.com/podcast/) 30 | 31 | ## Tweet us your tasty treats! 32 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 33 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 34 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 35 | * [Wes' Twitter](https://twitter.com/wesbos) 36 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 37 | * [Scott's Twitter](https://twitter.com/stolinski) 38 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/287 - records.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 287 3 | title: Hasty Treat - Records and Tuples in JavaScript 4 | date: 1601298000368 5 | url: https://traffic.libsyn.com/syntax/Syntax287.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about records and tuples in javascript — what they are, why you might want to use them, and more! 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 02:42 - Immutability 16 | 17 | 05:08 - Records 18 | * Immutable object 19 | * Syntax `#{x: 1, y: 2}` 20 | 21 | 05:56 - Tuples 22 | * Immutable array 23 | * Syntax `#[1,2,3,4]` 24 | 25 | 07:18 - For both 26 | * Referred to as a compound primitive 27 | * Can contain only primitives, not objects 28 | * They are compared deeply by their contents rather than their identity 29 | 30 | ```jsx 31 | assert(#{ a: 1 } === #{ a: 1 }); 32 | assert(#[1, 2] === #[1, 2]); 33 | assert(#{ a: 1, b: 2 } === #{ b: 2, a: 1 }); 34 | ``` 35 | 36 | * Potential for optimizations 37 | * Optimizations for making deep equality checks fast 38 | * Optimizations for manipulating data structures 39 | * Works well with type systems 40 | * Better integration with the debugger 41 | * Accessed through normal record.scott object like syntax 42 | 43 | 13:39 - Stage 2 44 | 45 | ## Links 46 | * [https://github.com/tc39/proposal-record-tuple](https://github.com/tc39/proposal-record-tuple) 47 | 48 | ## Tweet us your tasty treats! 49 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 50 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 51 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 52 | * [Wes' Twitter](https://twitter.com/wesbos) 53 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 54 | * [Scott's Twitter](https://twitter.com/stolinski) 55 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/293 - stretching.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 293 3 | title: Hasty Treat - Stretching For Developers with Scott 4 | date: 1603112400482 5 | url: https://traffic.libsyn.com/syntax/Syntax293.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about stretching for developers — techniques, misconceptions, and how to feel better. 9 | 10 | ## LogRocket - Sponsor 11 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 12 | 13 | ## Show Notes 14 | 15 | 03:21 - Devs do the following 16 | * Head forward looking at screen 17 | * Shoulders forward 18 | * Sitting a lot 19 | * Weak core 20 | * Carpel tunnel from typing 21 | 22 | 06:02 - Stretching misconceptions 23 | * Static holds 24 | * Dynamic controlled movements first and foremost 25 | 26 | 07:52 - Stretches to help 27 | * Dynamic twists 28 | * Cat / Cow 29 | * Flat down / Curl up spine 30 | * Arm hang to decompress spine 31 | * Wrist stretches and strengthening for carpel tunnel 32 | * Horse stance at standing desk to be office weird person 33 | * Shoulder circles 34 | * Doorway stretches 35 | 36 | ## Tweet us your tasty treats! 37 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 38 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 39 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 40 | * [Wes' Twitter](https://twitter.com/wesbos) 41 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 42 | * [Scott's Twitter](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/305 - commits.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 305 3 | title: Hasty Treat - Writing Good Commit Messages 4 | date: 1606744800101 5 | url: https://traffic.libsyn.com/syntax/Syntax305.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about a system for writing good commit messages. 9 | 10 | ## Sentry - Sponsor 11 | If you want to know what's happening with your errors, track them with [Sentry](https://sentry.io/). Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting [Sentry.io](https://sentry.io/) and using the coupon code "tastytreat". 12 | 13 | ## Show Notes 14 | 03:46 - What are conventional commits? 15 | * [https://www.conventionalcommits.org/en/v1.0.0/](https://www.conventionalcommits.org/en/v1.0.0/) 16 | 17 | 04:55 - How do you keep track of all the details? 18 | * [https://commitizen-tools.github.io/commitizen/](https://commitizen-tools.github.io/commitizen/) 19 | * [https://github.com/commitizen/cz-cli](https://github.com/commitizen/cz-cli) 20 | * [https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits](https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits) 21 | 22 | 07:42 - How does it relate to SemVer? 23 | 24 | ## Links 25 | * [https://github.com/conventional-changelog/conventional-changelog](https://github.com/conventional-changelog/conventional-changelog) 26 | * [https://github.com/netflix/unleash](https://github.com/netflix/unleash) 27 | * [Deno](https://deno.land/) 28 | 29 | ## Tweet us your tasty treats! 30 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 31 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 32 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 33 | * [Wes' Twitter](https://twitter.com/wesbos) 34 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 35 | * [Scott's Twitter](https://twitter.com/stolinski) 36 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/417 - Holiday Snackluk.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 417 3 | title: Holiday Snackluk 4 | date: 1640613600125 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_417.mp3 6 | --- 7 | 8 | In this Hasty Treat, Wes and Scott talk about Package-lock, Angular, package updates, how to learn, and media servers on planes. 9 | 10 | ## Sponsor - Sanity 11 | 12 | Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at [sanity.io/create](https://www.sanity.io/create). Get an awesome supercharged free developer plan on [sanity.io/syntax](https://www.sanity.io/syntax). 13 | 14 | ## Sponsor - LogRocket 15 | 16 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 17 | 18 | ## Show Notes 19 | 20 | * **[00:54](#t=00:54)** Luks of the past 21 | * **[03:19](#t=03:19)** Sponsor: Sanity 22 | * **[04:26](#t=04:26)** Sponsor: LogRocket 23 | * **[05:04](#t=05:04)** Has package-lock.json ever saved your bacon? 24 | * **[08:27](#t=08:27)** Why do you not talk about Angular? 25 | * **[11:28](#t=11:28)** How do you handle package updates? 26 | * [Wes Bos tweet on npm-update](https://twitter.com/wesbos/status/1396842158452248581) 27 | * **[17:43](#t=17:43)** How do you keep learning in your career? 28 | * **[21:02](#t=21:02)** How does the movie selection work on planes? 29 | * [Emby](https://emby.media) 30 | 31 | ## Tweet us your tasty treats 32 | 33 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 34 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 35 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 36 | * [Wes' Twitter](https://twitter.com/wesbos) 37 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 38 | * [Scott's Twitter](https://twitter.com/stolinski) 39 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 40 | -------------------------------------------------------------------------------- /src/shows/425 - Updating Project Dependencies.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 425 3 | title: Updating Project Dependencies 4 | date: 1643025600796 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_425.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about their process for updating project dependencies. 9 | 10 | ## Sponsor - LogRocket 11 | 12 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Sponsor - MagicBell 15 | 16 | [MagicBell](https://www.magicbell.com) is the the notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months. 17 | 18 | ## Show Notes 19 | 20 | * **[00:25](#t=00:25)** Weeeeelcome 21 | * **[00:52](#t=00:52)** Sponsor: LogRocket 22 | * **[01:29](#t=01:29)** Sponsor: Magic Bell 23 | * **[03:32](#t=03:32)** What are dependencies? 24 | * **[04:04](#t=04:04)** Wes updates all the things 25 | * **[05:30](#t=05:30)** How to check if there are any updates 26 | * **[07:05](#t=07:05)** Upgrade isolated, Minor deps first. 27 | * **[09:16](#t=09:16)** Upgrade Minor groups after that 28 | * **[09:56](#t=09:56)** Then upgrade Major dependencies 29 | * **[14:47](#t=14:47)** Finally upgrade any stand along dependencies 30 | * **[15:44](#t=15:44)** Test test test 31 | * **[16:19](#t=16:19)** Watch error logging 32 | * **[17:05](#t=17:05)** Pray 33 | 34 | ## Tweet us your tasty treats 35 | 36 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 37 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 38 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 39 | * [Wes' Twitter](https://twitter.com/wesbos) 40 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 41 | * [Scott's Twitter](https://twitter.com/stolinski) 42 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 43 | -------------------------------------------------------------------------------- /src/shows/431 - Code Explorers.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 431 3 | title: Code Explorers 4 | date: 1644840000749 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_431.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about how best to explore and contribute to code on GitHub repos. 9 | 10 | ## Retool - Sponsor 11 | 12 | Retool is the fast way to build internal tools. Visually design apps that interface with any database or API. Switch to code nearly anywhere to customize how your apps look and work. With Retool, you ship more apps and move your business forward—all in less time. 13 | 14 | Visit [retool.com/syntax](https://retool.com/syntax). 15 | 16 | ## LogRocket - Sponsor 17 | 18 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 19 | 20 | ## Show Notes 21 | 22 | * **[00:25](#t=00:25)** Welcome 23 | * **[01:42](#t=01:42)** Sponsor: LogRocket 24 | * **[02:54](#t=02:54)** Sponsor: Retool 25 | * **[04:33](#t=04:33)** Topic introduction 26 | * **[06:44](#t=06:44)** How to get a handle on something new in a library? 27 | * **[10:27](#t=10:27)** How to contribute to comments 28 | * **[12:55](#t=12:55)** Looking through Issues 29 | * **[15:01](#t=15:01)** Looking at Pull Requests 30 | * **[15:43](#t=15:43)** Check Milestones 31 | * **[17:58](#t=17:58)** Look at Files Changed tab 32 | 33 | ## Tweet us your tasty treats 34 | 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 42 | -------------------------------------------------------------------------------- /src/shows/439 - SSR vs JamStack vs Serverless.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 439 3 | title: Hasty Treat WTF × SSR vs JamStack vs Serverless? 4 | date: 1647259200645 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_439.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about the differences between SSR, JamStack, and Serverless. 9 | 10 | ## LogRocket - Sponsor 11 | 12 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 13 | 14 | ## Retool - Sponsor 15 | 16 | Retool is the fast way to build internal tools. Visually design apps that interface with any database or API. Switch to code nearly anywhere to customize how your apps look and work. With Retool, you ship more apps and move your business forward—all in less time. 17 | 18 | Visit [Retool.com/syntax](http://retool.com/syntax) for more information. 19 | 20 | ## Show Notes 21 | 22 | * **[00:21](#t=00:21)** Welcome 23 | * **[01:20](#t=01:20)** Sponsor: LogRocket 24 | * **[02:26](#t=02:26)** Sponsor: Retool 25 | * **[03:49](#t=03:49)** What exactly is server side rendering vs. tech like Jamstack and serverless? 26 | * [Cloudinary](https://cloudinary.com) 27 | * [Mux](https://www.mux.com) 28 | * **[12:15](#t=12:15)** Why use one or the other? 29 | * [Svelte Kit](https://kit.svelte.dev) 30 | * [Syntax.fm](https://syntax.fm) 31 | * **[16:55](#t=16:55)** Where does Serverless fit into this? 32 | * **[19:12](#t=19:12)** What's the ideal scenario? 33 | 34 | ## Tweet us your tasty treats 35 | 36 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 37 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 38 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 39 | * [Wes' Twitter](https://twitter.com/wesbos) 40 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 41 | * [Scott's Twitter](https://twitter.com/stolinski) 42 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 43 | -------------------------------------------------------------------------------- /src/shows/443 - Vitest.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 443 3 | title: What’s Up With Vitest? 4 | date: 1648468800183 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_443.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Vitest, how testing is handled, how code coverage works, and whether they think they'll use it. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting [Sentry.io](https://sentry.io) and using the coupon code TASTYTREAT during sign up. 13 | 14 | ## MagicBell - Sponsor 15 | 16 | MagicBell is the The notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months. 17 | 18 | ## Show Notes 19 | 20 | * **[00:21](#t=00:21)** Welcome 21 | * **[02:47](#t=02:47)** Sponsor: Sentry 22 | * **[03:48](#t=03:48)** Sponsor: MagicBell 23 | * **[04:55](#t=04:55)** What’s is Vitest? 24 | * **[09:06](#t=09:06)** How is testing handled? 25 | * **[10:59](#t=10:59)** HappyDOM 26 | * **[14:13](#t=14:13)** Code coverage baked in 27 | * **[16:25](#t=16:25)** Files acting as folders 28 | 29 | ## Tweet us your tasty treats 30 | 31 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 32 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 33 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 34 | * [Wes' Twitter](https://twitter.com/wesbos) 35 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 36 | * [Scott's Twitter](https://twitter.com/stolinski) 37 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 38 | -------------------------------------------------------------------------------- /src/shows/449 - 3D in the browser.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 449 3 | title: Svelte Cubed + 3D In Browser 4 | date: 1650283200876 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_449.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Svelte Cubed and working in 3D in the browser. 9 | 10 | ## Prismic - Sponsor 11 | 12 | Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at [prismic.io/syntax](https://prismic.io/syntax). 13 | 14 | ## LogRocket - Sponsor 15 | 16 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 17 | 18 | ## Show Notes 19 | 20 | * **[00:21](#t=00:21)** Welcome 21 | * **[01:00](#t=01:00)** Sponsor: LogRocket 22 | * **[01:41](#t=01:41)** Sponsor: Prismic 23 | * **[02:45](#t=02:45)** Intro to 3D in the browser 24 | * [Svelte Cubed](https://svelte-cubed.vercel.app) 25 | * [Getting started with Svelte Cubed](https://svelte-cubed.vercel.app/docs/getting-started) 26 | * **[03:49](#t=03:49)** Declarative vs imperative 27 | * **[07:43](#t=07:43)** How does Three.JS work? 28 | * [ThreeJS](https://threejs.org) 29 | * **[12:28](#t=12:28)** Orbit controls 30 | * **[15:47](#t=15:47)** Svelte Cannon 31 | * [Svelte Cannon](https://svelte-cannon.bfanger.nl) 32 | * [Blender](https://www.blender.org) 33 | 34 | ## Tweet us your tasty treats 35 | 36 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 37 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 38 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 39 | * [Wes' Twitter](https://twitter.com/wesbos) 40 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 41 | * [Scott's Twitter](https://twitter.com/stolinski) 42 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 43 | -------------------------------------------------------------------------------- /src/shows/451 - Coupon engine.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 451 3 | title: Building a Coupon Engine 4 | date: 1650888000372 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_451.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about the coupon engines they've built and use on their courses. 9 | 10 | ## Prismic - Sponsor 11 | 12 | Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at [prismic.io/syntax](https://prismic.io/syntax). 13 | 14 | ## LogRocket - Sponsor 15 | 16 | LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at [logrocket.com/syntax](https://logrocket.com/syntax). 17 | 18 | ## Show Notes 19 | 20 | * **[00:26](#t=00:26)** Welcome 21 | * **[01:12](#t=01:12)** Sponsor: Prismic 22 | * **[02:32](#t=02:32)** Sponsor: LogRocket 23 | * **[04:06](#t=04:06)** What we use for coupons 24 | * [Stripe](https://stripe.com) 25 | * [Braintree](https://www.braintreepayments.com/) 26 | * **[06:27](#t=06:27)** Structure of our coupons 27 | * **[10:43](#t=10:43)** Products and carts 28 | * **[13:59](#t=13:59)** Country validation 29 | * **[15:11](#t=15:11)** Affiliate codes 30 | * **[16:36](#t=16:36)** Chaining rules together 31 | * **[19:41](#t=19:41)** Tracking coupons 32 | * **[20:54](#t=20:54)** Automatically applied coupons 33 | * **[22:12](#t=22:12)** Quick tips for coupons 34 | 35 | ## Tweet us your tasty treats 36 | 37 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 38 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 39 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 40 | * [Wes' Twitter](https://twitter.com/wesbos) 41 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 42 | * [Scott's Twitter](https://twitter.com/stolinski) 43 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 44 | -------------------------------------------------------------------------------- /src/shows/521 - hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 521 3 | title: Syntactic Sugar, Declarative and First Class Citizens? What does that even mean? 4 | date: 1665403200711 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_521.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes explain what the jargon you hear in JavaScript means. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting [Sentry.io](https://sentry.io) and using the coupon code TASTYTREAT during sign up. 13 | 14 | ## Freshbooks - Sponsor 15 | 16 | Get a 30 day free trial of Freshbooks at [freshbooks.com/syntax](https://freshbooks.com/syntax) 17 | 18 | ## Show Notes 19 | 20 | * **[00:25](#t=00:25)** Welcome 21 | * **[01:06](#t=01:06)** Sponsor: Sentry 22 | * **[01:59](#t=01:59)** Sponsor: Freshbooks 23 | * **[02:27](#t=02:27)** What does that even mean? 24 | * **[02:55](#t=02:55)** Everything in JavaScript is an Object! 25 | * **[04:43](#t=04:43)** X is just Syntactic Sugar 26 | * **[09:00](#t=09:00)** Functions are first class citizens 27 | * **[10:04](#t=10:04)** Object Literals or Template Literals 28 | * **[11:12](#t=11:12)** Declarative vs Imperative 29 | 30 | ## Tweet us your tasty treats 31 | 32 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 33 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 34 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 35 | * [Wes' Twitter](https://twitter.com/wesbos) 36 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 37 | * [Scott's Twitter](https://twitter.com/stolinski) 38 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 39 | 40 | -------------------------------------------------------------------------------- /src/shows/524 - Hasty Bookmarklets.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 524 3 | title: Bookmarklets 4 | date: 1666008000227 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_524.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes take Matt Busche's suggestion and talk all about bookmarklets and scripts to modify or manipulate web pages. 9 | 10 | ## MagicBell - Sponsor 11 | 12 | [MagicBell](https://www.magicbell.com) is the the notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months. 13 | 14 | ## Show Notes 15 | 16 | * **[00:25](#t=00:25)** Welcome 17 | * **[02:02](#t=02:02)** What are bookmarklets? 18 | * [Matt Busche's fav bookmarklets Gist](https://gist.github.com/mrbusche/d197281d654b371a1fadfd9f4888358a) 19 | * [Bookmarklet Maker](https://caiorss.github.io/bookmarklet-maker/) 20 | * [CSS Tricks - Web Development Bookmarklets](https://css-tricks.com/web-development-bookmarklets/) 21 | * **[04:49](#t=04:49)** Using an Immediately invoked function expression 22 | * **[09:22](#t=09:22)** Greasemonkey 23 | * [Greasemonkey](https://www.greasespot.net) 24 | 25 | ## Tweet us your tasty treats 26 | 27 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 28 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 29 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 30 | * [Wes' Twitter](https://twitter.com/wesbos) 31 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 32 | * [Scott's Twitter](https://twitter.com/stolinski) 33 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 34 | -------------------------------------------------------------------------------- /src/shows/530 - Hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 530 3 | title: Explained - Buzz Words and Concepts 4 | date: 1667217600415 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_530.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes explain more buzz words like schema, promises, async, sync, dom vs shadow dom vs page HTML, props, and more. 9 | 10 | ## Appwrite - Sponsor 11 | 12 | Appwrite is a self-hosted backend-as-a-service platform that provides developers with all the core APIs required to build any application. Get free cloud credits by signing up for early access to the [Appwrite Cloud launch](https://appwrite.io/cloud). 13 | 14 | ## Sanity - Sponsor 15 | 16 | Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at [sanity.io/create](https://www.sanity.io/create). Get an awesome supercharged free developer plan on [sanity.io/syntax](https://www.sanity.io/syntax). 17 | 18 | ## Show Notes 19 | 20 | * **[00:21](#t=00:21)** Welcome 21 | * **[01:17](#t=01:17)** Sponsor: Appwrite 22 | * **[03:16](#t=03:16)** Sponsor: Sanity 23 | * **[04:08](#t=04:08)** Schema 24 | * [Zod](https://zod.dev) 25 | * [Apollo GraphQL](https://www.apollographql.com) 26 | * **[07:25](#t=07:25)** Promises 27 | * **[08:47](#t=08:47)** Async, Sync, Parallel and Concurrent 28 | * **[13:15](#t=13:15)** Dom vs Shadow Dom VS Page HTML 29 | * **[16:21](#t=16:21)** Methods vs Functions 30 | * **[18:18](#t=18:18)** Props 31 | * **[20:27](#t=20:27)** HTTP Requests are Stateless 32 | 33 | ## Tweet us your tasty treats 34 | 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 42 | -------------------------------------------------------------------------------- /src/shows/553 - Supper.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 553 3 | title: Supper Club × Switching into Coding and climbing the Pommade ladder with Kenneth Lyerly 4 | date: 1671796800550 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_553.mp3 6 | guest: 7 | name: Kenneth Lyerly 8 | github: kenput3r 9 | twitter: kenput3r 10 | url: https://ken.dev 11 | --- 12 | 13 | In this supper club episode of Syntax, Wes and Scott talk with Kenneth Lyerly about his career path into coding, and how he manages to hold two jobs. 14 | 15 | ## Show Notes 16 | 17 | * **[00:38](#t=00:38)** Welcome 18 | * [Ken.dev](https://ken.dev) 19 | * [Ken on Github](https://github.com/kenput3r) 20 | * **[01:59](#t=01:59)** How do you have two jobs? 21 | * **[09:46](#t=09:46)** When did you start a second job? 22 | * **[16:02](#t=16:02)** Any tips for someone wanting to switch into coding? 23 | * **[24:03](#t=24:03)** Do you have advice for people trying to market themselves? 24 | * **[31:38](#t=31:38)** What is working these days for marketing efforts? 25 | * **[34:47](#t=34:47)** Where can devs learn about marketing? 26 | * **[35:50](#t=35:50)** Barbershop culture 27 | * **[39:47](#t=39:47)** Supper club questions 28 | * [Snazzy Labs custom Touch ID button](https://www.youtube.com/watch?v=hz9Ek6fxX48) 29 | * [Tech Meme Ride Home podcast](https://news.techmeme.com/180306/podcast) 30 | * **[44:10](#t=44:10)** SIIIIICK ××× PIIIICKS ××× 31 | 32 | ## ××× SIIIIICK ××× PIIIICKS ××× 33 | 34 | * [Traeger Grills](https://www.traeger.com) 35 | 36 | ## Shameless Plugs 37 | 38 | * [Suavecito](http://www.suavecito.com) 39 | * [ResortPass](https://www.resortpass.com) 40 | 41 | ## Tweet us your tasty treats 42 | 43 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 44 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 45 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 46 | * [Wes' Twitter](https://twitter.com/wesbos) 47 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 48 | * [Scott's Twitter](https://twitter.com/stolinski) 49 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 50 | -------------------------------------------------------------------------------- /src/shows/556 - Supper Kilian Valkhof.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 556 3 | title: Supper Club × Polypane with Kilian Valkhof 4 | date: 1672401600689 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_556.mp3 6 | guest: 7 | name: Kilian Valkhof 8 | github: Kilian 9 | twitter: kilianvalkhof 10 | url: https://kilianvalkhof.com 11 | social: https://mastodon.social/@Kilian 12 | --- 13 | 14 | In this supper club episode of Syntax, Wes and Scott talk with Kilian Valkhof about his work on Polypane, a browser for developers. How is Polypane built? Why does he have a focus on accessibility in Polypane? 15 | 16 | ## Show Notes 17 | 18 | * **[00:39](#t=00:39)** Welcome 19 | * **[01:48](#t=01:48)** Who is Kilian Valkhof? 20 | * [kilianvalkhof.com](https://kilianvalkhof.com) 21 | * [@kilianvalkhof on Twitter](https://twitter.com/kilianvalkhof) 22 | * **[04:50](#t=04:50)** What is Polypane? 23 | * [Polypane](https://polypane.app/) 24 | * [@Polypane on Twitter](https://twitter.com/Polypane) 25 | * [FromScratch](https://fromscratch.rocks) 26 | * **[09:31](#t=09:31)** How is Polypane built? 27 | * **[14:18](#t=14:18)** What about the Dev tools tab? 28 | * **[20:15](#t=20:15)** Outline tab 29 | * **[23:23](#t=23:23)** Color picker 30 | * **[27:33](#t=27:33)** Canvas rules and guides 31 | * **[32:16](#t=32:16)** Accessibility background and tools 32 | * **[40:28](#t=40:28)** How do you parse the CSS? 33 | * **[42:51](#t=42:51)** What else do you want people to know about Polypane? 34 | * **[44:42](#t=44:42)** Supper Club questions 35 | * **[53:59](#t=53:59)** SIIIIICK ××× PIIIICKS ××× 36 | 37 | ## Shameless Plugs 38 | 39 | * [Fix Contrast](https://fixa11y.com) 40 | * [Superposition](https://superposition.design) 41 | 42 | ## Tweet us your tasty treats 43 | 44 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 45 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 46 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 47 | * [Wes' Twitter](https://twitter.com/wesbos) 48 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 49 | * [Scott's Twitter](https://twitter.com/stolinski) 50 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 51 | -------------------------------------------------------------------------------- /src/shows/557 - Tasty TypeScript.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 557 3 | title: TypeScript Fundamentals × Type Narrowing, Guards, and Predicates 4 | date: 1672660800521 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_557.mp3 6 | --- 7 | 8 | In this episode of Syntax, Wes and Scott talk through some TypeScript Fundamentals around type narrowing, type guards, and type predicates. 9 | 10 | ## Show Notes 11 | 12 | * **[00:24](#t=00:24)** Welcome 13 | * **[01:40](#t=01:40)** Rocking predicates 14 | * **[02:54](#t=02:54)** What is a type in TypeScript? 15 | * **[04:11](#t=04:11)** Type Narrowing 16 | * **[08:18](#t=08:18)** Type Guard 17 | * **[16:19](#t=16:19)** Type Predicates 18 | 19 | ## Shameless Plugs 20 | 21 | * Scott: [LevelUp Tutorials](https://levelup.video) 22 | * Wes: [Wes Bos Tutorials](https://wesbos.com/courses) 23 | 24 | ## Tweet us your tasty treats 25 | 26 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 27 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 28 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 29 | * [Wes' Twitter](https://twitter.com/wesbos) 30 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 31 | * [Scott's Twitter](https://twitter.com/stolinski) 32 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 33 | -------------------------------------------------------------------------------- /src/shows/560 - Hasty errors.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 560 3 | title: TypeScript Fundamentals × Satisfies and as const 4 | date: 1673265600317 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_560.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Satisfies and as const. 9 | 10 | ## Show Notes 11 | 12 | * **[00:25](#t=00:25)** Welcome 13 | * **[02:04](#t=02:04)** Xmas recap 14 | * [Peloton](https://www.onepeloton.com) 15 | * **[04:09](#t=04:09)** Satisfies and as const 16 | * **[06:16](#t=06:16)** What is const? 17 | * **[10:30](#t=10:30)** Helping with currency 18 | * **[12:44](#t=12:44)** Bos monster server update 19 | * **[14:13](#t=14:13)** Satisfies 20 | 21 | ``` 22 | export const currencies = { 23 | USD: 'US Dollars', 24 | CAD: 'Canadian Dollar', 25 | EUR: 'Euro', 26 | } as const; 27 | 28 | export type Currency = typeof currencies; 29 | export type CurrencyCode = keyof Currency; 30 | ``` 31 | 32 | ## Tweet us your tasty treats 33 | 34 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 35 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 36 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 37 | * [Wes' Twitter](https://twitter.com/wesbos) 38 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 39 | * [Scott's Twitter](https://twitter.com/stolinski) 40 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 41 | -------------------------------------------------------------------------------- /src/shows/566 - Hasty Container Queries.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 566 3 | title: Container Queries Explained 4 | date: 1674475200605 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_566.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes explain what container queries are, use cases for them, new units of measurement, and possible issues with container queries. 9 | 10 | ## Show Notes 11 | 12 | * **[00:28](#t=00:28)** Welcome 13 | * **[01:46](#t=01:46)** What are Container Queries? 14 | * [Tweet about Container Queries](https://twitter.com/wesbos/status/1614016671043276815?s=61&t=sSa4pPY_-9xMO1VD41z0oA) 15 | * **[03:28](#t=03:28)** Use cases for Container Queries 16 | * [Home Assistant](https://www.home-assistant.io) 17 | * [Can I Use?](https://caniuse.com) 18 | * **[06:11](#t=06:11)** The syntax of container queries 19 | * **[13:42](#t=13:42)** New units 20 | * **[22:27](#t=22:27)** Old iOS versions may cause issues 21 | 22 | ## Tweet us your tasty treats 23 | 24 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 25 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 26 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 27 | * [Wes' Twitter](https://twitter.com/wesbos) 28 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 29 | * [Scott's Twitter](https://twitter.com/stolinski) 30 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 31 | -------------------------------------------------------------------------------- /src/shows/567 - Tasty State of js.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 567 3 | title: We React to State of JS 2022 4 | date: 1674648000984 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_567.mp3 6 | --- 7 | 8 | In this episode of Syntax, Wes and Scott look through the results of the State of JS survey for 2022. 9 | 10 | ## Show Notes 11 | 12 | * [State of JS 2022](https://2022.stateofjs.com/) 13 | 14 | * **[00:26](#t=00:26)** Welcome 15 | * **[01:24](#t=01:24)** Thoughts on the survey in general 16 | * **[04:24](#t=04:24)** Country of origin 17 | * **[05:53](#t=05:53)** Salaries 18 | * **[08:14](#t=08:14)** Higher education 19 | * **[08:58](#t=08:58)** JavaScript features 20 | * **[15:41](#t=15:41)** Browser APIs 21 | * **[21:15](#t=21:15)** Library Usage 22 | * **[26:11](#t=26:11)** Interest in frontend frameworks 23 | * **[28:40](#t=28:40)** Framework usage 24 | * **[31:41](#t=31:41)** Rendering frameworks 25 | * **[34:57](#t=34:57)** Build tools usage over time 26 | * **[39:37](#t=39:37)** Monorepo tools 27 | * [Moon](https://moonrepo.dev) 28 | * **[46:41](#t=46:41)** Backend frameworks 29 | * [Civet](https://civet.dev) 30 | * **[47:42](#t=47:42)** JavaScript run times 31 | * **[51:01](#t=51:01)** TypeScript JavaScript balance 32 | * **[52:17](#t=52:17)** JavaScript flavors 33 | * **[57:03](#t=57:03)** Resources 34 | * [Fireship Dev](http://youtube.com/c/Fireship) 35 | 36 | ## Shameless Plugs 37 | 38 | * Scott: [LevelUp Tutorials](https://levelup.video) 39 | * Wes: [Wes Bos Tutorials](https://wesbos.com/courses) 40 | 41 | ## Tweet us your tasty treats 42 | 43 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 44 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 45 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 46 | * [Wes' Twitter](https://twitter.com/wesbos) 47 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 48 | * [Scott's Twitter](https://twitter.com/stolinski) 49 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/569 - Hasty CSS Wishlist.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 569 3 | title: CSS Wishlist 4 | date: 1675080000474 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_569.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk through their wishlist for CSS in 2023 including mixins, range selectors, fit text, robust color functions, overflown, and more. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * **[01:09](#t=01:09)** Snow skate update 14 | * **[03:01](#t=03:01)** Mixins 15 | * **[05:06](#t=05:06)** Range selector 16 | * **[09:36](#t=09:36)** :first-of-column :last-of:column / row 17 | * [Ability to target items in nth-row of autofilled, implicit grid](https://github.com/w3c/csswg-drafts/issues/1943) 18 | * **[11:43](#t=11:43)** Fit Text 19 | * **[13:34](#t=13:34)** Overflow-x, overflow-y control 20 | * **[15:36](#t=15:36)** Full support for CSS with Inline Styles 21 | * **[16:24](#t=16:24)** nth-of-found() 22 | * **[18:18](#t=18:18)** Robust Color functions 23 | * **[22:19](#t=22:19)** resize: both but no overflow or scroll 24 | * **[23:39](#t=23:39)** Animate height auto 25 | * **[23:57](#t=23:57)** Full attr() support 26 | * **[25:07](#t=25:07)** CSS References 27 | * [CSS References](https://gist.github.com/threepointone/61e990b450712cfd7dd0bb87ed0c2982) 28 | * **[26:59](#t=26:59)** overflown + :stuck 29 | * **[28:56](#t=28:56)** Multi-line selectors 30 | * **[30:35](#t=30:35)** Container Queries - select the container itself 31 | * **[32:04](#t=32:04)** :is-scrolled - select a container when it’s scrolled 32 | 33 | ## Tweet us your tasty treats 34 | 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 42 | -------------------------------------------------------------------------------- /src/shows/572 - Hasty Polish and perf.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 572 3 | title: Polish and Perf 4 | date: 1675684800291 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_572.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk through quick tips to improve performance of your website, and the tools available to help diagnose and fix perf issues. 9 | 10 | ## Show Notes 11 | 12 | * **[00:25](#t=00:25)** Welcome 13 | * **[00:50](#t=00:50)** Polish And Perf explained 14 | * **[02:05](#t=02:05)** What kinds of tools are available to improve performance 15 | * [Lighthouse in Chrome](https://developer.chrome.com/docs/lighthouse/overview/) 16 | * [PageSpeed](https://pagespeed.web.dev) 17 | * **[09:32](#t=09:32)** Identify route caching and http caching 18 | * **[14:25](#t=14:25)** Partytown 19 | * [Partytown](https://partytown.builder.io) 20 | * **[15:19](#t=15:19)** Unnecessary network calls 21 | 22 | ## Tweet us your tasty treats 23 | 24 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 25 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 26 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 27 | * [Wes' Twitter](https://twitter.com/wesbos) 28 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 29 | * [Scott's Twitter](https://twitter.com/stolinski) 30 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 31 | -------------------------------------------------------------------------------- /src/shows/575 - Hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 575 3 | title: Save us from Config File Hell 4 | date: 1676289600407 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_575.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about what you can do to better organize your config files. 9 | 10 | ## Show Notes 11 | 12 | * **[00:21](#t=00:21)** Welcome 13 | * **[02:20](#t=02:20)** Electric car ski tripping 14 | * **[05:01](#t=05:01)** Why config files? 15 | * **[07:47](#t=07:47)** Custom Vite config files 16 | * [Wes' Vite config](https://github.com/wesbos/hot-tips/blob/main/vite.config.ts) 17 | 18 | ``` 19 | define: { 20 | __VERSION__: JSON.stringify(process.env.npm_package_version), 21 | }, 22 | ``` 23 | 24 | * **[11:16](#t=11:16)** Node has failed us 25 | * **[13:30](#t=13:30)** Cosmic config 26 | * [Cosmiconfig](https://github.com/davidtheclark/cosmiconfig) 27 | * **[16:46](#t=16:46)** File nesting 28 | * **[21:01](#t=21:01)** Standardize on a format 29 | 30 | ## Tweet us your tasty treats 31 | 32 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 33 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 34 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 35 | * [Wes' Twitter](https://twitter.com/wesbos) 36 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 37 | * [Scott's Twitter](https://twitter.com/stolinski) 38 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 39 | -------------------------------------------------------------------------------- /src/shows/578 - Hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 578 3 | title: Logging 4 | date: 1676894400302 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_578.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about the reasons why you should log errors, how it's not just for debugging, where to save logs, and apps and packages to help with logging. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting [Sentry.io](https://sentry.io) and using the coupon code TASTYTREAT during sign up. 13 | 14 | ## Show Notes 15 | 16 | * **[00:25](#t=00:25)** Welcome 17 | * **[01:37](#t=01:37)** Sponsor: Sentry 18 | * **[02:16](#t=02:16)** What is logging? Why log? 19 | * **[04:59](#t=04:59)** Logging isn't just for debugging 20 | * **[08:22](#t=08:22)** What do we log? 21 | * **[13:34](#t=13:34)** What not to log 22 | * **[14:58](#t=14:58)** Development, staging, and production 23 | * **[17:36](#t=17:36)** Logging bots 24 | * **[19:33](#t=19:33)** Where to put logs 25 | * **[20:59](#t=20:59)** How to log 26 | * [Log Tail](https://betterstack.com/logtail) 27 | * [Paper Trail](https://www.papertrail.com/) 28 | * [Sematext Logs](https://sematext.com/docs/logs/) 29 | * [DataDog](https://www.datadoghq.com/lpg/) 30 | * [Winston](https://www.npmjs.com/package/winston) 31 | * [Pino](https://getpino.io/) 32 | 33 | ## Tweet us your tasty treats 34 | 35 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 36 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 37 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 38 | * [Wes' Twitter](https://twitter.com/wesbos) 39 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 40 | * [Scott's Twitter](https://twitter.com/stolinski) 41 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 42 | -------------------------------------------------------------------------------- /src/shows/581 - Hasty clean code.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 581 3 | title: Clean vs Sloppy Code 4 | date: 1677499200598 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_581.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about the difference between sloppy code and clean code, how to establish rules for your code base, and how to enforce your rules. 9 | 10 | ## Sentry - Sponsor 11 | 12 | If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting [Sentry.io](https://sentry.io) and using the coupon code TASTYTREAT during sign up. 13 | 14 | ## Show Notes 15 | 16 | * **[00:24](#t=00:24)** Welcome 17 | * **[00:46](#t=00:46)** Sponsor: Sentry 18 | * **[01:51](#t=01:51)** Uses performance issues 19 | * [Uses.tech](https://uses.tech) 20 | * **[04:23](#t=04:23)** Understand Sloppy Code 21 | * **[10:17](#t=10:17)** Syntax website timestamp issue 22 | * **[12:56](#t=12:56)** Establish rules to fix sloppy code 23 | * **[16:35](#t=16:35)** Adding a feature, do you refactor an unrelated function? 24 | * **[23:07](#t=23:07)** How do you enforce rules? 25 | * [GitHub Actions](https://docs.github.com/en/actions) 26 | 27 | ## Tweet us your tasty treats 28 | 29 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 30 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 31 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 32 | * [Wes' Twitter](https://twitter.com/wesbos) 33 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 34 | * [Scott's Twitter](https://twitter.com/stolinski) 35 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets -------------------------------------------------------------------------------- /src/shows/596 - Hasty Import maps.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 596 3 | title: The New Import Map Standard 4 | date: 1680523200794 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_596.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about the fact that import maps are in Safari Technical preview, and what that means for web developers. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * **[02:16](#t=02:16)** Import maps just dropped 14 | * **[04:09](#t=04:09)** Which browsers support it? 15 | * **[06:01](#t=06:01)** What is a map? 16 | * **[06:40](#t=06:40)** How does the syntax work? 17 | * **[09:35](#t=09:35)** What about dependency resolution? 18 | * **[10:25](#t=10:25)** What about bundlers? 19 | * **[13:17](#t=13:17)** How does this work with Deno? 20 | * [Deno — A modern runtime for JavaScript and TypeScript](https://deno.land/) 21 | * [Import Maps | Manual | Deno](https://deno.land/manual@v1.31.0/basics/import_maps) 22 | * [whatwg/fs · Issue #5 · wintercg/proposal-common-minimum-api](https://github.com/wintercg/proposal-common-minimum-api/issues/5#issuecomment-1470026193) 23 | * **[20:12](#t=20:12)** What about with node? 24 | * [Support import maps and bare import specifiers · Issue #43326 · microsoft/TypeScript](https://github.com/microsoft/TypeScript/issues/43326) 25 | * [Policies | Node.js v17.9.1 Documentation](https://nodejs.org/dist/latest-v17.x/docs/api/policy.html#example-import-maps-emulation) 26 | * **[21:22](#t=21:22)** What about Typescript? 27 | * **[22:43](#t=22:43)** Downsides to import maps 28 | 29 | ## Tweet us your tasty treats 30 | 31 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 32 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 33 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 34 | * [Wes' Twitter](https://twitter.com/wesbos) 35 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 36 | * [Scott's Twitter](https://twitter.com/stolinski) 37 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 38 | -------------------------------------------------------------------------------- /src/shows/599 - Hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 599 3 | title: oAuth APIs Explained 4 | date: 1681128000216 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_599.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk all things oAuth - what is oAuth? What terms do you need to understand when working with oAuth? And tips for working with oAuth. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * [Office Space](https://en.wikipedia.org/wiki/Office_Space) 14 | * [HTTPS + Tunnel Your Localhost - Cloudflare Tunnels, Ngrok, and more! — Syntax Podcast 590](https://syntax.fm/show/590/https-tunnel-your-localhost-cloudflare-tunnels-ngrok-and-more) 15 | * **[01:56](#t=01:56)** What is oAuth? 16 | * **[05:30](#t=05:30)** Terminology in oAuth 17 | * **[07:52](#t=07:52)** Once you have a client ID 18 | * **[09:41](#t=09:41)** The callback URL 19 | * **[12:11](#t=12:11)** The refresh token 20 | * **[14:09](#t=14:09)** How a token could be stolen 21 | * **[17:43](#t=17:43)** State token 22 | 23 | ## Tweet us your tasty treats 24 | 25 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 26 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 27 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 28 | * [Wes' Twitter](https://twitter.com/wesbos) 29 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 30 | * [Scott's Twitter](https://twitter.com/stolinski) 31 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 32 | -------------------------------------------------------------------------------- /src/shows/605 - Hasty CSS Color.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 605 3 | title: CSS Color Functions 4 | date: 1682337600125 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_605.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about CSS Color Functions, the benefits of dynamic css color, relative color syntax, color contrast, and color mix. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * **[00:49](#t=00:49)** Why we're talking CSS Color Functions 14 | * **[01:57](#t=01:57)** Benefits of dynamic CSS color 15 | * **[03:14](#t=03:14)** Relative color syntax 16 | * **[06:51](#t=06:51)** Color contrast 17 | * **[09:26](#t=09:26)** Color mix 18 | 19 | ## Tweet us your tasty treats 20 | 21 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 22 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 23 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 24 | * [Wes' Twitter](https://twitter.com/wesbos) 25 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 26 | * [Scott's Twitter](https://twitter.com/stolinski) 27 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 28 | -------------------------------------------------------------------------------- /src/shows/608 - Hasty RPC.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 608 3 | title: RPC in JavaScript! 4 | date: 1682942400125 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_608.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about RPC, what it means, why are we talking about it now, tRPC, and will RPC take off? 9 | 10 | ## Show Notes 11 | 12 | * **[00:22](#t=00:22)** Welcome 13 | * **[01:51](#t=01:51)** What does RPC mean? 14 | * **[04:52](#t=04:52)** Why are we talking RPC now? 15 | * **[10:27](#t=10:27)** Hype around RPC 16 | * [Supper Club × Solid.js with Ryan Carniato — Syntax Podcast 577](https://syntax.fm/show/577/supper-club-solid-js-with-ryan-carniato) 17 | * **[11:05](#t=11:05)** Isn't this just a REST endpoint? 18 | * **[13:23](#t=13:23)** Considerations around RPC 19 | * **[16:11](#t=16:11)** What about tRPC? 20 | * [Supper Club × tRPC With Alex KATT Johansson — Syntax Podcast 526](https://syntax.fm/show/526/supper-club-trpc-with-alex-katt-johansson) 21 | * **[18:08](#t=18:08)** Will RPC take off? 22 | 23 | ## Tweet us your tasty treats 24 | 25 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 26 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 27 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 28 | * [Wes' Twitter](https://twitter.com/wesbos) 29 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 30 | * [Scott's Twitter](https://twitter.com/stolinski) 31 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 32 | -------------------------------------------------------------------------------- /src/shows/612 - tasty ui.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 612 3 | title: UI Elements - Basics, Best Practice, and Built Ins 4 | date: 1683720000221 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_612.mp3 6 | --- 7 | 8 | In this episode of Syntax, Wes and Scott talk about UI elements and best practices with UI elements, as well as UI elements that exist in browsers. 9 | 10 | ## Show Notes 11 | 12 | * **[00:10](#t=00:10)** Welcome 13 | * **[01:10](#t=01:10)** Making demos for fun 14 | * **[02:47](#t=02:47)** Why we're talking UI elements 15 | * **[03:48](#t=03:48)** Bad UI elements in the browser 16 | * [Syntax 602: Modals, Popups, Popovers, Lightboxes](https://syntax.fm/show/602/modals-popups-popovers-lightboxes) 17 | * [Progress](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meter) 18 | * **[10:47](#t=10:47)** Decent UI elements in browser 19 | * **[19:49](#t=19:49)** Enter Open UI 20 | * [Open UI](https://open-ui.org/) 21 | * **[34:39](#t=34:39)** Accordion hunks 22 | * **[38:15](#t=38:15)** Pop overs 23 | * **[42:15](#t=42:15)** Focus group 24 | * **[46:10](#t=46:10)** SIIIIICK ××× PIIIICKS ××× 25 | 26 | ## ××× SIIIIICK ××× PIIIICKS ××× 27 | 28 | * Scott: [Fishskyn](https://fishskyn.com/) 29 | * Wes: [Flavacol](https://amzn.to/3Arvkzg) & [Butter Flavoured Coconut Oil](https://amzn.to/40PNBBn) 30 | 31 | ## Shameless Plugs 32 | 33 | * Scott: [Sentry replays](https://sentry.io/) 34 | * Wes: [Wes Bos Tutorials](https://wesbos.com/courses) 35 | 36 | ## Tweet us your tasty treats 37 | 38 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 39 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 40 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 41 | * [Wes' Twitter](https://twitter.com/wesbos) 42 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 43 | * [Scott's Twitter](https://twitter.com/stolinski) 44 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 45 | -------------------------------------------------------------------------------- /src/shows/614 - hasty signals.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 614 3 | title: WTF Are Signals And Why Is Everyone So Hot On Them All Of The Sudden? 4 | date: 1684152000868 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_611.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Signals - what are signals and why is everyone talking about them suddenly? 9 | 10 | ## Show Notes 11 | 12 | * **[00:25](#t=00:25)** Welcome 13 | * **[01:40](#t=01:40)** Chipping away at projects 14 | * **[03:20](#t=03:20)** WTF are signals? 15 | * [Signals](https://github.com/preactjs/signals) 16 | * [Framework reimagined for the edge! - Qwik](https://qwik.builder.io/) 17 | * [SolidJS · Reactive Javascript Library](https://www.solidjs.com/) 18 | * [Zone](https://github.com/angular/angular/tree/main/packages/zone.js) 19 | * [Vanilla](https://codesandbox.io/s/07ktxc?file=/src/index.js) 20 | * **[09:03](#t=09:03)** What are the boundaries on signals? 21 | * **[10:49](#t=10:49)** Why are signals so popular now? 22 | * **[15:57](#t=15:57)** When wouldn't you use signals? 23 | 24 | ## Tweet us your tasty treats 25 | 26 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 27 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 28 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 29 | * [Wes' Twitter](https://twitter.com/wesbos) 30 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 31 | * [Scott's Twitter](https://twitter.com/stolinski) 32 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 33 | -------------------------------------------------------------------------------- /src/shows/617 - hasty node.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 617 3 | title: Why Is node_modules So Big? 4 | date: 1684756800433 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_617.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about the reasons your node_modules folder gets so large, and what you can do to help keep the file size down. 9 | 10 | ## Show Notes 11 | 12 | * **[00:24](#t=00:24)** Welcome 13 | * **[00:51](#t=00:51)** The punching bag of Javascript 14 | * [DaisyDisk](https://daisydiskapp.com/) 15 | * **[02:03](#t=02:03)** Spoiler alert - it's text 16 | * **[04:49](#t=04:49)** What actually increases the size? 17 | * **[07:29](#t=07:29)** Types 18 | * **[09:27](#t=09:27)** Polyfills 19 | * **[11:09](#t=11:09)** Raycast Snippets and BetterTouchTool 20 | * **[12:44](#t=12:44)** Babel 21 | * **[15:08](#t=15:08)** Markdown 22 | * **[15:52](#t=15:52)** Translations 23 | * **[18:23](#t=18:23)** What is the solution? 24 | * [Raycast](https://www.raycast.com/) 25 | * [Bundlephobia | Size of npm dependencies](https://bundlephobia.com/) 26 | * [Better Touch Tool](https://folivora.ai/) 27 | * [Fast, disk space efficient package manager | pnpm](https://pnpm.io/) 28 | 29 | ## Tweet us your tasty treats 30 | 31 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 32 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 33 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 34 | * [Wes' Twitter](https://twitter.com/wesbos) 35 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 36 | * [Scott's Twitter](https://twitter.com/stolinski) 37 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 38 | * [Wes Bos on Bluesky](https://bsky.app/profile/syntax.fm/wesbos.com) 39 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 40 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 41 | -------------------------------------------------------------------------------- /src/shows/620 - hasty Javascript.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 620 3 | title: JavaScript.exe - Standalone Executables 4 | date: 1685361600397 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_620.mp3 6 | --- 7 | 8 | JavaScript executables: their purpose, benefits, and use cases, such as creating standalone applications with all dependencies and the Node.js runtime bundled into a single executable for portability and easy deployment. We also address the twitter hate on the executable’s size. 9 | 10 | ## Show Notes 11 | 12 | * **[00:25](#t=00:25)** Welcome 13 | * **[01:12](#t=01:12)** What are JavaScript executables? 14 | * **[04:39](#t=04:39)** Deploying tooling 15 | * **[06:01](#t=06:01)** Running on a USB stick 16 | * **[07:57](#t=07:57)** The size 17 | * **[12:19](#t=12:19)** Fastly 18 | * [The edge cloud platform behind the best of the web | Fastly](https://www.fastly.com/) 19 | * [Deno — A modern runtime for JavaScript and TypeScript](https://deno.com/runtime) 20 | * [Bun — A fast all-in-one JavaScript runtime](https://bun.sh/) 21 | 22 | ## Tweet us your tasty treats 23 | 24 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 25 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 26 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 27 | * [Wes' Twitter](https://twitter.com/wesbos) 28 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 29 | * [Scott's Twitter](https://twitter.com/stolinski) 30 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 31 | * [Wes Bos on Bluesky](https://bsky.app/profile/syntax.fm/wesbos.com) 32 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 33 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 34 | -------------------------------------------------------------------------------- /src/shows/623 - Hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 623 3 | title: Nothing in CSS - 0 vs 0px, no, none, hidden, initial and unset 4 | date: 1685966400934 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_623.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about all the nothing in CSS: 0 vs 0px, no, none, hidden, initial and unset. 9 | 10 | ## Show Notes 11 | 12 | * **[00:22](#t=00:22)** Welcome 13 | * **[01:50](#t=01:50)** The @ property 14 | * **[03:33](#t=03:33)** Hiding Things 15 | * **[10:07](#t=10:07)** Ghost Spaces 16 | * **[17:47](#t=17:47)** Collapsing margins 17 | * **[18:33](#t=18:33)** 0 units vs 0 18 | * **[23:42](#t=23:42)** Unset and initial 19 | * **[27:42](#t=27:42)** HTML Bonus 20 | 21 | ## Tweet us your tasty treats 22 | 23 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 24 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 25 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 26 | * [Wes' Twitter](https://twitter.com/wesbos) 27 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 28 | * [Scott's Twitter](https://twitter.com/stolinski) 29 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 30 | * [Wes Bos on Bluesky](https://bsky.app/profile/syntax.fm/wesbos.com) 31 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 32 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 33 | -------------------------------------------------------------------------------- /src/shows/626 - hasty planning.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 626 3 | title: GitHub Projects, Milestones, Labels, and Actions 4 | date: 1686571200327 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_626.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about some of the GitHub features you may not have used very much including projects, milestones, labels, and actions. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * **[01:53](#t=01:53)** That's sick 14 | * **[04:05](#t=04:05)** What we've used in the past 15 | * [Trello](https://www.trello.com) 16 | * [Jira | Issue & Project Tracking Software | Atlassian](https://www.atlassian.com/software/jira) 17 | * **[06:13](#t=06:13)** Working with Github Projects 18 | * [About Projects](https://docs.github.com/en/issues/planning-and-tracking-with-projects/learning-about-projects/about-projects) 19 | * **[11:57](#t=11:57)** Milestones 20 | * [About milestones](https://docs.github.com/en/issues/using-labels-and-milestones-to-track-work/about-milestones) 21 | * **[14:35](#t=14:35)** GitHub Labels 22 | * [Managing labels](https://docs.github.com/en/issues/using-labels-and-milestones-to-track-work/managing-labels) 23 | * **[19:51](#t=19:51)** GitHub Actions 24 | * [Features • GitHub Actions](https://github.com/features/actions) 25 | * [Level Up Tutorials - Learn modern web development](https://levelup.video/tutorials/code-automation-with-github/introduction) 26 | 27 | ## Tweet us your tasty treats 28 | 29 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 30 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 31 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 32 | * [Wes' Twitter](https://twitter.com/wesbos) 33 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 34 | * [Scott's Twitter](https://twitter.com/stolinski) 35 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 36 | * [Wes Bos on Bluesky](https://bsky.app/profile/wesbos.com) 37 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 38 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 39 | -------------------------------------------------------------------------------- /src/shows/629 - hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 629 3 | title: AsyncLocalStorage + AsyncContext API 4 | date: 1687176000338 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_629.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about AsyncLocalStorage, why more frameworks aren't using it yet, some examples, as well as some footguns. 9 | 10 | ## Show Notes 11 | 12 | * **[00:22](#t=00:22)** Welcome 13 | * **[01:44](#t=01:44)** What is AsyncLocalStorage? 14 | * **[03:14](#t=03:14)** What is context? 15 | * **[07:49](#t=07:49)** Why aren't more frameworks using AsyncLocalStorage for context for middleware? 16 | * **[10:16](#t=10:16)** Examples of usage 17 | * **[14:20](#t=14:20)** Footguns 18 | 19 | ## Tweet us your tasty treats 20 | 21 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 22 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 23 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 24 | * [Wes' Twitter](https://twitter.com/wesbos) 25 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 26 | * [Scott's Twitter](https://twitter.com/stolinski) 27 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 28 | * [Wes Bos on Bluesky](https://bsky.app/profile/wesbos.com) 29 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 30 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 31 | -------------------------------------------------------------------------------- /src/shows/635 - Hasty Lightning CSS.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 635 3 | title: Lightning CSS 4 | date: 1688385600576 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_635.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about what Lightning CSS is, how it works, and why you should consider using it in your projects. 9 | 10 | ## Show Notes 11 | 12 | * **[00:25:22](#t=00:25:22)** Welcome 13 | * **[01:04:11](#t=01:04:11)** Overview of Lightning CSS 14 | * [Lightning CSS](https://lightningcss.dev/) 15 | * [Devon Govett (@devongovett)](https://twitter.com/devongovett) 16 | * [Parcel](https://parceljs.org/) 17 | * **[04:56:11](#t=04:56:11)** What's in Lightning CSS? 18 | * [OKLCH](https://oklch.com/) 19 | * **[21:39:11](#t=21:39:11)** CSS Layers 20 | * **[24:57:14](#t=24:57:14)** Text decoration 21 | 22 | ## Tweet us your tasty treats 23 | 24 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 25 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 26 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 27 | * [Wes' Twitter](https://twitter.com/wesbos) 28 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 29 | * [Scott's Twitter](https://twitter.com/stolinski) 30 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 31 | * [Wes Bos on Bluesky](https://bsky.app/profile/wesbos.com) 32 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 33 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 34 | -------------------------------------------------------------------------------- /src/shows/641 - Hasty helper.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 641 3 | title: Help Me Help You - How To Ask For Help 4 | date: 1689595200139 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_641.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about how to get help for a bug or error you're getting in someone else's code. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * **[01:54](#t=01:54)** Building a reproduction of the error 14 | * **[03:55](#t=03:55)** Creating a gist 15 | * [Gist](https://gist.github.com/) 16 | * **[04:48](#t=04:48)** Be responsive. Be ready. 17 | * **[08:03](#t=08:03)** Where do you go first for support? 18 | * **[09:44](#t=09:44)** Search for your issue first 19 | * [GitHub Issues](https://docs.github.com/en/issues/tracking-your-work-with-issues/about-issues) 20 | * **[10:53](#t=10:53)** Be nice 21 | 22 | ## Tweet us your tasty treats 23 | 24 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 25 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 26 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 27 | * [Wes' Twitter](https://twitter.com/wesbos) 28 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 29 | * [Scott's Twitter](https://twitter.com/stolinski) 30 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 31 | * [Wes Bos on Bluesky](https://bsky.app/profile/wesbos.com) 32 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 33 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 34 | -------------------------------------------------------------------------------- /src/shows/644 - Hasty Toast.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 644 3 | title: User Feedback UI - Toasts, Flash, Validation 4 | date: 1690200000959 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_644.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about toast messages for validation, errors, confirmations, and more. 9 | 10 | ## Show Notes 11 | 12 | * **[00:24](#t=00:24)** Welcome 13 | * **[01:04](#t=01:04)** Why use these types of notifications 14 | * **[03:34](#t=03:34)** Old school checking stories 15 | * **[05:35](#t=05:35)** What kinds of toast messages are there? 16 | * **[10:02](#t=10:02)** Why toast? 17 | * **[11:38](#t=11:38)** Best practices for toast messages 18 | * **[17:09](#t=17:09)** Timeouts and manual close auto close 19 | * **[19:38](#t=19:38)** Multiple messages stacking on top of each other 20 | * **[22:56](#t=22:56)** Using a toast library 21 | * [Building a toast component](https://web.dev/building-a-toast-component/) 22 | * [react-hot-toast - The Best React Notifications in Town](https://react-hot-toast.com/) 23 | * [Real-time notification system for products | MagicBell](https://www.magicbell.com/) 24 | * **[28:29](#t=28:29)** Form validation 25 | * [Form validation with HTML5 and JavaScript](https://www.freecodecamp.org/news/form-validation-with-html5-and-javascript/) 26 | * **[33:36](#t=33:36)** HTML inputs 27 | 28 | ## Tweet us your tasty treats 29 | 30 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 31 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 32 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 33 | * [Wes' Twitter](https://twitter.com/wesbos) 34 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 35 | * [Scott's Twitter](https://twitter.com/stolinski) 36 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 37 | * [Wes Bos on Bluesky](https://bsky.app/profile/wesbos.com) 38 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 39 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 40 | -------------------------------------------------------------------------------- /src/shows/647 - Hasty.md: -------------------------------------------------------------------------------- 1 | --- 2 | number: 647 3 | title: Rust for JavaScript Developers - Node vs Rust Concepts 4 | date: 1690804800384 5 | url: https://traffic.libsyn.com/syntax/Syntax_-_647.mp3 6 | --- 7 | 8 | In this Hasty Treat, Scott and Wes talk about Rust, and how the concepts might translate for JavaScript developers looking to try writing in Rust. 9 | 10 | ## Show Notes 11 | 12 | * **[00:26](#t=00:26)** Welcome 13 | * **[01:08](#t=01:08)** Wes' big beer bottle and Red Green 14 | * [RedGreenTV on YouTube](https://www.youtube.com/@RedGreenTV) 15 | * **[05:03](#t=05:03)** Thrift store finds 16 | * **[06:19](#t=06:19)** Rust in JavaScript 17 | * [TOML: Tom's Obvious Minimal Language](https://toml.io/en/) 18 | * **[11:07](#t=11:07)** Documentation 19 | * [Docs.rs](https://docs.rs/) 20 | * [Practice.rs](https://practice.rs/comments-docs.html) 21 | * **[16:46](#t=16:46)** Memory safety 22 | * **[17:43](#t=17:43)** What about promises in Rust? 23 | * **[19:24](#t=19:24)** Error handling in Rust 24 | * **[27:39](#t=27:39)** What's with the double colon? 25 | 26 | ## Tweet us your tasty treats 27 | 28 | * [Scott's Instagram](https://www.instagram.com/stolinski/) 29 | * [LevelUpTutorials Instagram](https://www.instagram.com/LevelUpTutorials/) 30 | * [Wes' Instagram](https://www.instagram.com/wesbos/) 31 | * [Wes' Twitter](https://twitter.com/wesbos) 32 | * [Wes' Facebook](https://www.facebook.com/wesbos.developer) 33 | * [Scott's Twitter](https://twitter.com/stolinski) 34 | * Make sure to include [@SyntaxFM](https://twitter.com/SyntaxFM) in your tweets 35 | * [Wes Bos on Bluesky](https://bsky.app/profile/wesbos.com) 36 | * [Scott on Bluesky](https://bsky.app/profile/tolin.ski) 37 | * [Syntax on Bluesky](https://bsky.app/profile/syntax.fm) 38 | -------------------------------------------------------------------------------- /static/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/syntaxfm/hackweek-md-multiplayer-editor/a7efa0e154411736905cf3932b4c8c345ab22e39/static/favicon.png -------------------------------------------------------------------------------- /svelte.config.js: -------------------------------------------------------------------------------- 1 | import adapter from '@sveltejs/adapter-auto'; 2 | import { vitePreprocess } from '@sveltejs/kit/vite'; 3 | 4 | /** @type {import('@sveltejs/kit').Config} */ 5 | const config = { 6 | // Consult https://kit.svelte.dev/docs/integrations#preprocessors 7 | // for more information about preprocessors 8 | preprocess: vitePreprocess(), 9 | 10 | kit: { 11 | // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list. 12 | // If your environment is not supported or you settled on a specific environment, switch out the adapter. 13 | // See https://kit.svelte.dev/docs/adapters for more information about adapters. 14 | adapter: adapter() 15 | } 16 | }; 17 | 18 | export default config; 19 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.svelte-kit/tsconfig.json", 3 | "compilerOptions": { 4 | "allowJs": true, 5 | "checkJs": true, 6 | "esModuleInterop": true, 7 | "forceConsistentCasingInFileNames": true, 8 | "resolveJsonModule": true, 9 | "skipLibCheck": true, 10 | "sourceMap": true, 11 | "strict": true 12 | } 13 | // Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias 14 | // 15 | // If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes 16 | // from the referenced tsconfig.json - TypeScript does not merge them in 17 | } 18 | -------------------------------------------------------------------------------- /vite.config.ts: -------------------------------------------------------------------------------- 1 | import { sveltekit } from '@sveltejs/kit/vite'; 2 | import { defineConfig } from 'vite'; 3 | 4 | export default defineConfig({ 5 | plugins: [sveltekit()] 6 | }); 7 | --------------------------------------------------------------------------------