Beyond Fireship
Beyond Fireship
  • 39
  • 12 425 319
Build better payment forms using new “embedded” Stripe Checkout
Learn how to use the new embedded Stripe Checkout feature to easily accept payments without ever leaving your own website. Learn everything about payments for software developers in my new Stripe for SaaS featuring Next.js and Supabase:
Stripe for SaaS: fireship.io/courses/stripe-saas/
And use code BEYOND30 to save some money!
Full Tutorial and Code: fireship.io/courses/stripe-saas/bonus-embedded-checkout/
zhlédnutí: 139 664

Video

GitHub Copilot now controls your command line...
zhlédnutí 292KPřed měsícem
Learn how to become a Bash or PowerShell guru by using GitHub Copilot in the CLI. This new feature is a great way to learn Linux and Git commands without ever leaving your IDE. Check out the Fireship VS Code course fireship.io/courses/vscode-tricks/ GitHub copilot in the CLI github.blog/changelog/2024-03-21-github-copilot-general-availability-in-the-cli FFmpeg in 100 Seconds czcams.com/video/26...
How I deploy serverless containers for free
zhlédnutí 372KPřed měsícem
Build a Python Flask app for removing the background from images, containerize it with Docker, then deploy it with serverless cloud tools. Watch Docker 101 czcams.com/video/rIrNIzy6U_g/video.html Source Code github.com/codediodeio/rembg-webapp-tutorial
This UI component library is mind-blowing
zhlédnutí 525KPřed 2 měsíci
Let's explore a free open-source UI library that replicates advanced animations found on the landing pages of top-tier startups. Learn how to code advanced components in React and other JavaScript frameworks. Aceternity Components ui.aceternity.com/components ShadCN ui.shadcn.com/ Parallax Tutorial czcams.com/video/UgIwjLg4ONk/video.html Fireship Next.js Course fireship.io/courses/nextjs/
I built an Apple Vision Pro app... visionOS tutorial
zhlédnutí 521KPřed 2 měsíci
Learn the basics of VisionOS development for the Apple Vision Pro. I build a simple app from scratch using SwiftUI and RealityKit to build an app for Apple's new VR/AR platform. Upgrade to PRO fireship.io/pro VisionOS Docs developer.apple.com/documentation/visionos Apple Vision Code Report czcams.com/video/DuqLkG75BE8/video.html
Mind-blowing page animations are easy now... View Transitions API first look
zhlédnutí 234KPřed 8 měsíci
Learn about the new View Transitions API in Astro and how it can add awesome route animations to your website. #webdevelopment #javascript #code Upgrade to Fireship PRO fireship.io/pro View Transitions API docs.astro.build/en/guides/view-transitions/ SvelteFire Docs sveltefire.fireship.io I built a JS framework czcams.com/video/SJeBRW1QQMA/video.html
PROOF JavaScript is a Multi-Threaded language
zhlédnutí 256KPřed 9 měsíci
Learn the basics of parallelism and concurrency in JavaScript by experimenting with Node.js Worker Threads and browser Web Workers. #javascript #programming #computerscience Upgrade to Fireship PRO fireship.io/pro Node.js Worker Threads nodejs.org/api/worker_threads.html Check out @codewithryan czcams.com/video/_Im4_3Z1NxQ/video.html
How GitHub Actions 10x my productivity
zhlédnutí 377KPřed 9 měsíci
Learn how to use GitHub actions continuous integration and delivery in a software development project. In this quick tutorial, we look at 7 powerful ways to automate code with CI/CD. #programming #automation - My GitHub Actions in SvelteFire github.com/codediodeio/sveltefire - GitHub Actions Docs github.com/features/actions - act cli github.com/nektos/act
React VS Svelte...10 Examples
zhlédnutí 504KPřed 10 měsíci
The ultimate guide to Svelte for React.js Developers with 10 code examples for both JavaScript frameworks. Find out if SvelteKit is better than Next.js... SvelteKit Course fireship.io/courses/sveltekit Next.js 13 Course fireship.io/courses/nextjs Full Svelte vs React Article fireship.io/lessons/svelte-for-react-developers/ #javascript #webdevelopment #programming
I built a *streaming* AI chat app
zhlédnutí 120KPřed 10 měsíci
Learn how to use the new Vercel AI SDK to quickly build streaming AI chat apps with APIs like OpenAI, Anthropic, HuggingFace, LangChain, and more. Upgrade to get the full SvelteKit Course at fireship.io/pro Use promo code FKIT to save 35% Vercel AI Announcement vercel.com/blog/introducing-the-vercel-ai-sdk
I tried 8 different Postgres ORMs
zhlédnutí 376KPřed 11 měsíci
Let's compare 8 ways to work with SQL databases in a JavaScript project like Node.js or Next.js. Analyze the pros and cons of libraries and ORMs that can run Postgres queries in a fullstack framework. #sql #javascript #webdevelopment Learn more in full Next 13 Course fireship.io/courses/nextjs/ - pg github.com/brianc/node-postgres - postgres.js github.com/porsager/postgres - knex github.com/kne...
Most overpowered way to build mobile apps?
zhlédnutí 677KPřed 11 měsíci
Learn how to use FlutterFlow to build iOS and Android apps quickly. It is a low-code Flutter tool with integrations for Firebase that rapidly speed up mobile development. #android #flutter #firebase Use FlutterFlow for free bit.ly/3Ia8UXv Flutter Docs docs.flutter.dev Fireship Flutter Course fireship.io/courses/flutter-firebase/
I built a fullstack PaLM AI app in just 2 minutes
zhlédnutí 175KPřed 11 měsíci
Learn how to use Google's new PaLM 2 AI model with Firebase and SvelteKit. In this tutorial, we build and deploy a fullstack LLM-powered application in just 2 minutes. Firebase Updates firebase.blog/posts/2023/05/whats-new-at-google-io Google I/O breakdown czcams.com/video/nmfRDRNjCnM/video.html Terraform in 100 Seconds czcams.com/video/tomUWcQ0P3k/video.html #webdevelopment #ai #tutorial
The ultimate guide to web performance
zhlédnutí 390KPřed 11 měsíci
Learn how to analyze and optimize the performance of any website. In this tutorial, we explore tips and tricks to build faster UIs that are ideal for search engine optimization. #webdevelopment #javascript #css 🔥 Become a PRO member fireship.io/pro 💵 Use code BEYOND25 to save 25% Unlighthouse github.com/harlan-zw/unlighthouse Web Vitals Plugin web.dev/debug-cwvs-with-web-vitals-extension/
Next.js Server Actions... 5 awesome things you can do
zhlédnutí 244KPřed rokem
A full tutorial and breakdown of the new Next.js Server Actions feature. Learn how to handle form submissions and implement optimistic updates without the need to API routes. #reactjs #javascript #webdevelopment Get the Full Next.js Course fireship.io/courses/nextjs Server Actions Announcement nextjs.org/blog/next-13-4
Industrial-scale Web Scraping with AI & Proxy Networks
zhlédnutí 684KPřed rokem
Industrial-scale Web Scraping with AI & Proxy Networks
I built an image search engine
zhlédnutí 281KPřed rokem
I built an image search engine
ChatGPT Official API First Look
zhlédnutí 419KPřed rokem
ChatGPT Official API First Look
Sorting Algorithms Explained Visually
zhlédnutí 499KPřed rokem
Sorting Algorithms Explained Visually
You don't need Node to use NPM packages
zhlédnutí 149KPřed rokem
You don't need Node to use NPM packages
10 Rendering Patterns for Web Apps
zhlédnutí 318KPřed rokem
10 Rendering Patterns for Web Apps
The easiest realtime app I’ve ever built
zhlédnutí 180KPřed rokem
The easiest realtime app I’ve ever built
Dramatically improve website speed with Partytown
zhlédnutí 168KPřed rokem
Dramatically improve website speed with Partytown
How to Setup Node.js with TypeScript in 2023
zhlédnutí 356KPřed rokem
How to Setup Node.js with TypeScript in 2023
Make Crazy Art with the NEW OpenAI Dall-e API
zhlédnutí 164KPřed rokem
Make Crazy Art with the NEW OpenAI Dall-e API
Next.js 13 - The Basics
zhlédnutí 595KPřed rokem
Next.js 13 - The Basics
NEW Firebase Features Just Dropped
zhlédnutí 119KPřed rokem
NEW Firebase Features Just Dropped
WTF are all these config files for?
zhlédnutí 173KPřed rokem
WTF are all these config files for?
Generate Images Programmatically on the Edge
zhlédnutí 142KPřed rokem
Generate Images Programmatically on the Edge
Reverse Engineer Google’s NASA Dart Easter Egg with CSS
zhlédnutí 89KPřed rokem
Reverse Engineer Google’s NASA Dart Easter Egg with CSS

