CodeDunks
CodeDunks
  • Видео 56
  • Просмотров 692 694
Technologies I'm Learning in 2023
In this video, I discuss the technologies and frameworks that I plan to learn in 2023. These include react, web development fundamentals such as HTML, CSS, and JavaScript, typescript, python, svelte, solid.js, Astro, next.js, remix, and a variety of libraries including trpc and prisma. I also mention my plans to get more familiar with cloud platforms and infrastructure, and to continue learning about machine learning and artificial intelligence. I'm excited to dive into these topics and share my progress and insights with you along the way.
Просмотров: 935

Видео

MobX Tutorial with React and Typescript
Просмотров 20 тыс.2 года назад
In this video we will be looking into MobX, a state management library and setting up a quick project with React and Typescript. MobX: mobx.js.org/README.html
GraphQL Fragments Tutorial
Просмотров 3,9 тыс.2 года назад
In this video, we will be going over GraphQL Fragments in a quick tutorial. One of my co-workers recently helped shine a light on how to really get the most out of GraphQL and that involves fragments. Fragments are especially useful with React due to how it allows you to follow the same tree structure in which React renders its components. We are going to start a simple full-stack project using...
Turborepo Tutorial | Part 2 - Testing, Deployment, and remote cacheing.
Просмотров 18 тыс.3 года назад
We will be looking at the newly acquired library by Vercel known as Turborepo. In this tutorial we will be focusing on the initial project sharing configuration for 2 Next.js Frontend apps, along with a Node.js server all using Typescript. We will look how to setup Jest for our 2 projects, as well as setup github actions. We will also look how to deploy a project to vercel, and finally how to u...
Turborepo Tutorial | Part 1 - Typescript, Eslint, Tailwind, Husky shared config setup in a Monorepo
Просмотров 62 тыс.3 года назад
We will be looking at the newly acquired library by Vercel known as Turborepo. In this tutorial we will be focusing on the initial project sharing configuration for 2 Next.js Frontend apps, along with a Node.js server all using Typescript. We will focus on creating a shared base typescript config, as well as a shared one for the Next.js projects and another config for the server app. We will al...
Setting up Tailwind with Styled Components using Twin.macro in Next.js
Просмотров 15 тыс.3 года назад
In this video, we will be looking at how to set up tailwind css with styled-components using a helper library known as twin.macro tailwind: tailwindcss.com/ styled-components: styled-components.com/ twin.macro: github.com/ben-rogerson/twin.macro I really enjoyed setting this library up because you get the best of both worlds. The flexibility in using tailwind classes as well as the extraction o...
Terraform Tutorial | Setup with Docker, AWS, and Terraform Cloud
Просмотров 4,4 тыс.3 года назад
In this tutorial we are going to be covering Terraform, an infrastructure as code solution that allows you to define resources and infrastructure for many different types of providers. This allows extensive decoupling and source of truth in case you ever need to change hosting providers. In this video we will be looking at how to install and use the terraform CLI, as well as integrate it with t...
Tailwind CSS Tutorial with Next.js and Typescript | Part 2 - Usage and JIT Mode
Просмотров 3,8 тыс.3 года назад
Tailwind CSS has recently hit 1,000,000 weekly downloads on npm and I decided it was time to check out the interesting CSS framework. In this video, we will look at how to use the tailwind CSS framework different main concepts. These being the utility first built-in classes, the responsive design work, and accessing states while using the framework. We will also look at how to set up Just in Ti...
Tailwind CSS Tutorial with Next.js and Typescript | Part 1 - Setup and Install
Просмотров 10 тыс.3 года назад
Tailwind CSS has recently hit 1,000,000 weekly downloads on npm and I decided it was time to check out the interesting CSS framework. In this video we will look at some pros and cons of the Tailwind CSS library, as well as look at different ways to configure a Next.js application using Tailwind and Typescript. We will manually set this up so that we can in-depth go over what is really happening...
Next.js 11 setup with Material UI Version 5 | Part 2 - Styled-Components
Просмотров 9 тыс.3 года назад
Some of our favorite libraries have gone through some major upgrade versions. In this video, I look at how to set up the new Next.js version 11 with Material UI version 5. There are 2 new ways to set up Material UI version 5 and in this video, we will look at how to set it up using styled-components and the styled-components engine. Since emotion is pretty similar to styled-components we will n...
Next.js 11 setup with Material UI Version 5 | Part 1 - Emotion
Просмотров 31 тыс.3 года назад
Some of our favorite libraries have gone through some major upgrade versions. In this video, I look at how to set up the new Next.js version 11 with Material UI version 5. There are 2 new ways to set up Material UI version 5 and in this video, we will look at how to set it up using the library called emotion. We will also do a quick tutorial on emotion so that If you are unfamiliar with it, we ...
NextAuth Tutorial | Part 4 - React Query
Просмотров 7 тыс.3 года назад
We will be looking at how to setup authentication in your next.js application using the open-source library known as NextAuth.js This library is a pleasure to use and really makes setting up authentication in your next.js application a breeze. In this video we are going to look at how to integrate and utilize react-query with next-auth. Starter project github: github.com/leoroese/nextauth-tutor...
NextAuth Tutorial | Part 3 - Custom pages, callbacks, and events
Просмотров 19 тыс.3 года назад
We will be looking at how to setup authentication in your next.js application using the open-source library known as NextAuth.js This library is a pleasure to use and really makes setting up authentication in your next.js application a breeze. In this video we are going to look at how to setup a custom login page instead of using the default next-auth page given to us. We will also look at some...
NextAuth Tutorial | Part 2 - Social and Credentials Providers
Просмотров 10 тыс.3 года назад
We will be looking at how to setup authentication in your next.js application using the open-source library known as NextAuth.js This library is a pleasure to use and really makes setting up authentication in your next.js application a breeze. In this video we are going to look at how to setup a social login connection using Github as well as the old school username and password setup. Starter ...
NextAuth Tutorial | Part 1 - Setup and Email Provider
Просмотров 34 тыс.3 года назад
We will be looking at how to setup authentication in your next.js application using the open-source library known as NextAuth.js This library is a pleasure to use and really makes setting up authentication in your next.js application a breeze. In this video we are going to look at how to install and setup the library, as well setting up the Email passwordless provider which I believe is the nex...
Authentication and Authorization Setup with Okta
Просмотров 48 тыс.3 года назад
Authentication and Authorization Setup with Okta
MaterialUI Flexbox & Grid Tutorial
Просмотров 16 тыс.3 года назад
MaterialUI Flexbox & Grid Tutorial
React Hook Form V7 with Material UI and Typescript Tutorial | Part 5 -- Testing
Просмотров 5 тыс.3 года назад
React Hook Form V7 with Material UI and Typescript Tutorial | Part 5 Testing
React Hook Form V7 with Material UI and Typescript Tutorial | Part 4 -- Complex Forms with State
Просмотров 7 тыс.3 года назад
React Hook Form V7 with Material UI and Typescript Tutorial | Part 4 Complex Forms with State
React Hook Form V7 with Material UI and Typescript Tutorial | Part 3 -- useFieldArray
Просмотров 14 тыс.3 года назад
React Hook Form V7 with Material UI and Typescript Tutorial | Part 3 useFieldArray
React Hook Form V7 with Material UI and Typescript Tutorial | Part 2 -- FormProvider
Просмотров 16 тыс.3 года назад
React Hook Form V7 with Material UI and Typescript Tutorial | Part 2 FormProvider
React Query Setup with Typescript, GraphQL, and GraphQL Codegen
Просмотров 9 тыс.3 года назад
React Query Setup with Typescript, GraphQL, and GraphQL Codegen
React Query Tutorial with Typescript | Part 5 -- Next.js Server Side Rendering
Просмотров 12 тыс.3 года назад
React Query Tutorial with Typescript | Part 5 Next.js Server Side Rendering
React Query Tutorial with Typescript | Part 4 -- Paginated, Infinite Queries
Просмотров 5 тыс.3 года назад
React Query Tutorial with Typescript | Part 4 Paginated, Infinite Queries
React Query Tutorial with Typescript | Part 3 -- QueryClient
Просмотров 3,8 тыс.3 года назад
React Query Tutorial with Typescript | Part 3 QueryClient
React Query Tutorial with Typescript | Part 2 -- Mutations
Просмотров 14 тыс.3 года назад
React Query Tutorial with Typescript | Part 2 Mutations
React Query Tutorial with Typescript | Part 1 -- Queries
Просмотров 25 тыс.3 года назад
React Query Tutorial with Typescript | Part 1 Queries
Apollo Federation Setup | Part 2 -- Managed Federation
Просмотров 2,5 тыс.3 года назад
Apollo Federation Setup | Part 2 Managed Federation
Apollo Federation Setup | Part 1 -- Federation setup
Просмотров 6 тыс.3 года назад
Apollo Federation Setup | Part 1 Federation setup
Docker, Docker-Compose Quick Setup Tutorial
Просмотров 6353 года назад
Docker, Docker-Compose Quick Setup Tutorial

