PortEXE
PortEXE
  • 129
  • 1 420 829
Building a React Quiz App with ChatGPT: The Ultimate Pair-Programmer
In this video I go over how you can use ChatGPT to become a more productive developer. Instead of using ChatGPT to write your code for you (please don't), you can use it to reduce cognitive load, write boilerplate, and bounce ideas off of. Here I walk you through building a quiz app with React, using ChatGPT as a copilot.
#chatgpt #chatgpttutorial #chatgptcoding
0:00 Intro
2:15 Defining the architecture with ChatGPT
6:41 Generating the app content
13:40 Setting up the React project
17:10 Creating the components
20:35 Displaying categories
23:40 Using a UI library
28:00 Choosing categories
29:50 The Quiz component
45:30 Displaying the results
52:50 Conclusion
---
👀 Follow Me:
Twitter ➔ portexe
Instagram ➔ port.exe
GitHub ➔ github.com/portexe
Twitch ➔ www.twitch.tv/portexe
Facebook ➔ portexe
Website ➔ www.portexe.com/
zhlédnutí: 1 586

Video

Supercharge Your Developer Workflow: How I Use Raycast to Boost Productivity
zhlédnutí 9KPřed rokem
In this video, I share how I use Raycast to enhance my developer workflow and boost productivity. Raycast is a powerful productivity tool that helps me streamline my workday by providing quick access to my most frequently used apps, files, and commands. I'll walk you through my favorite features and show you how to use Raycast to supercharge your own workflow. There are also some amazing upcomi...
A Non-Programmer Interviews A Programmer - Hot Ones Challenge
zhlédnutí 380Před rokem
I take on the Hot Ones challenge with Chris as he interviews me. This one is spicy. #hotoneschallenge #webdevelopment #programming Check out Chris' Instagram: the_wandering_chris 👀 Follow Me: Twitch ➔ www.twitch.tv/portexe Twitter ➔ portexe Instagram ➔ port.exe GitHub ➔ github.com/portexe Facebook ➔ portexe Website ➔ www.portexe.com/
Coding A Guitar Metronome App Live
zhlédnutí 903Před rokem
This video was originally a live Twitch stream. Follow me on Twitch for more live coding content! #webdevelopment #PortEXE #MetronomeApp Code: github.com/portexe/guitar-metronome-trainer 👀 Follow Me: Twitch ➔ www.twitch.tv/portexe Twitter ➔ portexe Instagram ➔ port.exe GitHub ➔ github.com/portexe Facebook ➔ portexe Website ➔ www.portexe.com/
Reviewing My Subscribers Code
zhlédnutí 1,3KPřed 2 lety
Something I have always wanted to do is review my subscribers' code! I managed to get enough volunteers to do a live stream. This video is the result of that. #CodeReview #PortEXE #WebDev Thanks to the following folks who volunteered their code! 🔗 github.com/jlarky 🔗 github.com/VishwaGauravIn 🔗 github.com/mikefox17 🔗 github.com/AndrewTownsley 🎵 Music by Moon Wash. songfuze.com/artist/moonwash 👀...
I Code Wordle in Vanilla Javascript Live
zhlédnutí 1,7KPřed 2 lety
This video was compiled from two separate Twitch live streams that I did where I decided to stream myself coding wordle in Vanilla JavaScript. #Wordle #PortEXE #WebDev 🎵 Music by Moon Wash. songfuze.com/artist/moonwash 👀 Follow Me: Twitch ➔ www.twitch.tv/portexe Twitter ➔ portexe Instagram ➔ port.exe GitHub ➔ github.com/portexe Facebook ➔ portexe Website ...
This Web Development Article Is Odd
zhlédnutí 942Před 2 lety
This video was taken from a live stream where I was discussing an... interesting article that I found on Webflow's blog. #Webflow #PortEXE #WebDevelopment 🎵 Music by Moon Wash. songfuze.com/artist/moonwash Here is a link to the article: webflow.com/blog/web-design-vs-web-development 👀 Follow Me: Twitter ➔ portexe Instagram ➔ port.exe GitHub ➔ github.com/portexe Facebo...
Every JavaScript Array Method Explained With Examples
zhlédnutí 6KPřed 2 lety
In this video I teach you every single one of the JavaScript array methods and provide examples for each. 0:00 Intro 2:02 reverse 2:35 push 3:23 unshift 3:54 includes 5:00 isArray 5:32 from 6:36 of 7:01 indexOf 7:48 lastIndexOf 8:39 toString 9:15 toLocaleString 10:04 join 10:52 pop 11:54 shift 12:25 slice 13:52 forEach 15:08 find 16:18 findIndex 16:58 some 18:09 every 19:07 filter 20:07 map 21:...
Coding a Turn-Based Battle Game With React Only
zhlédnutí 18KPřed 2 lety
Let's build a turn-based battle system with React and NO 3rd party libraries! 0:00 Intro 1:59 Initialize project 3:50 App structure 5:58 Start menu 9:56 Battle component 11:26 Player summary 28:55 Battle menu 34:25 Discussing battle sequence concepts 36:22 Character sprites 41:00 Battle announcer 50:00 Damage calculations 52:24 AI opponent 55:00 Building the battle sequence 1:21:48 Winning the ...
My Review of the New JavaScript Course From Dan Abramov (Just JavaScript)
zhlédnutí 12KPřed 3 lety
I just wanted to do a quick review on a new JavaScript course that I found to be really interesting #JustJavaScript #PortEXE 🎵 Music by Moon Wash. songfuze.com/artist/moonwash 🔗Course: justjavascript.com/ 🔗Dan Abramov: dan_abramov 🔗Maggie Appleton: Mappletons Follow Me: Twitter ➔ portexe Instagram ➔ port.exe GitHub ➔ github.com/portexe Facebook...
Everything I Do When I Start A New React Project
zhlédnutí 4,9KPřed 3 lety
Everything I Do When I Start A New React Project
Create A Toast Notification Component With React
zhlédnutí 16KPřed 3 lety
Create A Toast Notification Component With React
Build and Document React Components With Storybook
zhlédnutí 90KPřed 3 lety
Build and Document React Components With Storybook
What Are Progressive Web Apps? (PWA)
zhlédnutí 888Před 3 lety
What Are Progressive Web Apps? (PWA)
Helping People Out On /r/learnjavascript
zhlédnutí 652Před 3 lety
Helping People Out On /r/learnjavascript
Taking The W3 Schools JavaScript Quiz
zhlédnutí 1,6KPřed 3 lety
Taking The W3 Schools JavaScript Quiz
Beginner TypeScript Tutorial - A Hands On Approach
zhlédnutí 1,8KPřed 3 lety
Beginner TypeScript Tutorial - A Hands On Approach
Build And Publish A React Component Library
zhlédnutí 102KPřed 3 lety
Build And Publish A React Component Library
Converting A Plain JavaScript App To React
zhlédnutí 30KPřed 3 lety
Converting A Plain JavaScript App To React
Coding A Calendar App In Plain JavaScript
zhlédnutí 83KPřed 3 lety
Coding A Calendar App In Plain JavaScript
Beginner Svelte Tutorial - Coding A Movie Journal With Svelte
zhlédnutí 5KPřed 3 lety
Beginner Svelte Tutorial - Coding A Movie Journal With Svelte
Creating A React App From Scratch Using Snowpack
zhlédnutí 6KPřed 3 lety
Creating A React App From Scratch Using Snowpack
Code A Blog With Next.js and Sanity.io
zhlédnutí 27KPřed 3 lety
Code A Blog With Next.js and Sanity.io
Coding An Unclickable Button In JavaScript
zhlédnutí 9KPřed 3 lety
Coding An Unclickable Button In JavaScript
What The Heck Is Web Assembly?
zhlédnutí 1,1KPřed 3 lety
What The Heck Is Web Assembly?
Beginner Next.js Tutorial - Coding A News App With Next.js
zhlédnutí 41KPřed 3 lety
Beginner Next.js Tutorial - Coding A News App With Next.js
What The Heck Is Server Side Rendering?
zhlédnutí 13KPřed 3 lety
What The Heck Is Server Side Rendering?
Build And Deploy A React Chat App With Chatengine.io
zhlédnutí 13KPřed 3 lety
Build And Deploy A React Chat App With Chatengine.io
What The Heck Is Isomorphic JavaScript?
zhlédnutí 4,5KPřed 3 lety
What The Heck Is Isomorphic JavaScript?
A Programmer's Thoughts On Social Media
zhlédnutí 564Před 3 lety
A Programmer's Thoughts On Social Media

Komentáře

  • @ankitjaiswal5068
    @ankitjaiswal5068 Před dnem

    I've created a CSS file and imported it into my component. The CSS styles are applied correctly when I preview the component in Storybook. However, when I integrate the component into my main application, the component's functionality works as expected, but the CSS classes from the imported file do not merge with the existing styles. Can anyone help me on this.

  • @abrahamlopez1504
    @abrahamlopez1504 Před 3 dny

    You are the goat man <3

  • @70bpmmusic86
    @70bpmmusic86 Před 9 dny

    @28:21 when the appendChild was added did anyone get TypeError: Cannot read properties of null (reading 'appendChild') at load

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

    Straight to the point. Love it.

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

    i got stuck and this video explained all in a go, amazing vid, thanks man

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

    Phenomenal overview of so many of the complications with React! But I got confused when you also jumped around with Node

  • @_____AjCoder______
    @_____AjCoder______ Před 2 měsíci

    It couldn't be explained any better !! thanks bro 👏👏👏

    • @Maxim9575
      @Maxim9575 Před 2 měsíci

      it's nothing, there were no any words about fiber core of react, trash

  • @samiyajagirdar6471
    @samiyajagirdar6471 Před 2 měsíci

    Woah! This was so easy to understand, I read a lot of articles about this topic but couldn't clearly understand but you explained it concisely in just 2 minutes, thank youuu !

  • @IconShah-yz8qf
    @IconShah-yz8qf Před 2 měsíci

    I tried changing my password a couple of times 36:25 , however in the console it still says 'Invalid username/password combination', what can i do to fix it?

  • @chrise202
    @chrise202 Před 2 měsíci

    For CSS you are using a global styles.css file which is bad for multiple reasons: 1. Given this is a "component library" with multiple contributors working on same styles.css you get merge conflicts all the time. 2. If you have an app importing only the "Button" component, you'll have to import the styles.css containing ALL files. 3. The components class names are prone to clashes as they are not isolated in modules. Why did I bother to enlist this? Because rollup is shit and is not suited for component libraries, as soon as you try to tick the boxes above you'll go through a not so pleasant experience.

  • @albuslrc
    @albuslrc Před 3 měsíci

    Great! 😄

  • @Drayken
    @Drayken Před 3 měsíci

    Man there's always so much fucking rambling and zero actual practical visualization or application on this topic it's crazy why can't anyone just make a decent video or guide on this shit?

  • @jeff6555
    @jeff6555 Před 3 měsíci

    It's such a strange thing for me to get hung up on, but you really should have trimmed the other end of that command strip. The tab you snipped was for removal :)

  • @421sap
    @421sap Před 3 měsíci

    In Jesus' Name Amen ✝️

  • @user-st9te8tg5d
    @user-st9te8tg5d Před 4 měsíci

    How can i do multiple day events?

  • @romans7319
    @romans7319 Před 5 měsíci

    Thanks a lot, man. Clearly explained everything. Exactly what I searched for.

  • @cycychab8584
    @cycychab8584 Před 5 měsíci

    how could i make it that if I want to add 2 events in one day, both show on the calendar ? On my console it's fine, but i can't make it visible for the user ...

  • @nicalcoca
    @nicalcoca Před 5 měsíci

    How updated is this video? Any change?

  • @shanmuktej
    @shanmuktej Před 5 měsíci

    Hey! I've been surfing the web on how to publish my whole framework instead of just a few files as a package to import. To be specific * take a new project * npm init playwright A set of questions will be asked and boom, basic code will be on your machine. I need to build something like that, please help me!

  • @guylepage33
    @guylepage33 Před 5 měsíci

    Really great tutorial. Thank you!

  • @NetraPatwari
    @NetraPatwari Před 5 měsíci

    THANK YOU

  • @sophiochaphidze7732
    @sophiochaphidze7732 Před 5 měsíci

    Great video! Thank you <3

  • @pantojabenito3225
    @pantojabenito3225 Před 5 měsíci

    If i turn of the raspberry and then turn on the. This will launch the server automatically?

  • @pryansh_
    @pryansh_ Před 5 měsíci

    your video on this is by far the best on CZcams. Thanks ! It was really too helpful.

  • @andrewiglinski148
    @andrewiglinski148 Před 6 měsíci

    Dude... new sub for sure. I'm a pretty experienced developer but I've never published a full library, and it's fucking daunting. You helped a ton.

  • @maximilianosalvatti7073
    @maximilianosalvatti7073 Před 6 měsíci

    Thank you for sharing your knowledge. When I try to use the component I created in a react project, I get the error message: Invalid hook call. Hooks can only be called inside the body of a function component. How do I resolve it? Thanks

  • @tomfancode
    @tomfancode Před 6 měsíci

    Can we have a typescript version

  • @EsotericArnold
    @EsotericArnold Před 6 měsíci

    senior: wont mistake the forest for the trees. staff: wont mistake the earth for the forest or the trees

  • @floringhimici6800
    @floringhimici6800 Před 6 měsíci

    You're a legend, man! Thanks for making this video!

  • @milotxh
    @milotxh Před 6 měsíci

    Thank u so much u simply amazing and u got a subscriber

  • @GGg-jq5uv
    @GGg-jq5uv Před 7 měsíci

    insightful 🔥

  • @rifatmahmood7161
    @rifatmahmood7161 Před 7 měsíci

    Great Tutorial. 🎉

  • @018_sayaksen7
    @018_sayaksen7 Před 7 měsíci

    i was working on a very similar oroject where if the button was clicked more than 10 times it will send a different message but yet cannot do it... if you can help after this happens the unclickable button for more than 10 times then an event pops us of a different image.

  • @ronaksingh2243
    @ronaksingh2243 Před 7 měsíci

    Thanks much

  • @user-zn6qr2ye8k
    @user-zn6qr2ye8k Před 7 měsíci

    hey PortEXE, i'm following along and straight from the start wondering what you are using to put the head portion in place for example. i understand you probably made this preset yourself but would like to learn how you personally do this. especially if you are still using this method after 2 years or if you're doing this in another way. Great video, after following this tutorial i will definitely check out what else your channel offers!

  • @sibaprasadacharjya7072
    @sibaprasadacharjya7072 Před 7 měsíci

    Before This Video Started I Saw An Ad With A Person Saying "If You Want To Be An Expert Learn From The Expert" I Personally Don't Belive Their Single Words Even If It's Worth To Look At They Are Just Selling Their Courses As Products Through The Google Ad System Please Do Not Trust These 9Rs Courses They Are Just Fake.

    • @PortEXE
      @PortEXE Před 7 měsíci

      Thanks for pointing that out! I never know what sort of ads get played on my videos.

  • @gravitguru
    @gravitguru Před 7 měsíci

    how to ue react router dom i cant access this files to host

  • @Sergei546
    @Sergei546 Před 8 měsíci

    very interesting

  • @yanisbenslimane3106
    @yanisbenslimane3106 Před 8 měsíci

    the problem of the width and height of the tiles, i think it's because you set the width of the GRID to 300px (y), great video

  • @SneakyThew
    @SneakyThew Před 8 měsíci

    nice video sir

  • @juniorWeb247
    @juniorWeb247 Před 8 měsíci

    Really really thank you so much. You saved me a lot.

  • @SagesseStoique21
    @SagesseStoique21 Před 8 měsíci

    2:43 got me 🤣🤣🤣🤣🤣 so true

  • @shafwong1159
    @shafwong1159 Před 8 měsíci

    clear explanation.

  • @knutp9398
    @knutp9398 Před 9 měsíci

    You're prob not going to see this but this is by far the most comprehensive and easy to understand tut i've ever seen. thank you seriously. this is helping me a ton in my dev journey <3

  • @lilialindenberg
    @lilialindenberg Před 9 měsíci

    my code doesn't work unfortunatelly...

  • @ericsizemore
    @ericsizemore Před 9 měsíci

    i've been exploring raycast here lately but was struggling on understanding exact use-cases. these are all great examples. thank you!

  • @surbhigoel175
    @surbhigoel175 Před 9 měsíci

    I am not able to install node js in my rpi using the same commands as you did. Can you help me with the updated command for installing nvm?

  • @enriquegrageda
    @enriquegrageda Před 10 měsíci

    Thanks man, you havent uploaded lately. Hopefully everything is ok!

  • @ihebselfdefense6863
    @ihebselfdefense6863 Před 10 měsíci

    Can make a video tutorial to how to make a sprite animating turn based game tutorial in flash