create a modern form with sveltekit superforms and tailwindcss

แชร์
ฝัง
  • เผยแพร่เมื่อ 31 พ.ค. 2024
  • in this video i'll show how to set up a modern form with sveltekit superforms. I messed up some animations so here are the two commands to install the devdeps:
    `bun i -D sveltekit-superforms zod`
    `bun i -D tailwindcss postcss autoprefixer`
    source code: github.com/nevthereal/form-tu...
    superforms: superforms.rocks
    my links: links.nevillebrem.com
    subscribe for more:)
    Timestamps:
    00:00 Intro
    00:10 Project setup
    00:55 Tailwind setup
    02:13 Server side of the form
    04:35 Building the form
    07:59 Frontend logic of the form
    09:31 Form action
    10:41 Error handling
    12:24 Submit message & form testing
    14:31 Outro my music is from epidemic sound (referral link): www.epidemicsound.com/referra...
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 8

  • @andreas.soderlund
    @andreas.soderlund หลายเดือนก่อน +2

    Nice tutorial, glad to see it works with Bun! The use:enhance action makes it possible to have client-side validation, loading timers, events and other features that requires JS to be enabled in the browser. Without it, the form will be static and the page will make a full reload for each submit.

    • @nevillebrem
      @nevillebrem  หลายเดือนก่อน

      first of all, thanks for the feedback! didn't know that, will pin your comment. thanks for clarifying

  • @roblesrt
    @roblesrt หลายเดือนก่อน +1

    Thanks for sharing!

    • @nevillebrem
      @nevillebrem  หลายเดือนก่อน

      glad you liked it!

  • @FCcommando
    @FCcommando หลายเดือนก่อน +1

    Cool video!
    Where does one learn backend with sveltekit? I have a grasp of the fundamentals when working in frontend, but when it comes to backend (working with db etc.) Im pretty much clueless.

    • @nevillebrem
      @nevillebrem  หลายเดือนก่อน +1

      i could do a video on that

    • @nevillebrem
      @nevillebrem  หลายเดือนก่อน +1

      this is my series on dbs though
      th-cam.com/play/PL5UWMWt_Ej-BjDKr2akMhZ4AXtMFeUMUm.html

    • @FCcommando
      @FCcommando หลายเดือนก่อน +1

      @@nevillebrem oh nice, I'll check it out!