Dev Leonardo
Dev Leonardo
  • 201
  • 746 001
GitHub introduces Sub-Issues & more!
You probably used to track multiple GitHub issues manually, in the body of another issue. Good news: creating sub-issues is now a supported feature! 🚀
This update comes with some other improvements, such as Issue Types, a redefined Issue Search and more!
Bad news: it's still behind a feature flag.
Good news: you can request your Organization to join the private beta in one of those discussions:
Sub issues: github.com/orgs/community/discussions/131957
Issue types: github.com/orgs/community/discussions/112806
It's also a great chance to share feedback to help giving shape to these new features!
Also, have a look at Issue Form Templates: czcams.com/video/hNs5Gg_fEEs/video.html
_______________________________
Support my work: github.com/sponsors/Balastrong ❤️
Hit like and subscribe for more content! :D
Beginner-Friendly Open Source Projects: github.com/DevLeonardoCommunity
Join the Discord community! Here's the invite: discord.gg/bqwyEa6We6
You can also follow me on the other platforms:
Twitter: Balastrong
dev.to: dev.to/balastrong
GitHub: github.com/Balastrong
Home: leonardomontini.dev/
TikTok: www.tiktok.com/@balastrong
Instagram: devbalastrong
TIMESTAMPS
00:00 SubIssues & More
00:24 Issue Type
01:44 Sub Issues
03:34 Issue Search
04:48 Enable the new features
05:21 Issue Form Templates
zhlédnutí: 142

Video

