Rami Mohappydev.blog·Dec 20, 2024Mastering Front-End Development - Stage 4: Advanced CSS - Enhancing Styling SkillsAfter learning the basics of HTML, JS, and CSS, we are one step closer to creating beautiful and functional web pages. We will learn how to make a web page responsive so it looks good on different screen sizes, animate elements, and work with more co...Mastering Front-End DevelopmentFrontend Development
SVG Nesterysvgnestery.uk·Dec 5, 2024Rhapsody Font🔍 Check out Rhapsody Font now! Explore this 📁 script fonts and claim your 🆓 free download here. Let's start crafting together! 🚀 Discover Rhapsody, the exquisite typeface that harmonizes music and typography to bring unparalleled elegance and cre...adaptive
Nehal Fathemasafaranokhi.hashnode.dev·Nov 17, 2024CSS Grid vs Flexbox: When and Why to Use EachWeb developers often find themselves debating whether to use CSS Grid or Flexbox for their layouts. While both are powerful tools for modern web design, they shine in different scenarios. Let’s break down their strengths, differences, and best use ca...grid
Nehal Fathemasafaranokhi.hashnode.dev·Nov 11, 2024Understanding and Implementing the Masonry Layout in Web DesignWeb design often brings us creative solutions for showcasing content in unique, aesthetically pleasing ways. One layout that has gained popularity for displaying dynamic content such as images, cards, or posts is the masonry layout. This layout, famo...webdesign
Idorenyin Akaninyenedorendev.hashnode.dev·Oct 11, 2024Top interactive UI component libraries To have in your bookmarkOver the years we have seen the web evolved from static web pages to highly intuitive and interactive pages that actually in a subconscious way make users stay on them longer. In these recent times we have seen how building animated interactive compo...1.1K readsUI
Surya Durgeshsuryatechie.hashnode.dev·Sep 27, 2024Flexbox Fundamentals: Creating Flexible LayoutsFlexbox, short for Flexible Box Layout, is a powerful CSS layout module that allows you to create complex, responsive layouts with ease. Unlike traditional layouts (like floats or grid systems), Flexbox is designed to distribute space dynamically and...1 likeCSS
Madhur Guptamadhurgupta.hashnode.dev·Sep 17, 2024CSS Flexbox: Everything you need to knowWhen you add multiple elements on your webpage, and they automatically get aligned in a column, but what if you want to align them in a row instead? By default, these elements start from top, but what if you want to place them starting from bottom? ...2 likes·33 readsCSS
woodstockwoodstock.hashnode.dev·Sep 11, 2024[App Router] 레이아웃 설정앱 라우터의 레이아웃 설정 App Router에서는 layout.tsx파일을 사용하여 특정 경로와 그 하위 경로에 공통적으로 적용될 레이아웃을 정의할 수 있다. . ├── src │ └── app │ ├── search │ │ ├── layout.tsx // search 하위 경로 레이아웃 │ │ └── page.tsx │ ├── book │ │ └── [id] │ ...NextJSapp router
woodstockwoodstock.hashnode.dev·Sep 11, 2024[Pages Router] 레이아웃 설정페이지 라우터의 레이아웃 설정 . ├── src │ ├── components │ │ ├── global-layout.tsx │ │ └── searchable-layout.tsx │ ├── pages │ │ ├── _app.tsx │ │ ├── book │ │ │ └── [[...id]].tsx │ │ ├── search │ │ │ └── index.tsx 1. 글로벌 레이아웃 ...NextJSNext.js
Michał Romanmichalroman.hashnode.dev·Jul 30, 2024Getting started with basic widgets in FlutterFlutter is an open-source framework created by Google. It is used to develop applications for Android, iOS, Linux, Mac, Windows, Google Fuchsia, and the web from a single codebase. If you're just starting out with Flutter, understanding its fundament...Flutter
![[App Router] 레이아웃 설정](https://cdn.hashnode.com/res/hashnode/image/upload/v1726059568225/620ad6b6-afd9-42b7-b687-bc9231f8b889.avif?w=1600&h=840&fit=crop&crop=entropy&auto=compress,format&format=webp)
![[Pages Router] 레이아웃 설정](https://cdn.hashnode.com/res/hashnode/image/upload/v1726059328426/4970a31e-0a79-488b-82d8-a75709696871.avif?w=1600&h=840&fit=crop&crop=entropy&auto=compress,format&format=webp)
