Angular 🇺🇦 - practical notes

📄 Lesser-Known Tricks in HTML

#html

№1: Opening the Device Camera

<input type="file" capture="user" accept="image/*">
<input type="file" capture="environment" accept="video/*" />

№2: Automatic Website Refresh

<head>
    <meta http-equiv="refresh" content="10">
</head>

№3: Spellcheck Activation

<input type="text" spellcheck="true" lang="en">

№4: Preventing Translation

<p translate="no">Brand name</p>

№5: Automatic Download on Link Click

<a href="image.png" download>Download Image</a>

№6 Responsive Images with srcset

<img srcset="image.jpg 1x, image@2x.jpg 2x, image@3x.jpg3x" src="image.jpg" alt="Responsive Image">

👍2😱1

120 views05:59

Angular 🇺🇦 - practical notes

📄 How to use Cypress in 5 steps

#angular #cypress

Cypress is a desktop application. It supports multiple operating systems such as Windows, Linus, and iOS. Cypress is a tool that you can use to test a front-end application whatever the front-end framework you are using. E2E is a software testing method that simulates what the application should be able to do from the start to the end.

✅ Article Link: https://levelup.gitconnected.com/e2e-testing-with-cypress-angular-219eaa3926c

121 views05:59

Angular 🇺🇦 - practical notes

✳️ Handling custom errors in TS

#typescript #ts #angular #errors

Error handling in Type/JavaScript is a topic that doesn’t get the importance it deserves. It’s crucial to the longevity of any project to catch and log errors.

✅ Article Link: https://engineering.udacity.com/handling-errors-like-a-pro-in-typescript-d7a314ad4991

119 views05:59

Angular 🇺🇦 - practical notes

📄 What’s new in CSS 2023

#css

⚠️ Experimental (not fully supported)

✅ Article link: https://medium.com/@trinhcamminh25112002/whats-new-in-css-and-ui-i-o-2023-edition-5bac2c7271bb

🎁 Code Link:

1. @container: https://codepen.io/web-dot-dev/pen/KKxzYQx

2. new nth-child: https://codepen.io/web-dot-dev/pen/oNMRaQq

3. @scope: https://codepen.io/web-dot-dev/pen/MWPVGPL

Please open Telegram to view this post

VIEW IN TELEGRAM

Please open Telegram to view this post

VIEW IN TELEGRAM

121 views06:01

Angular 🇺🇦 - practical notes

📄 Add missing functionality to third-party components using Directives

#angular #directive

When working with third-party components, there are times when you need to add missing functionality. We can create a directive that targets this input by classname, and then we can use the Angular API to add what we need.

✅ Article link: https://netbasal.com/the-power-of-selectors-in-angular-cd6947ce3bfd

128 views06:02

Angular 🇺🇦 - practical notes

🔄 React With Mediator Design Pattern

#react #mediator

Using the Mediator pattern as a state management solution in React applications also promotes modularization, making it easier to reuse components in other parts of the application or even in other applications.

✅ Article Link: https://itnext.io/improve-state-management-in-react-with-mediator-design-pattern-db632cbe6475

Please open Telegram to view this post

VIEW IN TELEGRAM

132 views06:00