# CODE THE PIXEL > CodeThePixel.com (CTP) is a project dedicated to helping aspiring programmers by providing highly optimised code snippets that emphasise simplicity. Step-by-step web development tutorials by Asyraf Wahi Anuar. Every tutorial below has a Markdown version (the .md links); the full text of all articles is in https://codethepixel.com/llms-full.txt. ## Laravel tutorials - [Step-by-Step Guide: Setting Up Laravel with Laragon](https://codethepixel.com/step-by-step-guide-setting-up-laravel-with-laragon.md) ## CakePHP tutorials - [Handling Irregular Plural Table Names in CakePHP](https://codethepixel.com/handling-irregular-plural-table-names-in-cakephp.md): Handling Irregular Plural Table Names in CakePHP - [Using Bahasa Melayu Table Names in CakePHP](https://codethepixel.com/using-bahasa-melayu-table-names-in-cakephp.md): Learn how to use Bahasa Melayu table names like "pengguna" in CakePHP while following the framework’s naming conventions. Includes tips for using the Bake tool and avoiding pluralization issues. - [CakePHP 4 Soft Delete](https://codethepixel.com/cakephp-4-soft-delete.md): A soft delete marks a record as no longer active or valid without deleting it from the database. Soft deletion is a widely used pattern applied for business applications. - [CakePHP 4 Application Programming Interface (API)](https://codethepixel.com/cakephp-4-application-programming-interface-api.md): This tutorial described how to create an API for adding, editing, listing and deleting records in CakePHP 4. - [CakePHP 4 Create TreeMap and HeatMap Chart Using ApexCharts](https://codethepixel.com/cakephp-4-create-treemap-and-heatmap-chart-using-apexcharts-js.md): Create TreeMap and HeatMap Chart Using ApexCharts.JS in CakePHP 4 - [CakePHP 4 Visualized Data Using ChartJS](https://codethepixel.com/cakephp-4-visualized-data-using-chartjs.md): This tutorial will show how to count and visualized data using ChartJS in CakePHP 4 - [CakePHP 4 Log User Authentication Using Component](https://codethepixel.com/cakephp-4-log-user-authentication-using-component.md): This tutorial will discuss how to create a user activities log using the CakePHP component. The basic activities that will be logged are the authentication method which includes the login and logout details. - [CakePHP 4 Sending Email](https://codethepixel.com/cakephp-4-sending-email.md): Send email from CakePHP 4 using email class. This tutorial will show how to configure and send email using CakePHP 4. - [CakePHP 4 Avoid Spam Using hCaptcha](https://codethepixel.com/cakephp-4-avoid-spam-using-hcaptcha.md): Integrate hCaptcha with CakePHP 4 to protect unauthorized data submission from bots. Preventing spam in CakePHP 4 form. - [CakePHP 4 Print Increment Number With Every Table Row](https://codethepixel.com/cakephp-4-print-increment-number-with-every-table-row.md): Increment number in every table row is very useful in some web application projects. This tutorial will show how to set a maximum limit of rows per page with an incrementing number in every row. - [CakePHP 4 XML SiteMap](https://codethepixel.com/cakephp-4-xml-sitemap.md): A sitemap is a file that contains information about the site's pages, contents, and other files, as well as their relationships. This file is read by search engines like Google to crawl the site contents more efficiently. This tutorial provides an overview of how to create an XML sitemap in CakePHP... - [CakePHP 4 Audit Trail Using AuditStash Plugin](https://codethepixel.com/cakephp-4-audit-trail-using-auditstash-plugin.md): This plugin adds an "audit trail" to any of your Table classes in your application, allowing the web applications to record the creation, change, or deletion of any table's entities. In theory, it will store the old data before replacing it with the new data or content. - [CakePHP 4 Progressive Web Apps](https://codethepixel.com/cakephp-4-progressive-web-apps.md): Progressive Web Apps make app-like experiences in the browser. A progressive web application (PWA), sometimes known as a progressive web app, is a sort of web-based application software constructed utilising popular web technologies such as HTML, CSS, JavaScript, and WebAssembly. - [CakePHP 4 HTML Minify Plugin](https://codethepixel.com/cakephp-4-html-minify-plugin.md): Minify HTML source code for CakePHP 4. Minification enhances site performance and accessibility significantly, which immediately translates into a better user experience. - [CakePHP 4 Audit Log Plugin](https://codethepixel.com/cakephp-4-audit-log-plugin.md): An audit trail (audit logs) is a chronological log meant to capture any changes made to the electronic contents. The logs are used to be evidence for any changes that affected the contents. - [CakePHP 4 ActivityLogger plugin](https://codethepixel.com/activitylogger-plugin-for-cakephp-4-x.md): Activity logging is one of the very useful features in web applications since it can provide a track of activities in the web content. CakePHP Activity Logger Plugin enables the developer or administrator to log the activities and changes to the web content. - [CakePHP 4 Force DebugKit in Live Server](https://codethepixel.com/cakephp-4-force-debugkit-in-live-server.md): DebugKit adds a debugging toolbar and better-debugging capabilities to CakePHP apps. It allows you to rapidly see configuration data, log messages, SQL queries, and timing statistics for your application. - [CakePHP 4 Create, Write and Read Session Data](https://codethepixel.com/cakephp-4-create-write-and-read-session-data.md): On top of PHP's native session extension, CakePHP adds a wrapper and a suite of utility functions. Sessions enable you to identify and keep persistent data for individual users while identifying unique users across requests. - [CakePHP 4 Auth Using CakeDC User Plugin](https://codethepixel.com/cakephp-4-auth-using-cakedc-user-plugin.md): Authentication and authorization are critical components in the protection of online application content. They validate the user's identification and give access to the resources. - [CakePHP 4 Captcha Plugin](https://codethepixel.com/cakephp-4-captcha-plugin.md): Applying CakePHP Captcha Plugin to web application project. Captcha is a simple solution to block unwanted bot responses to your public available form. - [CakePHP 4 Duplicate Save to Associated Table](https://codethepixel.com/cakephp-4-duplicate-save-to-associated-table.md): Saving and duplicating data into the associated table? This quick tutorial will show how to save data and duplicate it into the associated table. For this tutorial, I set 2 tables, i) users and ii) clones where the input process will be executed in the table users and duplicate into table clones. - [CakePHP 4 Sum column value](https://codethepixel.com/cakephp-4-sum-column-value.md): This tutorial is a very short one. How to sum the value from a column in a table? Let say you’ve table stocks [id, product, brand, quantity]. To sum the quantity value, you can apply the following code to your controller. - [CakePHP 4 Telegram Notification](https://codethepixel.com/cakephp-4-telegram-notification.md): There are many methods of sending notifications to alert the web application administrator or moderator regarding some event in the web application that required attention from them. Technically, most of the notification is sent via email, however, Telegram has a bot that is free to generate and use... - [CakePHP 4 Covid-19 Tracker Module](https://codethepixel.com/cakephp-4-covid-19-tracker-module.md): This tutorial will demonstrate how to populate data from JSON and CSV format from online sources. Technically the module is not limited to the CakePHP where it also can be applied to other websites or web applications with PHP support. - [CakePHP 4 Dynamic Input and Save Multiple Entities](https://codethepixel.com/cakephp-4-dynamic-input-and-save-multiple-entities.md): When developing a web application, a dynamic input usually will be used to complete some of the tasks such as dynamically inserting data or bulk data. Using jQuery, the dynamic input can be easily generated even there are lots of web articles/tutorials that have been published regarding this matter... - [CakePHP 4 Insert, Save, Update (hasOne) Associative Data](https://codethepixel.com/cakephp-4-insert-save-update-hasone-associative-data.md): Insert, save and edit the associative data is a common process in web applications. Most of the related associative data is based on the ‘hasMany’ relationship. However, in this tutorial, the focus is on the ‘hasOne’ relationship e.g user has one profile. - [CakePHP 4 Common Helpers](https://codethepixel.com/cakephp-4-common-helpers.md): CakePHP 4 helper and examples. - [CakePHP 4 Slugged Behavior](https://codethepixel.com/cakephp-4-slugged-behavior.md): Slug is the part of the URL that identifies a particular page on the web or system in an easy reading form. Slug is generated based on a specific field such as article title, name, event or any relevant field. - [CakePHP 4 Find, Sort & Count](https://codethepixel.com/cakephp-4-find-sort-and-count.md): This tutorial will show how to count registered records in your database using CakePHP 4 method. Basically, the process is to find the records based on the condition and count. - [CakePHP 4 Export To CSV](https://codethepixel.com/cakephp-4-export-to-csv.md): This tutorial will show how to export a list of records to .csv file format in CakePHP 4. This function is useful if you want to extract the record into .csv format which can be open using Microsoft Excel. The CakePHP-csv view plugin will be used to generate the .csv file. - [CakePHP 4 Search Plugin](https://codethepixel.com/cakephp-4-search-plugin.md): This tutorial will demonstrate the basic usage of the search plugin in CakePHP 4. Search has become an essential tool in any web information system. - [CakePHP 4 Site Configuration Using Database](https://codethepixel.com/cakephp-4-site-configuration-using-database.md): This tutorial will show the step to create a site configuration that is accessible from the form interface and stored in a database table: configurations in CakePHP 4. Basically, this site configuration leverage the global variable configuration to make it accessible throughout the system. - [CakePHP 4 Concatenation](https://codethepixel.com/cakephp-4-concatenation.md): The most popular concatenation in programming is combining the first and last name field to form a full name. This tutorial shows the code of concatenation in CakePHP 4. - [CakePHP 4 Print PDF Using CakePDF](https://codethepixel.com/cakephp-4-print-pdf-using-cakepdf.md): This tutorial will show how to use the CakePDF plugin to generate a PDF file. This tutorial will use DOMPDF as an example of the generator engine. Basically, generating PDF is useful for those who are working with a system that prints or produce correspondence or document related task. - [CakePHP 4 Bulk Delete](https://codethepixel.com/cakephp-4-bulk-delete.md): This tutorial will show how to create a bulk delete function in CakePHP 4. The bulk delete is a process of selecting a group of records in a single table and removing it from the database. A checkbox will be rendered on each of the record IDs and sent to the function that manages the delete all proc... - [CakePHP 4 File Upload Using Proffer Plugin](https://codethepixel.com/cakephp-4-file-upload-using-proffer-plugin.md): This tutorial shows how to upload images or files in CakePHP 4 using the Proffer plugin. This plugin allows images and files to be uploaded and includes a bundled image library for generating thumbnails from source images. - [CakePHP 4 Authentication Using Auth Component (Advance)](https://codethepixel.com/cakephp-4-authentication-using-auth-component-advance-deprecated.md): This tutorial will show how to create an authentication using the Auth component for CakePHP 4. It includes the process of password hashing, registration with email verification, multi-field username/email login, forgot password, reset password and status management. - [CakePHP 4 Authentication Using Auth Component (Basic)](https://codethepixel.com/cakephp-4-authentication-using-auth-component-basic-deprecated.md): This tutorial will show how to use the Auth component to create an authentication in CakePHP - [CakePHP 4 Authentication Using Authentication Plugin](https://codethepixel.com/cakephp-4-authentication-using-authentication-plugin.md): Authentication is an important component in a web application to protect the content from unauthorized access or modification. - [CakePHP 4 CRUD](https://codethepixel.com/cakephp-4-crud.md): CRUD operation in CakePHP enables the developer to rapidly generate the prototype for a web application. CRUD comprise routine code for create, read, update and delete operation. - [CakePHP 4 Installation & Configuration](https://codethepixel.com/cakephp-4-installation-and-configuration.md): Learn how to install CakePHP 4 using composer and XAMPP. - [CakePHP 4 jQuery Date Time Picker](https://codethepixel.com/cakephp-4-jquery-date-time-picker.md): Date Picker is one of the most important features in web-based applications to enhance the user experience, especially when inputting date and time. ## Joomla! tutorials - [Upgrade from Joomla 4 to Joomla 5: A Step-by-Step Tutorial](https://codethepixel.com/upgrade-from-joomla-4-to-joomla-5-a-step-by-step-tutorial.md): If you're already on Joomla 4.4, upgrading to Joomla 5 is a straightforward process, not a full migration. This guide walks you through the essential steps to ensure a smooth transition. - [Configure Joomla! From Live Server To Local Server](https://codethepixel.com/configure-joomla-from-live-server-to-local-server.md): Configure Joomla! From Live Server To Local Server - [Identify Server Temp & Log Path Joomla!](https://codethepixel.com/identify-server-temp-and-log-path-joomla.md): Identify Server Temp & Log Path for Joomla! ## Tools & Software tutorials - [Upgrade PHP and Apache in Laragon 6: A Step-by-Step Tutorial](https://codethepixel.com/upgrade-php-and-apache-in-laragon-6-a-step-by-step-tutorial.md): Upgrading PHP and Apache in Laragon can enhance your development environment significantly, providing access to the latest features and improvements. This step-by-step tutorial will guide you through the process, ensuring a smooth transition while preserving your existing projects - [Boost Your Productivity with Emmet in VS Code](https://codethepixel.com/boost-your-productivity-with-emmet-in-vs-code.md): Emmet is a markup and stylesheet abbreviation tool that allows developers to type shorthand syntax and expand it into full-fledged HTML or CSS code. It's a lifesaver for front-end developers, eliminating the need to manually type out repetitive tags and structures. - [Formatting PHP in VSCode Using Prettier and PHP Intelephense](https://codethepixel.com/formatting-php-in-vscode-using-prettier-and-php-intelephense.md): Learn how to set up Visual Studio Code (VSCode) for automatic PHP file formatting using the Prettier and PHP Intelephense extensions. This step-by-step tutorial will help you maintain a clean and organised codebase, enhancing your PHP development experience. ## User Interface tutorials - [Dark Mode in Bootstrap 5.3.3](https://codethepixel.com/dark-mode-in-bootstrap-5-3-3.md): Dark Mode is a popular feature with a darker colour scheme, making it easier on the eyes, especially in low-light environments. It enhances the visual appeal and improves user experience by reducing eye strain and saving battery life on OLED screens. ## Misc tutorials - [Git Tutorial: Uploading a Project to GitHub and Collaborating with Others](https://codethepixel.com/git-tutorial-uploading-a-project-to-github-and-collaborating-with-others.md): Version control is essential for developers, and Git is a powerful tool that helps manage project changes efficiently. GitHub, a popular platform built on Git, not only hosts repositories but also facilitates collaboration among developers worldwide. In this tutorial, we will explore the process of... - [Git Pull Error in cPanel](https://codethepixel.com/git-pull-error-in-cpanel.md): Solving cPanel Git pull error by using the composer install no dev optimized autoloader - [Print MySQL Table Description Using Command Line](https://codethepixel.com/print-mysql-table-description-using-command-line.md): This tutorial will show how to access MySQL databases and tables using the command line interface - [How to Make an Interactive SVG Map](https://codethepixel.com/how-to-make-an-interactive-svg-map.md): Create a Malaysia SVG map using HTML and CSS - [Using Font Awesome Icons in Website](https://codethepixel.com/using-font-awesome-icons-in-website.md): This tutorial will show the basic instruction on how to implement Font-Awesome 6 into the website. - [Using Google Font in Website](https://codethepixel.com/using-google-font-in-website.md): Applying Google Font to website or web application. - [Clone GitHub Private Repository from cPanel Using SSH](https://codethepixel.com/clone-github-private-repository-from-cpanel.md): Clone a private GitHub repository using SSH and cPanel. The Git Version Control feature allows developers to easily host Git repositories on the developer cPanel account. - [Web scraping using PHP Simple HTML DOM Parser](https://codethepixel.com/web-scraping-using-php-simple-html-dom-parser.md): This tutorial will explain how to use PHP Simple HTML DOM Parser to extract specific content from a website and publish it into another website. Web scraping is the process of extracting data or content from a website. The extracted data or content can be published on other websites or saved into a... - [PHP: Estimate Reading Time](https://codethepixel.com/php-estimate-reading-time.md): This tutorial will show how to create a function to estimate the time for reading some text on your web or application. Many websites have shown the estimated reading time for the users at the same time may be helpful for the users to know how long they need to finish the reading. - [Animated Line](https://codethepixel.com/animated-line.md): The animated line tutorial is created using HTML and CSS. developer can use animated lines to enhance their application or web UI to make it look more attractive. It is recommended to use a web-kit web browser such as Chrome or Firefox. - [Glowing Animated Box Using CSS](https://codethepixel.com/glowing-animated-box-using-css.md): There are few methods to create a glowing effect using CSS. This tutorial will guide you to create a simple box using HTML and CSS. First, create a basic HTML page and save it as index.html. ## Blog - [Exploring the Next Era of Front-End: My First Impressions Testing Bootstrap 6 (Alpha)](https://codethepixel.com/blog/exploring-the-next-era-of-front-end-my-first-impressions-testing-bootstrap-6-alpha.md) ## Optional - [About](https://codethepixel.com/about.md): Who writes Code The Pixel, what it covers and how to get in touch. - [Privacy Policy](https://codethepixel.com/privacy.md): What Code The Pixel collects, why, how long it is kept, and your rights under the PDPA. - [Terms of Service](https://codethepixel.com/terms.md): The rules for using Code The Pixel, its content and its comments. - [All tutorials](https://codethepixel.com/tutorials) - [RSS feed](https://codethepixel.com/feed)