Responsive Design
06/16/21 • 3 min
These days, people use different devices to access the web. Therefore, every web application should be adapted to all screen sizes.
Responsive Design is a technique that allows screens to adjust to different sizes accordingly.
There are a few techniques to make your Angular Apps responsive. You can choose from several libraries specifically built for that purpose or just do plain CSS by writing CSS Media Queries.
Lets discuss that 👉 Twitter thread
Links
Angular Flex Layout
Angular CDK Layout
Tailwind Responsive Design
Bootstrap Layout Utilities
CSS Media Queries
Twitter Pool
Angular Flex Layout / CDK vs Tailwind / Bootstrap Utilities vs Media Queries
These days, people use different devices to access the web. Therefore, every web application should be adapted to all screen sizes.
Responsive Design is a technique that allows screens to adjust to different sizes accordingly.
There are a few techniques to make your Angular Apps responsive. You can choose from several libraries specifically built for that purpose or just do plain CSS by writing CSS Media Queries.
Lets discuss that 👉 Twitter thread
Links
Angular Flex Layout
Angular CDK Layout
Tailwind Responsive Design
Bootstrap Layout Utilities
CSS Media Queries
Twitter Pool
Angular Flex Layout / CDK vs Tailwind / Bootstrap Utilities vs Media Queries
Previous Episode
Angular Material with Jeremy Elbourn
Angular Material is the most popular UI library available for Angular. It contains a set of high-quality components implementing Google Material Design specification, built by the Angular Team.
Think of Angular Material as a foundation that you can use to build your own custom components.
Jeremy touched on a quick history about Angular Material, its continuous evolution and what to expect in the future.
Links
material.angular.io
guides
More from Jeremy
twitter
Next Episode
Animations with William Juan
Animation is a great solution to improve the application experience.
You can add animations to your web applications using CSS animations, browsers web animations API or by using third-party libraries.
Juan talking bout different aspects of animations, how it works and how to get started.
Links
angular.io/guide/animations
auth0.com/blog/get-better-angular-ux-using-animation-techniques
indepth.dev/posts/1285/in-depth-guide-into-animations-in-angular
williamjuan027.github.io/angular-animations-explorer
If you like this episode you’ll love
Episode Comments
Generate a badge
Get a badge for your website that links back to this episode
<a href="https://goodpods.com/podcasts/angular-rocks-244759/responsive-design-27591920"> <img src="https://storage.googleapis.com/goodpods-images-bucket/badges/generic-badge-1.svg" alt="listen to responsive design on goodpods" style="width: 225px" /> </a>
Copy