The Sedated Dev
The Sedated Dev
  • 21
  • 27 443
How to Protect Routes in Next.js using Middleware
In this video, we will see how to dockerize a next js application in two different scenarios.
Link to next js middleware matcher config:
nextjs.org/docs/app/building-your-application/routing/middleware#matcher
How to dockerize a next js application
ua-cam.com/video/AgqgH9ADgNE/v-deo.html
Comment down what else you would like to see, I am always open to suggestions.
You guys can send UIs which you want me to code, suggestions may not be restricted to any specific tech. Let me know the tech stack in which you want it, if I can pull it off, I will surely post it for you guys.
Like, share, and subscribe if you want to see more of such videos.
follow me on Instagram:
devsedated
follow me on Twitter:
DevSedated
Let's build a strong community and peer learn coding, a great career, and an income source.
Song: BIMINI - No Way (with Avi Snow) [NCS Release]
Music provided by NoCopyrightSounds
Free Download/Stream: ncs.io/noway
Watch: AT/youtube
Переглядів: 325

Відео

How to dockerize a next js application
Переглядів 627День тому
In this video, we will see how to dockerize a next js application in two different scenarios. Link to latest dockerfile: github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile Do checkout my previous videos on how to handle global state management in any react based frameworks and using sentry for error logging. How to use Sentry in React-Native for monitoring crashes and errors ...
How to configure Sentry in React-Native for capturing Native Errors correctly!
Переглядів 6314 днів тому
In this video, we will see how to initialise sentry natively in a react-native application for monitoring crashes and errors remotely that happens before the js layer is loaded. Do checkout my previous videos on how to handle global state management in any react based frameworks. How to use Sentry in React-Native for monitoring crashes and errors ua-cam.com/video/DCZKohUHqy0/v-deo.html Implemen...
How to use Sentry in React-Native for monitoring crashes and errors
Переглядів 12421 день тому
In this video, we will see how to setup sentry in a react-native application for monitoring crashes and errors remotely. Do checkout my previous videos on how to handle global state management in any react based frameworks. Implement and persist global state using zustand: ua-cam.com/video/Ksq-AqXyqhY/v-deo.html Implement global state using redux: ua-cam.com/video/u6RW0AqErho/v-deo.html Persist...
How to use zustand for global state management in any react framework in typescript.
Переглядів 88Місяць тому
In this video, we will see how to manage and persist global state state using redux in any react based frameworks like next js or react native using typescript. Do checkout my previous videos on how to do the same using redux. Implement redux state: ua-cam.com/video/u6RW0AqErho/v-deo.html Persist redux state: ua-cam.com/video/Dip89NRUhuY/v-deo.html Comment down what else you would like to see, ...
How to persist redux state in next js and react-native projects
Переглядів 140Місяць тому
In this video, we will see how to persist redux state in react/nextjs and react-native project. Comment down what else you would like to see, I am always open to suggestions. You guys can send UIs which you want me to code, suggestions may not be restricted to any specific tech. Let me know the tech stack in which you want it, if I can pull it off, I will surely post it for you guys. Like, shar...
How to use redux for state management in next js and react-native projects
Переглядів 91Місяць тому
In this video, we will see how to implement global state management in react/nextjs and react-native project. Comment down what else you would like to see, I am always open to suggestions. You guys can send UIs which you want me to code, suggestions may not be restricted to any specific tech. Let me know the tech stack in which you want it, if I can pull it off, I will surely post it for you gu...
How to use path alias in React Native and get rid of relative imports
Переглядів 7 тис.3 роки тому
In this video, we will see how to use path alias in your React Native project and saving yourself from long and complex relative imports. PS: This is my first trying to use my voice in a video, do let me know your thoughts in the comments guys, it will be much appreciated no matter good or bad. Why React Native? Well, I find it the coolest framework to create a cross-platform app, and if you ha...
Basic Chat UI - Using Styled components - React Native - Speed Code Video #10
Переглядів 6243 роки тому
In this video, we will see how to create a basic chat UI using react native for both android and ios. We will also be using styled-components. Source Code:- github.com/kamolesh97/Basic-Chat-UI-Demo-App Why React Native? Well, I find it the coolest framework to create a cross-platform app, and if you have a little background in javascript you can hop in to create enterprise-grade android and ios...
IOT App Home UI - Part 2 - Using Styled components - Speed Code Video #11
Переглядів 3863 роки тому
This is part 2 of the previous video where we create a Home page for an IoT app using react native for both android and ios. We are also using styled-components. Do check out part 1 before this video. Source Code:- github.com/kamolesh97/IOT-App-Home-UI-Demo-App Why React Native ? Well, I find it the coolest framework to create a cross-platform app, and if you have a little background in javascr...
IOT App Home UI - Part 1 - Using Styled components - Speed Code Video #10
Переглядів 4783 роки тому
In this video, we'll learn how to create a Home page for an IOT app using react native for both android and ios. We are also using styled-components. The video is divided into 2 parts, 2nd part will be released soon. Why React Native ? Well I find it coolest frame work to create cross-platform app, and if you have a little background of javascript you can hop in to create enterprise grade andro...
Basic Ecommerce App Product Page UI - Using React Native - Speed Code Video #9
Переглядів 1,6 тис.3 роки тому
In this video, we'll learn how to build a product page for an e-commerce app using react native for both android and ios. This is a continuation of the basic home page UI video. Source Code:- github.com/sedateddev/Basic-Ecommerce-UI-Demo-App Why React Native ? Well I find it coolest frame work to create cross-platform app, and if you have a little background of javascript you can hop in to crea...
Basic Ecommerce App Home UI - Using React Native - Speed Code Video #8
Переглядів 1,4 тис.3 роки тому
This is a very basic home page UI for a general Ecommerce app using react native for both android and ios Source Code:- github.com/sedateddev/Basic-Ecommerce-UI-Demo-App Why React Native ? Well I find it coolest frame work to create cross-platform app, and if you have a little background of javascript you can hop in to create enterprise grade android and ios apps. So If I can contribute towards...
Podcast App Home UI - Using React Native - Speed Code Video #7
Переглядів 9873 роки тому
In this video i'll be coding out a Home page UI of a Podcast App, it's an interesting one, make sure to check out the whole video 😀 Source Code:- github.com/sedateddev/Podcast-App-Home-UI-Demo-App Why React Native ? Well I find it one of the coolest frame work to create cross-platform app, and if you have a little background of javascript you can hop in to create enterprise grade android and io...
Blogging App Home UI - Using React Native - Speed Code Video #6
Переглядів 1,8 тис.3 роки тому
Blogging App Home UI - Using React Native - Speed Code Video #6
Book App Home UI - Using React Native - Speed Code Video #5
Переглядів 3 тис.3 роки тому
Book App Home UI - Using React Native - Speed Code Video #5
Furniture Ecommerce Home UI - Using React Native - Speed Code Video #4
Переглядів 2,6 тис.4 роки тому
Furniture Ecommerce Home UI - Using React Native - Speed Code Video #4
How To Clone Tiktok Home UI - Using react native - Speed Code Video #3
Переглядів 2,4 тис.4 роки тому
How To Clone Tiktok Home UI - Using react native - Speed Code Video #3
Neumorphic Weather App UI - Using React Native - Speed Code Video #2
Переглядів 2,4 тис.4 роки тому
Neumorphic Weather App UI - Using React Native - Speed Code Video #2
Simple Login UI - Using React Native - Speed Code Video #1
Переглядів 1,5 тис.4 роки тому
Simple Login UI - Using React Native - Speed Code Video #1