Why values on my React form do not update?
zhlédnutí 180Před 14 dny
Might seem like a bug, it's a feature instead. The explanation goes down to... javascript! As simple as that! We're so used to javascript frameworks doing all sort of things that we forget that displaying the value of a javascript variable in the DOM has to be explicitly done, it's not a default js behaviour. When you want to push the performance and optimize your code, it makes sense to avoid ...
How TanStack releases multiple times a day
zhlédnutí 305Před 21 dnem
Tanstack (query, router, form, etc...) releases multiple times a day, thanks to GitHub Actions, delivering features and bugfixes almost instantly to millions of developers. Is it safe? Is it automated? Sure, let's see how! tanstack.com/ Support my work: github.com/sponsors/Balastrong ❤️ Hit like and subscribe for more content! :D Beginner-Friendly Open Source Projects: github.com/DevLeonardoCom...
They animated shadcn!
zhlédnutí 1,5KPřed měsícem
Are you building the latest AI-powered revolutionary SaaS startup? You probably need shiny animated components in your landing page! Check this out: magicui.design/ Following the success of shadcn, numerous "component collections" have popped up, with components designed to be copy-pasted entirely into your app. This time it's Magic UI, a collection of animated components using the library fram...
TanStack Router: Route/Location Masking
zhlédnutí 517Před měsícem
In React, you might want to show a shorter URL to the user, hiding some query params or parts of the URL entirely. Let's talk about route masking with TanStack Router 🎭 It's not a super common practice, but sometimes it helps. Here are a couple of examples: 1)You want to navigate to a page with some parameters already set. You can pass them into query params, but you don't need to show that to ...
React useOptimistic hook in Nextjs 14
zhlédnutí 288Před měsícem
What if you could make your backend respond in 0ms? ⚡️ In a real scenario, some api calls will most often be successful (hopefully) so here's the trick, bring some optimism in your application and instantly update the UI as if the operation went through. You can't have a slow backend, if you don't even wait for the response 🧠 I tested the useOptimistic hook introduced in React 18 in my new Next...
Your next side project won't fail this time 💡
zhlédnutí 139Před měsícem
My new side project will help your next side project stay alive a little bit longer, hopefully. It's an Open Source Nextjs app, integrated with GitHub, to keep track of plans and ideas. The goal is to have all things about side projects organized in one place, so you can write down your shower thoughts and try to be a little bit more accountable about that fancy idea you just had and were super...
The Missing Shadcn Component 🪄
zhlédnutí 913Před 2 měsíci
Look up in the sky! It's a bird! It's a plane! It's an Autocomplete! Code: github.com/Balastrong/shadcn-autocomplete-demo (happy if you leave a star on the repo ⭐️) Support my work: github.com/sponsors/Balastrong ❤️ Hit like and subscribe for more content! :D Beginner-Friendly Open Source Projects: github.com/DevLeonardoCommunity Join the Discord community! Here's the invite: discord.gg/bqwyEa6...
Convert snake_case to camelCase
zhlédnutí 92Před 2 měsíci
Some public APIs respond in camelCase 🐫 and some other in snake_case 🐍 What happens if your application gets data from both? Join me in this crusade for consistency ⚔️ Code: github.com/Balastrong/camelize-demo Support my work: github.com/sponsors/Balastrong ❤️ Hit like and subscribe for more content! :D Beginner-Friendly Open Source Projects: github.com/DevLeonardoCommunity Join the Discord com...
TanStack Table: Backend Pagination, Filter & Sort with TanStack Query + TanStack Router
zhlédnutí 3,5KPřed 2 měsíci
TanStack Table: Backend Pagination, Filter & Sort with TanStack Query TanStack Router
Building an HTTP Server and other Code Challenges
zhlédnutí 108Před 2 měsíci
Building an HTTP Server and other Code Challenges
TanStack Router: Block navigation with unsaved changes
zhlédnutí 664Před 3 měsíci
TanStack Router: Block navigation with unsaved changes
TanStack Form: Dynamic Arrays in React
zhlédnutí 587Před 3 měsíci
TanStack Form: Dynamic Arrays in React
🌈 2 Colorful vscode Extensions to Paint your Workflow
zhlédnutí 1,1KPřed 3 měsíci
🌈 2 Colorful vscode Extensions to Paint your Workflow
TanStack Form: Advanced Validation in React
zhlédnutí 1,1KPřed 3 měsíci
TanStack Form: Advanced Validation in React
GitHub README powering 4 Online Multiplayer Games
zhlédnutí 317Před 3 měsíci
GitHub README powering 4 Online Multiplayer Games
TanStack Form: Simple Validation (with shadcn/ui & React)
zhlédnutí 2,5KPřed 4 měsíci
TanStack Form: Simple Validation (with shadcn/ui & React)
NEW GitHub Copilot Workspace Demo
zhlédnutí 13KPřed 4 měsíci
NEW GitHub Copilot Workspace Demo
shadcn/ui is great! But what if...
zhlédnutí 9KPřed 4 měsíci
shadcn/ui is great! But what if...
How to Review a Pull Request on GitHub
zhlédnutí 1,9KPřed 4 měsíci
How to Review a Pull Request on GitHub
TanStack Router: Code Based Routing
zhlédnutí 1,9KPřed 5 měsíci
TanStack Router: Code Based Routing
Building Together Our DIscord Bot
zhlédnutí 110Před 5 měsíci
Building Together Our DIscord Bot
A 3D Viewer for Any Website
zhlédnutí 228Před 5 měsíci
A 3D Viewer for Any Website
TanStack Router: Layout Sharing/Nesting & Custom 404
zhlédnutí 3,2KPřed 5 měsíci
TanStack Router: Layout Sharing/Nesting & Custom 404
Learn React, Angular and Vue... all at once!
zhlédnutí 240Před 5 měsíci
Learn React, Angular and Vue... all at once!
TanStack Router: Authenticated Routes (Guards)
zhlédnutí 6KPřed 6 měsíci
TanStack Router: Authenticated Routes (Guards)
TanStack Router: Query Parameters & Validation
zhlédnutí 3,4KPřed 6 měsíci
TanStack Router: Query Parameters & Validation
TanStack Router: Path Parameters & Loader
zhlédnutí 4,2KPřed 6 měsíci
TanStack Router: Path Parameters & Loader
TanStack Router: Setup & Routing in React
zhlédnutí 9KPřed 6 měsíci
TanStack Router: Setup & Routing in React
Support Open Source with your Company
zhlédnutí 42Před 6 měsíci
Support Open Source with your Company