Комментарии

  • @hiperb0re0
    @hiperb0re0 15 дней назад

    Great tutorial but how about setting up for an expo react native app?

  • @_kadirmetin
    @_kadirmetin 16 дней назад

    Thanks for the video 🙏

  • @prikshitgoyal714
    @prikshitgoyal714 3 месяца назад

    Thank you 👍🏻

  • @bilkisuismail6096
    @bilkisuismail6096 4 месяца назад

    Thank you

  • @ChrisDebevec
    @ChrisDebevec 4 месяца назад

    This was helpful especially to start doing some basic terraform and understand how to run this in ci/cd environment. But the 1 additional piece i wish this included was how to get the docker container on the ec2 that's deployed.

  • @behysharif6601
    @behysharif6601 4 месяца назад

    Thank you for the video. Could you please create a video which shows how to create for with mui radio buttons and how to register them? And also how to render a textbox on selecting one of radios?

  • @interceptorghost1149
    @interceptorghost1149 5 месяцев назад

    This video makes me level up my software engineering knowledge, nice video

  • @taghavi_script
    @taghavi_script 5 месяцев назад

    thanks man, i enjoyed

  • @PartneredAdmin
    @PartneredAdmin 5 месяцев назад

    Hi how to add a new app using a command e.g. npx create-payload-app@latest as an app to a turborepo? I can 't find this anywhere clearly? So...is it just delete the node_modules and copy/move all the new app files to /apps and add name and version to the workspaces?

  • @MrPeepa
    @MrPeepa 5 месяцев назад

    Exactly what i was looking for! You've just earned a subscriber my dude!

  • @IntegratorDima
    @IntegratorDima 5 месяцев назад

    Great one, thanks a lot.

  • @VINODMAKKENA-e7q
    @VINODMAKKENA-e7q 6 месяцев назад

    This is helpful. Thank you

  • @VINODMAKKENA-e7q
    @VINODMAKKENA-e7q 6 месяцев назад

    Very helpful. Thank you

  • @Roi007leaf
    @Roi007leaf 7 месяцев назад

    Can we get a link to the code/repo? for further in depth look?

  • @betheleyo2701
    @betheleyo2701 7 месяцев назад

    Good work, but you missed explaining all the permissions in an aws iam policy file that is needed to be able to run a successful "serverless deploy" command, it took me a while to have that set up

  • @andrewshaban2888
    @andrewshaban2888 7 месяцев назад

    Thank you. Clear and concise. Subscribed!

  • @yuriyfse6555
    @yuriyfse6555 7 месяцев назад

    Men, where is the code?!

  • @shmuelroth4995
    @shmuelroth4995 8 месяцев назад

    Hi I know you uploaded it a long ago, the think I liked is the usig types in useFieldArray. The problem is that in my form I have useFieldArray inside useFieldArray and in this case its doesnt recognize the type

  • @mugdhawadhokar1071
    @mugdhawadhokar1071 8 месяцев назад

    hey great video. Here I am confuse about invcocation API, why does it generates and can we avoid it from generating ?

  • @DhiegoSpider
    @DhiegoSpider 8 месяцев назад

    In Next 13, I have a list of products with categories. I want to put these categories into constants so I can check if a product belongs to one category or another. For example: if (product.id === CONSTANTS.DRINKS) { //do something with the product if it is from the drinks category } These constants would be populated upon a request to an external API. They must be filled in throughout the code and will be used in both common javascript files and React components. Is there a way to do this in the next 13? Considering that there are files that are rendered on the server and other files that use RTK that will be rendered on the client. Is there another approach to distributing these constants throughout the code? I tried to make a request to the API to fill in the constants, but as there are files that are rendered on the server and others on the client, it didn't work as I expected. They must only be filled once and all code will be able to see this value filled.

  • @MG-wx8yx
    @MG-wx8yx 8 месяцев назад

    Very difficult to follow along.

  • @valentingorrin4541
    @valentingorrin4541 8 месяцев назад

    amazing thank you so much

  • @limpep
    @limpep 9 месяцев назад

    s3 triggers, schedulers

  • @HosseinBajan
    @HosseinBajan 9 месяцев назад

    It was the best node environment that I have seen so far, it was really great, thank you

  • @purchtechnologies3414
    @purchtechnologies3414 10 месяцев назад

    This is solid. Thanks

  • @LodkaGG
    @LodkaGG 10 месяцев назад

    Thank you very much man, you teaching so clearly, that's cool for sure

  • @pro4v
    @pro4v 10 месяцев назад

    You did a great job explaining, thank you

  • @marcpanther8515
    @marcpanther8515 10 месяцев назад

    CRA didn't bother with devDependencies because webpack knows to only include the required items in the final build. devDependencies only matter if you are building npm packages, I think.

  • @blackbeans3112
    @blackbeans3112 10 месяцев назад

    How to import styled components in SSR components in next js it is possible?

  • @AdeshSinghchandel
    @AdeshSinghchandel 10 месяцев назад

    Can you help me i try to integrate okta openid auth with private public key how can i do that , when using in react getting error 401 in both react and node js can you guide me usign public key and private key with react and node js i am stuck and no correct documents found

  • @anonymousnoob3660
    @anonymousnoob3660 11 месяцев назад

    Why is the pages : { newUser : '/onboarding' } not working in the new app router?

    • @noahscode
      @noahscode 10 месяцев назад

      if you have nextauth url in your .env it can cause issues

    • @anonymousnoob3660
      @anonymousnoob3660 10 месяцев назад

      @@noahscode so what can I do instead?

  • @bequitedev
    @bequitedev 11 месяцев назад

    Hey man , thank you for your help 🎉❤

  • @romaghorjomeladze439
    @romaghorjomeladze439 Год назад

    there is a strange behaviour in the code. If you put console.log in for example resolver function or service, the api endpoint is not returning response. So if you put console.log in getAllBooks resolver function and run books query from playground, it won't return any response (it's spinning and response isn't returned). If you remove the console.log, than there won't be any issue.

  • @romaghorjomeladze439
    @romaghorjomeladze439 Год назад

    I think it would be great to add request validation, error handling and JWT authorisation in this example repo for more completeness

  • @romaghorjomeladze439
    @romaghorjomeladze439 Год назад

    The best content. I love it 🤩

  • @baremetals
    @baremetals Год назад

    Exactly what I needed, excellent

  • @shineLouisShine
    @shineLouisShine Год назад

    6:12 - what was that?! - how did you do that?? Not worth an explanation? What else are you doing without explaining? Nevermind. Thanks anyway..

  • @dungam9402
    @dungam9402 Год назад

    only one thing to complain please zoom the screen bigger :'(

  • @Hellbending
    @Hellbending Год назад

    Guys… please for the love of everything don’t use a linter for formatting 🤣🤣😓😓

  • @bencorbett1867
    @bencorbett1867 Год назад

    Thank you! Much help so far

  • @tony3fk
    @tony3fk Год назад

    Thanks for this! It's just what I was looking for 🤩

  • @kezevraanwar2
    @kezevraanwar2 Год назад

    Great vid exactly what I need 👍🏾

  • @dimitrisqq
    @dimitrisqq Год назад

    Hey Leo thanks for the video! I have 2 questions: 1) how does someone changes that "?" to "✅" and I have prepared a template (GitHub repo) with JS/TS, Playwright, GSAP. I want to create a CLI, which actually will "create" a template based on user input: 1. JS or TS? 2. Install GSAP? 3. Install Playwright? The thing is, that I don't know how to create it: from within the CLI or fetch the files based on user input, example jsconfig.json or tsconfig.json with options? Also common files like .prettierrc.json, .eslintrc.json etc.. If I create it from within (for example having a folder "template" with "common", "javascript", "typescript" subfolders and pick the files needed, i'm afraid that It will be very difficult to debug only @ 1 place (I suppose I will have to debug my end-template and then go and "copy" "paste" parts of code inside my CLI's code & templates folder). But if I "fetch" files then the CLI is not actually versioning correctly since it will only fetch the latest files. I'm superconfused...

  • @Hamsterhomka
    @Hamsterhomka Год назад

    Great presentation of the material and very useful content. Thank you!

  • @tarunhasija4751
    @tarunhasija4751 Год назад

    After investing over 48 hours into learning about serverless from various sources and blogs, I was surprised to find that this video managed to encapsulate the entire topic in just under 30 minutes. Outstanding job, Leo!

  • @avidcaster
    @avidcaster Год назад

    Your skill in creating excellent videos is commendable.

  • @markcaz
    @markcaz Год назад

    Hard to follow this. The explanation of why you set teamHistory to true, and what that does, is unclear. Later in video you remove something to show that observables no longer work, but you don’t show or explain what you did. Frustrating. I was hoping this would teach me what I need to know, but there are too many confusing things about it

    • @medelhedihaddar7149
      @medelhedihaddar7149 7 месяцев назад

      I think this is the change he made to show the importance of the observer <<< export default observer(Roster) ===> export defaul Roster >>>

  • @bad_guru_
    @bad_guru_ Год назад

    Really good video. I have learned a lot!!!

  • @ngoclam98242
    @ngoclam98242 Год назад

    sorry but can you explaint, why we use "./../packages/ui/**/*.{ts,tsx}" not "./packages/ui/**/*.{ts,tsx}"

  • @ВиталийПугач-к8ю

    awesome!