CodeRomeos - for coders, by coders.2024-03-19T01:16:28+00:00CodeRomeostag:coderomeos.org,2024:/rss/feedReact Component Structure, Composition, HOCs and Optimization with Examplestag:coderomeos.org,2023-10-04:/react-component-structure-composition-hocs-and-optimization-with-examples2024-03-19T00:37:59+00:00React.js is a popular JavaScript library for building user interfaces. One of its core principles is the use of components to create modular and reusa...How to copy text to the clipboard in React.jstag:coderomeos.org,2023-09-29:/how-to-copy-text-to-the-clipboard-in-react-js2024-03-19T00:38:02+00:00In this article, we are going to learn and develop a feature - click to copy. This comes handy if you want your users to share a post or important dat...A Deep Dive into React useMemo with examplestag:coderomeos.org,2023-09-26:/a-deep-dive-into-react-usememo-with-examples2024-03-19T00:38:09+00:00React's useMemo hook is a powerful tool for optimizing the performance of your applications by memoizing expensive calculations and preventing unneces...Pure html popover API is coming in Chromium 114tag:coderomeos.org,2023-09-24:/pure-html-popover-api-is-coming-in-chromium-1142023-09-24T02:48:17+00:00Popovers are a common web feature and we know it as popups, popovers or overlays. To create a modal we generally use script to trigger open state, clo...Mastering React Router DOM with Transition and Animation: A Comprehensive Guide with Examplestag:coderomeos.org,2023-09-21:/mastering-react-router-dom-a-comprehensive-guide-with-examples2024-03-19T00:38:12+00:00Introduction: React Router DOM is a vital library for building single-page applications (SPAs) with React. It enables developers to create dynamic, cl...Create a reusable Accordion component in React + Tailwindtag:coderomeos.org,2023-05-28:/create-a-reusable-accordion-component-in-react-tailwind2024-03-19T00:38:21+00:00In web development, Accordions or collapsible panels are interactive UI components that allow users to expand and collapse sections of content on a we...Build Your Own Custom React Hooktag:coderomeos.org,2023-07-08:/build-your-own-custom-react-hook2024-03-19T01:11:27+00:00Hooks are functions that can be called inside functional components to add various capabilities.
React Hooks provide a way to add stateful logic to f...Axios Interceptors in a React applicationtag:coderomeos.org,2023-05-27:/axios-interceptors-in-a-react-application2024-03-19T00:38:42+00:00In this article, we are going to learn how to use Axios Interceptors in a React applications. If you are new to Axios you can learn more about it here...How to perform POST, GET and DELETE request using Axios in Reacttag:coderomeos.org,2023-05-26:/how-to-perform-post-get-and-delete-request-using-axios-in-react2024-03-19T00:38:25+00:00Axios is a popular JavaScript library used for making HTTP requests from a browser or Node.js. It supports various methods like GET, POST, PUT, DELETE...Exploring the Repository Pattern in Laravel: A Comprehensive Guide with Exampletag:coderomeos.org,2023-05-25:/exploring-the-repository-pattern-in-laravel-a-comprehensive-guide-with-example2024-03-19T00:38:28+00:00What is the Repository Pattern?
The Repository Pattern is a software design pattern that separates the data access logic from the business logic of a...Unlocking Performance and Scalability: Exploring Laravel Cache in Depth with Examplestag:coderomeos.org,2023-05-25:/unlocking-performance-and-scalability-exploring-laravel-cache-in-depth-with-examples2024-03-19T00:38:32+00:00Caching plays a crucial role in improving the performance and scalability of web applications. Laravel, a popular PHP framework, provides a powerful c...Mastering Laravel: Exploring the Power of implode() and explode() Functions for String Manipulationtag:coderomeos.org,2023-05-22:/mastering-laravel-exploring-the-power-of-implode-and-explode-functions-for-string-manipulation2024-03-19T00:38:46+00:00In Laravel, the functions implode() and explode() are commonly used for manipulating strings. They provide convenient ways to transform strings into a...Mastering Laravel Validations: A Comprehensive Guide with Examples for Error-Free Web Developmenttag:coderomeos.org,2023-05-21:/mastering-laravel-validations-a-comprehensive-guide-with-examples-for-error-free-web-development2024-03-19T00:38:35+00:00Laravel provides a powerful validation system that allows you to validate incoming data from various sources, such as user inputs, API requests, and m...Learn Redux Toolkit with exampletag:coderomeos.org,2023-05-14:/learn-redux-toolkit-with-example2024-03-19T00:38:57+00:00Learning Redux Toolkit
Redux is a library for managing application state, commonly used together with React. There are multiple reasons why you would...Understanding MongoDB Relationships: A Comprehensive Guide with Examplestag:coderomeos.org,2023-05-21:/mongodb-relationships-with-examples2024-03-19T00:38:51+00:00MongoDB, a popular NoSQL database, offers a flexible and powerful data model that enables efficient storage and retrieval of information. One of the k...Create Private Authenticated Routes in Reacttag:coderomeos.org,2023-05-21:/create-private-authenticated-routes-in-react2024-03-19T00:38:39+00:00In many web applications, it's required to have certain routes available only to authenticated users. React, being a popular JavaScript library for bu...JavaScript Array methods with examplestag:coderomeos.org,2023-05-16:/javascript-array-methods-with-examples2024-03-19T00:38:54+00:00JavaScript arrays are versatile data structures that allow us to store and manipulate collections of elements. JavaScript provides a wide range of bui...What are Data Structures? Definition and usagestag:coderomeos.org,2023-05-15:/what-are-data-structures-definition-and-usages2024-03-18T09:05:59+00:00What is data structure?
Data structure is a way of organizing and storing data in a computer program or database, so that it can be accessed, manipul...Binary Search algorithm – Data Structure and Algorithmtag:coderomeos.org,2023-05-13:/binary-search-algorithm-data-structure-and-algorithm2024-03-18T15:04:20+00:00Binary search is an algorithm used to find the position of a target value within a sorted array. The algorithm works by repeatedly dividing the search...What is the difference between facades and contracts in Laraveltag:coderomeos.org,2023-05-13:/what-is-the-difference-between-facades-and-contracts-in-laravel2024-03-18T09:06:03+00:00In Laravel, a facade and a contract are two different ways to access a service container's underlying implementation.
Facade
A facade acts as a prox...What is a facade in Laravel and how to create a custom facade?tag:coderomeos.org,2023-05-12:/what-is-a-facade-in-laravel-and-how-to-create-a-custom-facade2024-03-19T00:39:01+00:00What is a facade in Laravel?
In Laravel, a facade is a design pattern used to provide a static interface to services available in the application's s...Must know Laravel artisan commands cheat sheettag:coderomeos.org,2021-01-11:/must-know-laravel-artisan-commands-cheat-sheet2024-03-18T03:11:36+00:00Laravel gives developers a Command Line interface - Artisan. Artisan commands line tool is very handy for building a Laravel application. With this co...GitHub and OpenAI launch Copilot - an AI pair programmertag:coderomeos.org,2021-07-01:/github-and-openai-launch-copilot-an-ai-pair-programmer2021-07-01T16:12:45+00:00GitHub Copilot powered by the OpenAI Codex AI system launch a tool that generates entire function or suggests line completion as developers type in th...Useful and important functions for WordPresstag:coderomeos.org,2016-02-09:/useful-and-important-functions-for-wordpress2024-03-18T22:31:10+00:00In this post, we are adding very useful and important functions for WordPress.
We already have learned to create a child theme in WordPress. Now we c...CSS aspect-ratio propertytag:coderomeos.org,2021-01-31:/css-aspect-ratio-property2021-01-31T18:00:09+00:00CSS aspect-ratio property - the most awaited feature is now shipped in the new Chrome 88 along with other major updates.
With aspect ratio, we can de...Sending emails with urgent and high priority in PHPtag:coderomeos.org,2015-08-09:/php-mail-function-for-urgent-and-high-priority2024-03-18T20:50:12+00:00How to send an email using PHP
Sending emails in PHP is safe and easy. Using the PHP mail function, we can easily send emails from the website forms....AWS UI - a collection of React componentstag:coderomeos.org,2021-01-20:/aws-ui-a-collection-of-react-components2021-01-20T00:25:43+00:00AWS UI is a collection of React components developed by Amazon Web Services (AWS) that helps to create responsive, intuitive, and accessible user expe...QuerySelector method in JavaScripttag:coderomeos.org,2021-01-16:/queryselector-method-in-javascript2024-03-18T03:11:34+00:00In a tree structure, we use a selector in CSS that matches against elements. We use elements, classes, or IDs.
Selectors
Let's see an example1
<...Pure HTML-CSS accordion or collapsible panel using Details and Summary tagstag:coderomeos.org,2021-01-14:/pure-html-css-accordion-or-collapsible-panel-using-details-and-summary-tags2024-03-18T09:05:47+00:00Collapsible panels or accordions have been an important part of the UI experience for a long time.
In this article, we will explore HTML5 <details...JavaScript callback function with examplestag:coderomeos.org,2021-01-13:/javascript-callback-function-with-examples2024-03-18T07:19:35+00:00The callback function is a must-know concept for developers!
What is a function() ?
A function is a block of code that does a defined task when cal...Clear cache in Laraveltag:coderomeos.org,2019-08-31:/clear-cache-in-laravel2024-03-17T09:47:48+00:00Here is the list of commands to clear all types of cache in the Laravel project.
Clear Application Cache
php artisan cache:clear
Clear Confi...CSS filter function with exampletag:coderomeos.org,2016-06-02:/css-filter-functions-with-example2024-03-19T00:39:13+00:00CSS filter functions allow adjusting the color of an element before it is rendered on the site.
Though these CSS filter functions are mostly used for...Scroll to top of the page - A simple React componenttag:coderomeos.org,2019-09-18:/scroll-to-top-of-the-page-a-simple-react-component2024-03-18T21:31:32+00:00We are going to create a React button component that when clicked, the page smoothly scrolls back to the top.
Here is the simple concept to achieve t...Design trend - Neomorphism in UItag:coderomeos.org,2020-02-14:/design-trend-neomorphism-in-ui2024-03-18T20:29:39+00:00Neomorphism or soft UI is a new trend getting popular among UI developers in the year 2020.
What is Neomorphism or soft UI?
Neuromorphic UI is simpl...GitHub is now free for teamstag:coderomeos.org,2020-04-15:/github-is-now-free-for-teams2020-04-15T02:26:03+00:00Microsoft owned Github has announced today on April 14, 2020, that it's free for teams now. That means teams can now manage their work together in one...RIOT: The friendly Operating System for the Internet of Things.tag:coderomeos.org,2020-02-24:/riot-the-friendly-operating-system-for-the-internet-of-things2020-02-24T01:14:37+00:00RIOT is a small, open-source software operating system for networked, memory-constrained systems with a focus on low-power wireless Internet of Things...Microsoft's New Windows Terminal - Installation to customization guidetag:coderomeos.org,2019-12-29:/microsofts-new-windows-terminal-installation-to-customization-guide2024-03-18T18:26:46+00:00Microsoft has released the Windows Terminal Preview version. The latest version of the Terminal app is available from the Microsoft Store.
As per Mic...Redirect website from http to https using htaccesstag:coderomeos.org,2019-10-12:/redirect-website-from-http-to-https-using-htaccess2024-03-18T21:31:39+00:00
From July 2018, with the release of Chrome 68 - Now your website users know the level of security as google flags your website if your site is not...Create a Horizontal Scrolling Menutag:coderomeos.org,2019-09-25:/create-a-horizontal-scrolling-menu2024-03-18T07:28:19+00:00How To Create a Horizontal Scrolling Menu
The answer is much simple than you thought.
The basic idea -
- A container or a wrapper (parent )
- Ins....gitignore file and its usagetag:coderomeos.org,2019-09-15:/gitignore-file-and-its-usage2024-03-17T09:47:48+00:00What is .gitignore used for?
The .gitignore file is a text file in a repository. The purpose of .gitignore is to instruct Git which files, directory...Getting started with Git -a dead simple tutorial for beginnerstag:coderomeos.org,2019-08-27:/getting-started-with-git-a-dead-simple-tutorial-for-beginners2024-03-19T00:39:05+00:00Getting started with Git!
The very first lesson - Git is your friend. And it is never too late to learn something new!
This guide is specially desig...How to use Laravel Mix in any projectstag:coderomeos.org,2018-09-25:/how-to-use-laravel-mix-in-any-projects2024-03-18T20:29:37+00:00What is Laravel Mix?
Laravel Mix provides a fluent API for defining Webpack build steps for your Laravel application using several common CSS and J...How to use GitHub - Simple GitHub tutorial for beginnerstag:coderomeos.org,2019-09-08:/how-to-use-github-simple-github-tutorial-for-beginners2024-03-18T21:22:50+00:00What is GitHub?
GitHub is a Git repository(repository, in short, is termed as a repo) hosting service platform allowing us to store our local reposit...Microsoft releases Clarity web analytics tooltag:coderomeos.org,2018-12-14:/microsoft-releases-clarity-web-analytics-tool2018-12-14T21:44:27+00:00Microsoft launches its Clarity web analytics tool for A/B testing and visualizing user sessions.
Microsoft has launched its new Clarity analytics too...Bootstrap releases Bootstrap 3.4.0tag:coderomeos.org,2018-12-14:/bootstrap-releases-bootstrap-3402018-12-14T21:03:27+00:00Yes. Bootstrap releases Bootstrap version 3.4.0 with new classes and some fixes -
New: Added a .row-no-gutters class, added docs searching via Algo...Gatsby 2.0.0 is heretag:coderomeos.org,2018-09-18:/gatsby-200-is-here2018-09-18T23:10:38+00:00What is Gatsby?
Gatsby is a modern static PWA (Progressive Web App) site generator based on React and GraphQL. Gatsby.js uses GraphQL to share data a...Features rich new chrome 69 is heretag:coderomeos.org,2018-09-06:/features-rich-new-chrome-69-is-here2018-09-06T22:01:54+00:00Features rich new chrome 69 is here with -
CSS Scroll Snap allows to create smooth, scrolling experiences.
Display cutouts (notch support) the ful...ml5.js - Machine learning for the webtag:coderomeos.org,2018-06-17:/ml5-js-machine-learning-for-the-web2018-06-17T23:27:08+00:00ml5.js is a very friendly and high-level interface to TensorFlow.js, a library for handling GPU-accelerated mathematical operations and memory managem...Microsoft acquires GitHubtag:coderomeos.org,2018-06-04:/microsoft-acquires-github2018-06-04T20:42:37+00:00Microsoft has acquired open-source code repository website, GitHub for a $7.5 billion in an all-stock deal. Github is home to 28 million active develo...SSH access manager Teleport 2.6 Releasedtag:coderomeos.org,2018-06-01:/ssh-access-manager-teleport-26-released2018-06-01T13:27:10+00:00Teleport is a privileged SSH access manager for elastic compute infrastructure. and is open-sourced with complete OpenSSH clients & servers compat...