DS Log
In my blog, I delve into the world of programming web technologies, Linux, Unix-like, and graphic design using free tools on Linux.
KINGCODE
KingCode Editor (ex Texty Editor) is my project developed using Java Swing. Project is still in development and in beta version. I plan to add additional features focused for PYTHON, PHP, JAVA, C, JS and BASH.
Read more ↗
VUE on Linux
In this guide, I'll walk you through the step-by-step process of setting up Vue.js on your Linux system, empowering you to create dynamic and interactive web applications. Let's harness the power of Vue.js together on the Linux platform!
Read more ↗
Symfony PHP
Dive into the world of Symfony PHP with this comprehensive introduction. In this guide, you'll learn the essential steps to create and manage posts and users, empowering you to build dynamic web applications with ease.
Read more ↗
Trying Linux from Windows
How to set up a PHP development server on Ubuntu 22.04
Text editors
List of text editors for developers.
Read more ↗
Fonts
Important fonts everyone needs to know.
Read more ↗
Try Linux from Windows
Here are some quick videos I made showing how to try out Linux Mint on Windows.
Read more ↗
Sunday, August 18, 2024
PHP chat (APC)
What is APC?
APC (Alternative PHP Cache) is a free and open opcode cache for PHP. It is designed to improve the performance of PHP applications by caching the compiled bytecode of PHP scripts, thus reducing the overhead of parsing and compiling scripts on each request.
Key Features
- Opcode caching to speed up PHP execution.
- User data caching for storing application data.
- Improved performance for high-traffic websites.
Installation
APC can be installed on Ubuntu (and Debians) via APT. Use the following command:
sudo apt-get install php-apcu
Usage
After installation, you can enable APC in your php.ini file (I always restart):
extension=apcu.so
You can then use APC functions like apcu_store() and apcu_fetch() in your PHP scripts.
So what can we do with it?
I was thinking of creating a chat application in PHP, but I couldn't find an existing one that suits my needs. So, I want to develop a chat feature that can be integrated into a WordPress or any other PHP-based project. I have already built frontend here.
This code implements a simple message board application. It uses the APCu cache to store the list of messages, with a limit of 10 messages. When a user submits a new message, the code checks if the message length is within the 256-character limit, and if so, it adds the new message to the beginning of the list, removing the oldest message if the list exceeds 10 entries. The code also provides a way for users to fetch the current list of messages, which is returned as a JSON response. The HTML and JavaScript code in the second part of the file provide a user interface, allowing users to enter messages and displaying the message list, which is automatically updated every 3 seconds.
<?php
$cacheKey = 'message_cache';
if (!apcu_exists($cacheKey)) {
apcu_store($cacheKey, []);
}
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['message'])) {
$newMessage = $_POST['message'];
if (strlen($newMessage) > 256) {
header('Content-Type: application/json');
echo json_encode("Message should be 256 or less.");
exit;
}
$messages = apcu_fetch($cacheKey);
if (count($messages) >= 10) {
array_pop($messages);
}
array_unshift($messages, $newMessage);
apcu_store($cacheKey, $messages);
}
if (isset($_GET['fetch_messages'])) {
$messages = apcu_fetch($cacheKey);
header('Content-Type: application/json');
echo json_encode($messages);
exit;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Message List</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container mt-5">
<div class="row">
<div class="col-md-6 offset-md-3">
<h2 class="text-center">Message List</h2>
<form method="post" action="">
<div class="mb-3">
<label for="message" class="form-label">Enter your message:</label>
<input type="text" class="form-control" id="message" name="message" required>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<ul class="list-group mt-4" id="message-list">
</ul>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
function loadMessages() {
fetch('?fetch_messages=1')
.then(response => response.json())
.then(data => {
const messageList = document.getElementById('message-list');
messageList.innerHTML = '';
data.forEach(message => {
const li = document.createElement('li');
li.className = 'list-group-item';
li.textContent = message;
messageList.appendChild(li);
});
})
.catch(error => console.error('Error fetching messages:', error));
}
loadMessages();
// Reload messages every 3 seconds
setInterval(loadMessages, 3000);
</script>
</body>
</html>
When we run server
php -S localhost:8989 where our script. We can now open two browsers to test script:
I will now work on integrating this into my
frontend gui.