Komentáře

  • @Alex-bc3xe
    @Alex-bc3xe Před dnem

    I actually like to be able to customize my components easily

  • @user-ub7pf6td7l
    @user-ub7pf6td7l Před dnem

    Soo helpful thank you so much

  • @DavidMkp
    @DavidMkp Před dnem

    You should show the before like you did but the after too so it can be more useful

  • @acavals8080
    @acavals8080 Před dnem

    Straight to the point, no annoying music, simple example and that's it. Man, I'm feeling like a PRO now, thank you!

  • @kieronwiltshire1701

    If you have an issue with a component, you can literally re-install the component via the cli, get the latest version and boom, you're good.

  • @jlkinley
    @jlkinley Před 4 dny

    Hi Buddy! Have you figured out how to generate a nav from the your top level routes? It seems like this would be a great way to make your navs based on the routes you generate. Make sense?

  • @MuhammadumarSotvoldiev

    Thank you very much

  • @Benthetech-qn2lf
    @Benthetech-qn2lf Před 6 dny

    thanks man

  • @dziaddy
    @dziaddy Před 6 dny

    I have this problem that I can't use router.invalidate() inside my hook because it's not inside router provider.

  • @tasmisa6778
    @tasmisa6778 Před 7 dny

    Hey can you talk a bit about how can I comment my repository code from readme....i wanna keep some code there without appearing on profile

  • @rchuhk100
    @rchuhk100 Před 8 dny

    Very helpful video! Thank you.

  • @thebocksters2756
    @thebocksters2756 Před 8 dny

    a

  • @godofwar8262
    @godofwar8262 Před 8 dny

    I have questions out of this video that the mern stack is dead and does creating projects help to get you a job if you are an intern or fresher

  • @chuckynorris616
    @chuckynorris616 Před 9 dny

    I dont have the nr command i dont see that part

    • @DevLeonardo
      @DevLeonardo Před 9 dny

      It's not about Tanstack Router, that's a shortcut for "npm run" from a tool called ni, I talked about it here: czcams.com/video/NiTmtiBgJKI/video.html

  • @Golgafrincham
    @Golgafrincham Před 9 dny

    This missing feature was basically the reason why we decided to move from Github to Notion for most task management...

  • @dangquangkhai1454
    @dangquangkhai1454 Před 10 dny

    wao this is precious, thanks man

  • @dziaddy
    @dziaddy Před 10 dny

    How to create a separate route for not found? like /404 or something.

    • @DevLeonardo
      @DevLeonardo Před 9 dny

      You can create a 404 page and add a redirect/or navigate in the defaultNotFoundComponent in your router

    • @dziaddy
      @dziaddy Před 9 dny

      @@DevLeonardo I Got it but still thanks my friend

  • @chandanmb7
    @chandanmb7 Před 11 dny

    Hi, Nice video. Not sure the debug point is not coming to vs code . Do we have special settings done ? Any help would be appreciated

  • @mdwahidali6053
    @mdwahidali6053 Před 12 dny

    How to debug react code in webstorm?

  • @albert4392
    @albert4392 Před 12 dny

    The explanation is superb!

  • @GusTheAnt
    @GusTheAnt Před 14 dny

    What extension are you using to colorize your line indentations (See 0:47)? Or is it a built-in setting in VS Code? Edit: Found it - it's called indent-rainbow

  • @MohamedArafathCanada
    @MohamedArafathCanada Před 15 dny

    What is the extension used for add color in the code window for differentiate tag start and end points

  • @KaranSethia24
    @KaranSethia24 Před 16 dny

    is it possible to use this inside a form from react-hook-form

  • @rambletheluc4040
    @rambletheluc4040 Před 16 dny

    Thanks! That was very informative man!

  • @ZeshanMukhtar1
    @ZeshanMukhtar1 Před 16 dny

    LOVE FROM PAKISTAN

  • @omkarbhambure2886
    @omkarbhambure2886 Před 17 dny

    router.invalidate() is not updated the login data, means on clicking the login sign in button, signout button is not displayed

  • @madmaxdev
    @madmaxdev Před 17 dny

    Is tanstack form better than RHF?

    • @DevLeonardo
      @DevLeonardo Před 17 dny

      They're two different libraries at different stages, I'd say give it a try and see if you like one more than the other for your needs :)

  • @ralph7862
    @ralph7862 Před 21 dnem

    Visual studio 2022 has the better option of fixing merge conflicts. They have the check boxes there that automatically adds changes to the next line if you accept both. Hoping vs code make that

  • @juiced9432
    @juiced9432 Před 21 dnem

    Complicated...

  • @trangcongthanh
    @trangcongthanh Před 24 dny

    0:42 The ownership of the code is the best feature of shadcn/ui. I rather try to resolve the problem by myself than create issue, wait author/contributor verify the issue, fix it, then release it. I even created the PR to fix the bug, but it never got merge. Or got merge but never released. In the end of the day, I need to maintain a fork of the library by myself. Is it less work compare to maintain shadcn/ui components? 2:48 You can config the tsserver to ignore some pattern from auto/suggest import ("typescript.preferences.autoImportFileExcludePatterns": []) Yes, upgrade deps for long run project is always a pain.

  • @jlkinley
    @jlkinley Před 24 dny

    Hi buddy. Your tutorials are great. I have learned so much from watching your videos. I was wondering if you could do a video on routes that work with modals and drawers. It seems to me this would require both file-based and code-based routing. I am currently building a project with shadcn and it would be great to be able to have a modal element that has an outlet. So far, I have not been able to figure it out.

    • @DevLeonardo
      @DevLeonardo Před 24 dny

      You should be able to achieve that even on a file-based project, with a modal having its own route. Plus if you want you can use route masking to make the URL cleaner, here's a video on that: czcams.com/video/yTx7zYpq4ok/video.html

  • @epireve
    @epireve Před 25 dny

    Purchased the pro version 🎉thankss

    • @DevLeonardo
      @DevLeonardo Před 25 dny

      Glad you like it! I should have asked them for a referral link or a sponsored video 😂

  • @samirjarjous3920
    @samirjarjous3920 Před 26 dny

    Thanks man! That was meaningful and straightforward!

  • @eobardthawne8204
    @eobardthawne8204 Před 26 dny

    it doesn't hurts linking magic ui in the description

    • @DevLeonardo
      @DevLeonardo Před 26 dny

      It's literally the first result on Google for "magic ui" but you're also right, I forgot to add it. There it is: magicui.design/ ❤️

  • @Nnthienphuc
    @Nnthienphuc Před 28 dny

    Thanks for your sharing. It helps me a lot in my new project.

  • @goozman101
    @goozman101 Před 28 dny

    Thank you for this video. It pointed me to the missing piece.

    • @DevLeonardo
      @DevLeonardo Před 27 dny

      Great to hear! What were you missing? :)

  • @lsaavedr
    @lsaavedr Před měsícem

    thanks 😂 ❤

  • @emanuelegurini
    @emanuelegurini Před měsícem

    We want a series where you start creating animations using vanilla CSS

    • @DevLeonardo
      @DevLeonardo Před měsícem

      I don't think it's gonna happen anytime soon 😂

  • @a.aashishjairammabd7220
    @a.aashishjairammabd7220 Před měsícem

    Bro i need this website link

  • @hulashmahto99
    @hulashmahto99 Před měsícem

    Nice

  • @KralekGiftshop
    @KralekGiftshop Před měsícem

    Nice extantion. Thanks for the developer and for the video. Is there a way to use the curent year in the number or add number lenght. For example: I want a number with format 24001, 24002, 24003, ... where the first digits are the curent year

    • @DevLeonardo
      @DevLeonardo Před měsícem

      Thank you! Unfortunately that's not possible as the extension does not really read your cards and their data, the only thing that sees is the unique id

  • @goncaloshred
    @goncaloshred Před měsícem

    First of all thanks a lot for the great video! I've been using optimistic hook for a while, but the custom hook that you've created seems to be quite handy! I would like to ask you, how would you manage the optimistic state on a like button? Would you pass the whole array of userIds that have liked to the hook or just some simple boolean "isLiked"? I'm still a new developer and I was passing the whole array of userIds that have liked some content, but doesn't seem to be the best practise as I'd be exposing all the userIds to the client, right?

    • @DevLeonardo
      @DevLeonardo Před měsícem

      If you want to display a counter you should do the math (count the userIds) on your server and only return the final number. Everything that is handled in the useOptimistic hook (as every other hook) is already client side. Your client value should just be the number and the optimistic update only do +1 to that number.

  • @SeanCassiere
    @SeanCassiere Před měsícem

    Great video! When we released the route masking feature back during the beta, we really only considered that Instagram-style dialog-to-page type navigation as its only real production use case. We of course knew about the search param hiding capability, but we never thought that it'd be anything someone would want to do. Now about 8 months since we went 1.0, with people wanting to put everything in their URL search params, the declarative route masking works so well 😋.

    • @DevLeonardo
      @DevLeonardo Před měsícem

      Thanks for the comment! The search params API works so smooth that I see why everyone is using it a lot :D

  • @madisopabul
    @madisopabul Před měsícem

    trash dont watch video safe time

  • @Sarlasnw
    @Sarlasnw Před měsícem

    That's helped me a lot! Thank you, bro.

  • @Bifimax
    @Bifimax Před měsícem

    great explaination need more videos like this

  • @carlosenriquecastanedaguti8130

    Excelent explanation, thanks very much for your video.

  • @snletwang6994
    @snletwang6994 Před měsícem

    Thanks Dev Leonardo, I was really stuck on few concepts for my work,, you are a saviour bro!1

    • @DevLeonardo
      @DevLeonardo Před měsícem

      Love to hear that! ❤️ Don't forget to subscribe if you haven't already, a new video on TanStack Router is scheduled for tomorrow :D

  • @juiced9432
    @juiced9432 Před měsícem

    I don't understand why the bar / foo in _hiddenLayout render any parent layout?

  • @leandrorodriguez4444
    @leandrorodriguez4444 Před měsícem

    i dont understand i keep having an issue in the vite.config.ts file when i do import { TanStackRouterVite } from '@tanstack/router-vite-plugin'; Module '"@tanstack/router-vite-plugin"' has no exported member 'TanStackRouterVite'.ts(2305) import TanStackRouterVite i didnt clone the repository i started my own, from an existing small project. im using vite, when i run the application the empty files that i created are actually being filled with the route, the autogen file is also working. im just getting this annoying error from the vite.config.ts any suggestiongs ?