Top-10 Posts for FE (Week 4, Jun 2023)

#javascript #css #webdev #html

Here are the top 10 posts from the past week that will be useful to front-end developers and beyond. The selection was made on the basis of their interestingness, uniqueness, presentation, usefulness and subjective assessment of the author.

We can use :has, finally!

The article discusses the introduction of the :has pseudo-class in CSS, which allows developers to select elements based on their content, and explores its usage as a parent selector, with combinators and other pseudo-classes for more advanced effects.

Authentication vs. Authorization

The article explains the difference between authentication and authorization in web applications, where authentication is about proving one's identity, while authorization determines the actions and resources a user can access within the system.

Top 10 Websites Every Developer Needs to Know About

The article highlights a collection of websites that can greatly assist developers in their daily work, including code search engines, file converters, image editing tools, code beautifiers, automation platforms, and more, with the aim of improving productivity and saving time.

Know these HTML Tags and Unlock the True Potential of Web Development

The article explores lesser-known HTML tags that can enhance web development skills, including <datalist> for interactive forms, <figure> and <figcaption> for image captions, <mark> for highlighting text, <bdo> for text directionality, and <template> for reusable HTML content.

9 Ways to Implement Vertical Alignment in CSS with Examples

This article explores various methods of implementing vertical alignment in CSS, including flexbox, position: absolute, display: table, CSS grid, line-height, padding, display: inline-block, CSS calc() function, and margin: auto, providing examples and use cases for each method.

CSS in Micro Frontends

This article explores strategies for handling CSS in micro frontends, addressing the challenges of styling conflicts and offering solutions such as shadow DOM, naming conventions, CSS modules, CSS-in-JS libraries like Emotion and Styled Components, and CSS utility libraries like Tailwind.

Best Practices for Creating a Folder and File Structure for a React Application

This article provides guidance and suggestions on organizing the folder structure of a new application, emphasizing the importance of reflecting the project's unique requirements, scalability, and maintainability, while presenting a recommended folder structure for small to medium-sized projects.