Make an OS with React & Next.js - Windows (Drag, Resize, Min, Max)

Channel:
Canada Dustin Brett
Subscribers:
13,800
Published on ● Video Link: https://www.youtube.com/watch?v=xrtO1cf0s18


Duration: 2:43:24
816 views
35

I'll be rebuilding my browser "OS" project over a series of many streams. For this project I will continue to use React & Next.js written in TypeScript. I plan to make it collaborative and involve the community. I will focus on a Windows 10 style this time instead of a hybrid.

Chapters:
0:00 Stream Starts
1:53 Check Out V1
7:31 NPM Updates
9:50 Allow Prop Spreading
10:52 Make Button Component
15:52 Remove Font Awesome & Use SVG
23:01 Delete Types Files
30:31 No More Overflow
31:25 No Default Prop Linting
34:36 No More withWithout
35:27 Theming Tweaks
37:19 Double Click Handler
51:55 Minimize & Maximize
1:23:40 Window Titlebar
1:44:54 Window Resizing
2:13:32 Window Dragging
2:33:30 Review Work
2:35:40 Fix Resize Bug
2:40:54 Check Pipeline
2:41:51 Next Stream

Stream Notes:
https://github.com/DustinBrett/daedalOS/tree/main/public/Users/Public/Documents/Stream%20Notes/03-13-21.md

Code Repository:
https://github.com/DustinBrett/daedalOS

Demo:
https://dustinbrett.com

#coding #programming #reactjs



Other Videos By Dustin Brett


2021-05-23Building an OS in the Browser with React (Episode 21)
2021-05-16Building an OS in the Browser with React (Episode 20)
2021-05-09Building Windows 10 on React & TypeScript (S01E19)
2021-05-02Building an Operating System in the Browser (LIVE)
2021-04-25Building an Operating System in the Browser (S01E17)
2021-04-18Adding DOS & File Explorer to my OS in the browser [Stream #16]
2021-04-11Building a Web OS in React [Episode 15] - Behaviors, Styling & Refactoring
2021-04-04Building an OS with React - x86 Emulation & File Drop
2021-03-28Make an OS with React & Next.js - Styling & Session
2021-03-21Make an OS with React & Next.js - Styling & Planning
2021-03-14Make an OS with React & Next.js - Windows (Drag, Resize, Min, Max)
2021-03-07Make an OS with React & Next.js - File Manager
2021-02-28Building a Web Desktop Environment with React - Taskbar & Processes
2021-02-21Building an OS with React - Clock & File System
2021-02-18My EXTREME Programmer PC Build - Ryzen 9 3900X
2021-02-14Building an OS with React - Taskbar
2021-02-07Building Windows 10 with React - Wallpaper, Taskbar & Refactoring
2021-01-31Make an OS with ReactJS & Next.js - Wallpaper & Taskbar
2021-01-26The Best Programming Language to Learn First in 2021
2021-01-24Make an OS with ReactJS & Next.js - System Components
2021-01-2215 Tips On How to Become a Self-Taught Software Developer


Tags:
next js
react js
nextjs
reactjs
next.js
react.js
react next.js
react jsx
nextjs tutorial
next js tutorial
jsx
react context
react hooks
react components
typescript
javascript
styled components
styled components react
css
os
operating system
eslint
stylelint
jest
prettier
github actions
git hooks
lint-staged
code refactoring
refactoring
git commit
programming projects