КОМЕНТАРІ

  • @francoisotis3560
    @francoisotis3560 2 години тому

    The font is too large, your code is still readable...

  • @aryan.prince
    @aryan.prince 2 дні тому

    just watched a couple of your videos and they're great! here's a quick tip to make the videos much nicer to watch for viewers: consider zooming into vscode so that it's more readable in general, and especially on mobile (see how zoomed in the code is on fireship's channel for example)

    • @TheSedatedDev
      @TheSedatedDev 2 дні тому

      Hey, thank you so much for your feedback :) I’ll definitely keep it in mind and make sure to follow it in my next video.

  • @jiamianqishiooo
    @jiamianqishiooo 2 дні тому

    I have a question. If u can't access cookie storage in middleware, how are you gonna check for the JWT or any token?

    • @TheSedatedDev
      @TheSedatedDev 2 дні тому

      Hey, sorry If I was not clear in the video, but what I said was you cannot access session or local storage, but you can access cookies.

    • @jiamianqishiooo
      @jiamianqishiooo День тому

      @@TheSedatedDevoh, thank you for clarifying that!

  • @shiftain3436
    @shiftain3436 2 дні тому

    same thing could've been done with BrowserRouter? PS: I am totally new with react so this thing you've done is just new for me

    • @TheSedatedDev
      @TheSedatedDev 2 дні тому

      Hey thanks for the question, 1. BrowserRouter is not used in next js framework for routing, next js has it's own way of handling routing using pages or app router. 2. BrowserRouter handles the logic in client side and can sometimes momentarily expose protected routes as it waits for the app to render ( in my experience, not sure if it can be mitigated ). 3. Middleware handles the protection completely on server side and executes much before in the lifecycle of a request, making it much more secure as it doesn't have to wait for the app to render. Hope, this helps.

  • @rahuldubey3060
    @rahuldubey3060 4 дні тому

    Nice video, I can now easily create a docker image of my next js project

  • @rahuldubey3060
    @rahuldubey3060 26 днів тому

    nicely explained!!

  • @PeterOdejobi-x1j
    @PeterOdejobi-x1j Місяць тому

    Thank you! This really helped alot.

  • @rahuldubey3060
    @rahuldubey3060 Місяць тому

    Nicely explained

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

    thanks brow

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

    Great video, but i have a feedback, i'm not a native english speaker, so the background song makes it harder for non natives to fully understand

  • @ZzZz-dr7uq
    @ZzZz-dr7uq 2 роки тому

    finally a solution to my problems :D

  • @marwenselmi4230
    @marwenselmi4230 2 роки тому

    name of music please

  • @rahuldubey3060
    @rahuldubey3060 2 роки тому

    Very helpful video

  • @muhamadarifin4667
    @muhamadarifin4667 2 роки тому

    I'm having trouble changing from js to tsx

  • @muhamadarifin4667
    @muhamadarifin4667 2 роки тому

    nice app, is there a typescript version?

  • @hijuliansosa
    @hijuliansosa 2 роки тому

    Thanks!

  • @weirddev
    @weirddev 2 роки тому

    This video deserve a Million views. Searching it for a long time

  • @jamesonvparker
    @jamesonvparker 3 роки тому

    Hi, do you do tutorials for this? I’d love to learn from you.

  • @ddikodroid
    @ddikodroid 3 роки тому

    awesome!

  • @nsdog
    @nsdog 3 роки тому

    Cool!!!! 👍👍👍

  • @pakahoevansyli5811
    @pakahoevansyli5811 3 роки тому

    Many Thanks. 😬😬

  • @quentinblanche9073
    @quentinblanche9073 3 роки тому

    Hello and well done for your UI ! I'm having a problem with react-native-neu-element, everything seems to work fine but I get a error when I use 'concave' (in my NeuView) Have you ever had this problem ? "Invariant Violation: requireNativeComponent: "BVLinearGradient" was not found in the UIManager." I'm on Android, using EXPO, and everything is up to date. (Even LinearGradient)

  • @pakahoevansyli5811
    @pakahoevansyli5811 3 роки тому

    Amazing. Thank you a lot.

  • @pakahoevansyli5811
    @pakahoevansyli5811 3 роки тому

    Thank you a lot.

  • @pakahoevansyli5811
    @pakahoevansyli5811 3 роки тому

    Share your code, please. Your code is helping me too much. Thank you for the knowledge.

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Thank you for your response, Source code will be shared in the next part of the video.

    • @pakahoevansyli5811
      @pakahoevansyli5811 3 роки тому

      @@TheSedatedDev you are my hero. ❤️❤️

  • @denipratama3783
    @denipratama3783 3 роки тому

    thank you for the knowledge you provide and is there no sourchcode

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Thank you for your response, Source code will be shared in the next part of the video.

  • @deegrains9363
    @deegrains9363 3 роки тому

    Can you convert from extend Component to const?

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Yes, soon I'll be switching to functional components 👍

    • @deegrains9363
      @deegrains9363 3 роки тому

      ​@@TheSedatedDev Hope quickly, thanks for your support, great tutor

  • @ahmedchebbi5921
    @ahmedchebbi5921 3 роки тому

    awesome 😎👍👍

  • @TK-vz4od
    @TK-vz4od 3 роки тому

    thanks!

  • @daniyorboltaev1902
    @daniyorboltaev1902 3 роки тому

    Good Job keep up bro!

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Thankyou So Much Brother ! means alot :)

  • @harishreddy8247
    @harishreddy8247 3 роки тому

    Hi sir This is harish make one video from scratch how to work on reactnative what language need to work on and tools

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      I will definitely be making such videos, don't worry :)

  • @harishreddy8247
    @harishreddy8247 3 роки тому

    Super video

  • @asrarnoorani4724
    @asrarnoorani4724 3 роки тому

    Please make some social apo clone like instagram.... You will more faster

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Yes, I'll surely be uploading more such videos :)

  • @asrarnoorani4724
    @asrarnoorani4724 3 роки тому

    Wow really cool....... Subscribe you❤️❤️

  • @therevealmusic
    @therevealmusic 3 роки тому

    good instead of speed coding better you explain so that we can together

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Yes! I have some good plans for future, wherein i'll be uploading well explained tutorials, stay notified :)

  • @ankurdatta4040
    @ankurdatta4040 3 роки тому

    You are soooooooo awsm! You're gonna get really popular in the months to come

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Heyy !! Thankyou so much for such a kind comment, means alot :)

  • @soumyaranjanpatra7345
    @soumyaranjanpatra7345 3 роки тому

    Hi bro How you will edit this app intro ? Please tell me

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Hey Soumya, there are lots of templates available for after effects and fcpx, you can use them 😀

  • @therevealmusic
    @therevealmusic 3 роки тому

    Good work ...but at least explain instead of speed coding

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      Hey, thanks for your feedback, I'll soon be starting with in depth videos, stay tuned :)

  • @rayanabid1303
    @rayanabid1303 3 роки тому

    Are you using react native cli or expo cli AwesomeVideo BTW

    • @TheSedatedDev
      @TheSedatedDev 3 роки тому

      I am inclined towards react native cli, gives me better control over the app, expo is equally amazing though :)

  • @yashkhona648
    @yashkhona648 4 роки тому

    Pixel perfect!!

  • @fidado5427
    @fidado5427 4 роки тому

    Hi sir, can slow down a bit the speed code. kinda hard to follow along the process :(

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      Hey, I am really sorry about that, I will have this in my mind in further videos, you can try 0.25x speed and let me know if it works out :)

  • @yashkhona648
    @yashkhona648 4 роки тому

    Power!!!

  • @ketansinh3069
    @ketansinh3069 4 роки тому

    I liked the images used for sign in. Can I use that images in one of my app?

  • @pedroluis4004
    @pedroluis4004 4 роки тому

    Amazing video man, keep doing videos about react native please!

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      Hey, thank you so much man, means a lot, and offcourse I will continue with such videos, but not limited to it, much more to come. 😀😀

  • @deepakjha2171
    @deepakjha2171 4 роки тому

    Is it possible to create the same design for android devices ?

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      Hey, yes since i am using a package called react-native-neu-element, it supports both android and ios, you can clone the git repo, and incase you face any problem, just let me know, i'll help you out, repo link is in the description, thanks and cheers, happy coding 😀😀

    • @deepakjha2171
      @deepakjha2171 4 роки тому

      @@TheSedatedDev i create the app from your video but guess it still not working.

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      Did you clone my repository ? what's the issue you are facing ? let me know in detail so that i can help you out

  • @Hams645
    @Hams645 4 роки тому

    In Simple words, this is Awww. Amazing work man. I am a beginner and you just left me in Awww. #inspirationalwork

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      I am Happy to hear that! thanks for your kind words brother, stay tuned for much more amazing stuff 😀

  • @inahr9734
    @inahr9734 4 роки тому

    How did you the intro video? Amazing!

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      Hey Ina, there are lots of templates available for after effects and fcpx, you can use them 😀

  • @yashkhona648
    @yashkhona648 4 роки тому

    Neumorphic on point! Good use of colors

    • @TheSedatedDev
      @TheSedatedDev 4 роки тому

      Hey, thankyou so much, means alot 😀😀