Effortlessly Animating a Drag & Drop Kanban Board With View Transitions

Поділитися
Вставка
  • Опубліковано 21 лис 2024

КОМЕНТАРІ •

  • @frontendfyi
    @frontendfyi  Рік тому

    Don’t forget to grab a pro membership while it’s still €99 euro! Learn more on www.frontend.fyi/pro.

  • @vidigitusmarketing862
    @vidigitusmarketing862 8 місяців тому

    Greate video! The view transition API is just amazing 👌

  • @evgeniilevenkov6200
    @evgeniilevenkov6200 10 місяців тому

    Thanks for such great content!

    • @frontendfyi
      @frontendfyi  10 місяців тому +1

      Thank you! And thank you so much for the super thanks, really appreciate it!

  • @AntoniKiddcodePutra
    @AntoniKiddcodePutra 8 місяців тому

    Great Tutorial thanks so much for Sharing..
    Btw, what is your browser?

    • @frontendfyi
      @frontendfyi  8 місяців тому

      It's called Arc:
      arc.net/gift/7611d3fc

  • @empoweracademy2276
    @empoweracademy2276 5 місяців тому

    Does it work on mobile touch?

  • @josephgabriel8003
    @josephgabriel8003 7 місяців тому

    where can I get the starter code?

  • @serychristianrenaud
    @serychristianrenaud Рік тому

    Thank great video 🎉🎉🎉

  • @جوادجیتی
    @جوادجیتی Рік тому

    you are amazing

  • @braswelljr
    @braswelljr Рік тому

    You are good bro

  • @sinasalahshour
    @sinasalahshour 9 місяців тому

    i think it has a bug. when you drag and drop the item on top(or bottom) of itself, it duplicates

  • @eduardosantos3516
    @eduardosantos3516 Рік тому

    I'm watching your framer motion videos but I have a problem, I need to use usescroll because the offset property doesn't exist anymore. how could i get around this problem?

    • @frontendfyi
      @frontendfyi  Рік тому

      Check my reply to your other comment.

  • @frontendfyi
    @frontendfyi  Рік тому

    Wow, Adam Argyle just shared a tweet where he shows it actually IS possible to get drag and drop functionality on iOS! I just updated the article and code snippets to reflect this. See here: twitter.com/JeroenReumkens/status/1687342337737846784?s=20

  • @sahilverma_dev
    @sahilverma_dev Рік тому

    great

  • @krushilnaik126
    @krushilnaik126 Рік тому

    What theme is that 👀

    • @frontendfyi
      @frontendfyi  Рік тому +2

      It’s the Bearded Theme (Arc) in vscode!

  • @draftermyself
    @draftermyself Рік тому

    😮

  • @arman3400
    @arman3400 Рік тому

    Asking respectfully. Since view transitions is not supported on mobile, that leaves out like 90% of clients. Is it possible to ensure desktop (non-firefox/safari) users get view transitions, and everybody else gets framer-motion?

    • @frontendfyi
      @frontendfyi  Рік тому +1

      Doing Framer Motion as a fallback is a bit harder - or at least it would add quite a bit of extra code. Plus you're building the animation twice.
      I think it's more interesting to look at for example the polyfill Bramus is working on: twitter.com/JeroenReumkens/status/1696261766312050983?s=20
      And for browsers that are then still not supported, consider it as graceful degradation, and just don't give them any animations?

    • @arman3400
      @arman3400 Рік тому

      @@frontendfyi I appreciate the share, looks cool but I don’t think it’s what I’m looking for (smooth/tightly controlled transitions between routes in an MPA), so I think it might be better to just make it in Next and Framer. Thanks for the reply.

    • @frontendfyi
      @frontendfyi  Рік тому +1

      I think framer is indeed the right way to go with now yeah!

  • @davidbrumsoares
    @davidbrumsoares 4 місяці тому

    Unfortunately, this doesn't work on mobile

  • @alaminmir08
    @alaminmir08 Рік тому

    Hey Man. I just love what are you doing. Just some small requests: be more consistent, create bigger projects And don't get lost.

  • @abdallahmoubarak5303
    @abdallahmoubarak5303 5 місяців тому

    Does it work on mobile touch?