Komentáře

  • @dustsucker4704
    @dustsucker4704 Před 14 hodinami

    In svelte you can us components as props with <svelte:component> but I would not recomend it it's just not Designed that way

  • @Hobnockers
    @Hobnockers Před 15 hodinami

    Does Apple Vision Pro come with a default app to load or import 3d models and PBR-materials? A default 3d viewer?

  • @igor9silva
    @igor9silva Před 19 hodinami

    Spent 5 minutes exploring, found a bug on a component, thought of a solution through the in-doc code, just to find out it's not even open-source lol

  • @googleyoutubechannel8554

    You have to use the arrow keys in the terminal to run any of the suggested commands?! You have to f-ing kidding me, who designed the UI for this garbage and why don't they understand the most basic fundamentals about the CLI??

  • @edigunawan2991
    @edigunawan2991 Před dnem

    does svelte close to laravel livewire? because i see similarity here

  • @dev-suresh
    @dev-suresh Před dnem

    The video could be better if you've explained it visually rather than coding.

  • @rj3654
    @rj3654 Před dnem

    2:26 (͠≖ ͜ʖ͠≖)

  • @backstromforsberg
    @backstromforsberg Před dnem

    pg or prisma for me. I've used pg a ton and love it, but something tells me prisma would save me a lot of time. For an ORM to be worth it, it really should be something like prisma. Think I'm gonna try it out.

  • @spacepacehut3265
    @spacepacehut3265 Před 2 dny

    anyways what's the file icon pack Jeff is using ?

  • @younes-47
    @younes-47 Před 3 dny

    Then you have to deal with the villain : Responsiveness 😂

  • @bogdanpustai7547
    @bogdanpustai7547 Před 3 dny

    note: i had to tag like so: docker push [REPO_FULL_URL]/imageName and then push like so docker push [REPO_FULL_URL]/imageName. after installing gcloud and setting the path to the bin folder in env variables

  • @guijoa123
    @guijoa123 Před 4 dny

    Hey, I've followed everything accordingly and the form doesn't create no record on the DB, I've configured insomnia just the same as the await fetch and I'm able to do it through there, but on the code it doesn't work

  • @Cloudland117
    @Cloudland117 Před 4 dny

    Anyone else feel dumb?

  • @rezarst5734
    @rezarst5734 Před 4 dny

    thanks, it was useful

  • @amirt825
    @amirt825 Před 4 dny

    This is how I did it a few weeks ago on a project, funny this comes on my feed now. Mine doesn't just rotate the pupils, it moves them relative to the distance of the cursor so the pupil is in the center when you hover on the eye and the movement is much more natural. A little more trig, but that's what chatGPT is for: <!-- The face and its tracking eyes --> <div id="face" class="w-[60vw] md:w-[40vw] relative"> <img src="/tpe/face-eyes.svg" class="h-full w-full object-contain object-top" /> <img src="/tpe/pupil.svg" class="pupil absolute w-[10%] top-[2.5%] right-[23.5%]" /> <img src="/tpe/pupil.svg" class="pupil absolute w-[10%] top-[15%] right-[63%]" /> <img src="/tpe/pupil.svg" class="pupil absolute w-[10%] top-[33%] right-[7.3%]" /> <img src="/tpe/pupil.svg" class="pupil absolute w-[10%] top-[45.5%] right-[47%]" /> <img src="/tpe/pupil.svg" class="pupil absolute w-[10%] top-[64%] right-[24%]" /> </div> <!-- Follow the cursor with the Eyes --> <script type="module" is:inline> const face = document.querySelector('#face'); const pupils = document.querySelectorAll('.pupil'); const rect = face.getBoundingClientRect(); document.addEventListener('mousemove', function(e) { pupils.forEach(pupil => { const pupilRect = pupil.getBoundingClientRect(); const centerX = pupilRect.left + pupilRect.width / 2 - rect.left; const centerY = pupilRect.top + pupilRect.height / 2 - rect.top; const x = e.clientX - rect.left - centerX; const y = e.clientY - rect.top - centerY; const angle = Math.atan2(y, x); const maxDistance = rect.width * 0.018; const actualDistance = Math.sqrt(x * x + y * y); const distance = Math.min(maxDistance, maxDistance * (actualDistance / rect.width)); const pupilX = distance * Math.cos(angle); const pupilY = distance * Math.sin(angle); pupil.style.transform = `translate(${pupilX}px, ${pupilY}px)`; }); }); </script>

  • @MoussaBabadi
    @MoussaBabadi Před 4 dny

    You are a fool.. how do you think some one Can easily learn something with this shit type of vidéo..

  • @TheFumesPlatform-ko1il

    They should just put this video in the docs and save everyone some time.

  • @horrorcoder
    @horrorcoder Před 5 dny

    still overly complicated

  • @JesseSlomowitz
    @JesseSlomowitz Před 5 dny

    There is a dedicated SurrealDB GUI now too: czcams.com/video/l0_lj-ILVhE/video.html

  • @nerik85
    @nerik85 Před 6 dny

    that was a packed 5mins :)

  • @londelidess
    @londelidess Před 7 dny

    Life is more fun when it’s unreasonable loooooool

  • @NirBarZvi
    @NirBarZvi Před 8 dny

    CHILDREN

  • @ChristianeLamper
    @ChristianeLamper Před 8 dny

    It is not free all because google cloud will charge other something when you use cloud run

  • @adrielmwofoh9111
    @adrielmwofoh9111 Před 8 dny

    Hey jeff, cool video, Straight and concise. Thanks man.

  • @HudraLoLhorizons
    @HudraLoLhorizons Před 8 dny

    oh... my... god...

  • @novailoveyou
    @novailoveyou Před 9 dny

    Next.js fixed 70kb bundle size and it's great

  • @stefanopoiatti
    @stefanopoiatti Před 10 dny

    can i use that for my angular project or there's a better way?

  • @essentia9
    @essentia9 Před 10 dny

    The most convenient sort algorithm is the Lefties sort. No matter what order the elements are if we identify them as sorted.

  • @cqz89
    @cqz89 Před 10 dny

    Very like the old way PHP

  • @Kevin-qj7fp
    @Kevin-qj7fp Před 10 dny

    For selection sort cant you do minimum and maximum then you can work your way from both left to right as well as right to left

  • @ajaysenger2
    @ajaysenger2 Před 10 dny

    we got NEXT14 before GTA6

  • @djuka8121
    @djuka8121 Před 11 dny

    Nahhh react is much better

  • @azmiah8097
    @azmiah8097 Před 11 dny

    Is it really free i still have to pay for CPU memory even if there arent no requests right?

  • @likle7163
    @likle7163 Před 11 dny

    Jesus its like try to replace spring on java. I worked with both angular and react in prod and I have to say that these framework covers everything you need. If you want everything from box choose angular. If you want to custom stuff choose react. Nobody from big tech would use this garbage svelte cause tech wants stability and it pays for it. Svelte is just hype and will die anyway same way it appeared

  • @PiotrFilipek
    @PiotrFilipek Před 12 dny

    OMG, JS looks so nasty... After many years of evolution, developers have come full circle and have started mixing HTML and JS together again.

  • @bart2019
    @bart2019 Před 12 dny

    "$10 a month"?? The prices I've been quoted are more like 3 times that much. Ah, inflation. In just 1 month.

  • @arjunragu995
    @arjunragu995 Před 13 dny

    This is a good video. I never even knew this existed. Thank U

  • @lordosouls
    @lordosouls Před 13 dny

    What a CHAD

  • @juliandesens
    @juliandesens Před 13 dny

    I work at the library and was looking for better ways to sort books! The intro confirmed I was in the right place!

  • @nicolasbava3467
    @nicolasbava3467 Před 13 dny

    BOMBASTIC!!! thank you very much, working properly in next js framework

  • @LasTCursE69
    @LasTCursE69 Před 13 dny

    What about GPT sort? It's pretty much the same as Bogo, but randomly decides that it's sorted or not at some point (without checking)

  • @petflaska389
    @petflaska389 Před 13 dny

    Exactly what I needed and nothing more perfect!

  • @masterklm7216
    @masterklm7216 Před 14 dny

    Does this work in react native app

  • @arnavsingh5722
    @arnavsingh5722 Před 14 dny

    Is there any way...I can do such things with React.js...( Beginner )...??....coz React does not let me manipulate the DOM...

  • @ShellyHernandez-x
    @ShellyHernandez-x Před 14 dny

    Wondering about Proxy-Store's scraping proxies' effectiveness? Saw them on Google, any experiences?

  • @Novacification
    @Novacification Před 14 dny

    An hour looking for a minimal typescript setup with clear explanations. I should have known to come here immediately.

  • @Vorono4ka
    @Vorono4ka Před 15 dny

    Thank you so much!

  • @lazyken6468
    @lazyken6468 Před 16 dny

    Still waiting on that malbolge in 100secs

  • @cheesebusiness
    @cheesebusiness Před 16 dny

    I don’t recommend AWS ECS for this, because it requires you to complicate your cloud architecture to simply have a static IP for the container

  • @MasterQuestMaster
    @MasterQuestMaster Před 16 dny

    I like that Svelte templating is basically Handlebars, but with more features.