React CSS Width and Height Settings | React App Full Screen Size

Veröffentlicht am: 30 Juli 2021
auf dem Kanal: Dave Gray

26,973

548

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

Learn how to set React App full screen size for your application. This tutorial reviews CSS width and height settings for React apps. Utilizing flexbox, you will learn how to set the screen size for your React apps.

🚩 Subscribe ➜ https://bit.ly/3nGHmNn

🚀 This lesson is part of a Learn React tutorial series playlist:
   • React Tutorials

🔗 Project Source Code: https://github.com/gitdagray/learn_re...

React CSS Width and Height Settings | React App Full Screen Size

(00:00) Intro
(00:05) Welcome
(00:33) App width problem
(01:12) Why is the width changing?
(01:56) Identifying the problem
(02:46) Providing a consistent app width
(05:13) Deciding between margins or full page width
(05:53) Importance of flex-grow setting
(06:28) Looking at app height
(07:15) App component flexbox settings
(07:40) Body element min-height setting
(08:22) App component height setting
(09:06) Main content component flex-grow
(09:57) Another way to center an element

🔗 React Router:
https://reactrouter.com

🔗 JSON-Server:
https://www.npmjs.com/package/json-se...

🔗 ES7 React JS Snippets Extension for VS Code:
https://marketplace.visualstudio.com/...

🔗 React Dev Tools Extension for Chrome:
https://chrome.google.com/webstore/de...

🔗 Styled Components: https://styled-components.com/

📚 References:
MDN Flexbox: https://developer.mozilla.org/en-US/d...
ReactJS Official site: https://reactjs.org/
React Wikipedia: https://en.wikipedia.org/wiki/React_(...)
React Jobs: https://www.ziprecruiter.com/candidat...

✅ Follow Me:
Twitter:   / yesdavidgray
LinkedIn:   / davidagray
Blog: https://yesdavidgray.com
Reddit:   / daveoneleven

Was this tutorial about Flexbox width and height settings for React apps helpful? If so, please share. Let me know your thoughts in the comments.

#react #width #height

Auf dieser Seite können Sie das Online-Video React CSS Width and Height Settings | React App Full Screen Size mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Dave Gray 30 Juli 2021 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 26,973 Mal angesehen und es wurde von 548 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!