Install LAMP and VSCODE on Raspberry Pi for Web Development

May 5th, 2019 by cedcraftscodes

In this tutorial, we will learn how to install LAMP stack (Linux, Apache, Mysql, and PHP) and VS CODE in your Raspberry Pi. You can use this to serve your own web server using pi or you want to use Raspberry Pi as a portable web development machine if you do not have a computer with you. By the end of this tutorial, you will be able to run PHP codes and connect PHP with Mysql.

Install APACHE

First, you will need to install Apache. Open up your terminal and execute the following command.

sudo apt-get install apache2 -y

1	sudo apt-get install apache2 -y

After the installation, type the command below. You will see the list of file and file permissions

cd /var/www/html
ls -al

1 2	cd /var/www/html ls -al

Open Chromium and type localhost. You should be able to see the Apache2 Debian default page.

This means that your Apache is working.

Install PHP

To install PHP , run the command below.

sudo apt-get install php -y

1	sudo apt-get install php -y

After the installation, make sure you are still in var/www/html.

cd /var/www/html

1	cd /var/www/html

Let’s delete the index.html file

sudo rm index.html

1	sudo rm index.html

and create a simple php file.

sudo leafpad index.php

1	sudo leafpad index.php

Insert the following code in your index.html file.

<?php phpinfo(); ?>

1	<?php phpinfo(); ?>

Open Chromium and type localhost. If you see the phpinfo page, it means you have successfully install PHP.

Install Mysql

Now let’s install MySql server and PHP-MySql

sudo apt-get install mysql-server php-mysql -y

1	sudo apt-get install mysql-server php-mysql -y

After that, execute this command to proceed with the installation.

sudo mysql_secure_installation

1	sudo mysql_secure_installation

Enter current password for root (enter for none)	Press Enter
Enter to Set root password?.	Type Y
New password: ; Reenter Password	Type in your new Root password and do not forget it. Important
Remove anonymous users.	Type Y
Disallow root login remotely.	Type Y
Remove test database and access to it.	Type Y
Reload privilege tables now.	Type in Y

If you are done with the installation, you should be able to see the “Thanks for using MariaDB!” message.

Now restart your Apache Server

sudo service apache2 restart

1	sudo service apache2 restart

Install PHPMyAdmin

PhpMyAdmin is a free software used to handle database administration or the web. It provides a convenient GUI for working with the MySQL database management system. To install, PHPMyAdmin, run the command below.

sudo apt-get install phpmyadmin -y

1	sudo apt-get install phpmyadmin -y

You will be asked to provide a password for PHPMyAdmin to register with the database server. Enter your desired password and reconfirm if asked.

Now let’s edit our apache2.conf

sudo leafpad /etc/apache2/apache2.conf

1	sudo leafpad /etc/apache2/apache2.conf

And insert the following line at the bottom.

Include /etc/phpmyadmin/apache.conf

1	Include /etc/phpmyadmin/apache.conf

Save the file and restart your Apache Server

sudo service apache2 restart

1	sudo service apache2 restart

Now visit localhost/phpmyadmin and you should be able to see the phpmyadmin login page.

Access Mysql Console and Create a User

Let’s access the Mysql Console and create a user. The recent update of Mysql doesn’t permit us to use the root account so we will need to add a new user.

sudo mysql -uroot -p

1	sudo mysql -uroot -p

Enter your root password created.

Create User

Execute the following commands.

CREATE USER 'user'@'%' IDENTIFIED BY 'user';

1	CREATE USER 'user'@'%' IDENTIFIED BY 'user';

Grant All Privileges

GRANT ALL PRIVILEGES ON *.* TO 'user'@'%' WITH GRANT OPTION;

1	GRANT ALL PRIVILEGES ON . TO 'user'@'%' WITH GRANT OPTION;

Now go back to “localhost/phpmyadmin” login page and login with your user/user credential.

Install VS CODE

Execute the command below to download and add the public gpg keys.

wget https://packagecloud.io/headmelted/codebuilds/gpgkey -O - | sudo apt-key add -

1	wget https://packagecloud.io/headmelted/codebuilds/gpgkey -O - \| sudo apt-key add -

To start installing, execute the curl command below.

curl -L https://code.headmelted.com/installers/apt.sh | sudo bash

1	curl -L https://code.headmelted.com/installers/apt.sh \| sudo bash

Now open up your Code-OSS by clicking the “Raspberry Pi icon -> programming -> Code-Oss”.

If you see a blank black bg after opening your Visual Studio Code, you may need to install an older version of code-oss.

sudo apt-get install code-oss=1.29.0-1539702286

1	sudo apt-get install code-oss=1.29.0-1539702286

Then hold the code-oss to stop it from updating.

sudo apt-mark hold code-oss

1	sudo apt-mark hold code-oss

If you need to unhold. (Execute only if you want to upgrade code-oss to a newer version)

sudo apt-mark unhold code-oss

1	sudo apt-mark unhold code-oss

Open your VSCode, go to “File -> Open Folder” and browse /var/www/html/

Adding Permission for VS Code

You will notice that you won’t be able to add / save a file in /var/www/html/ directory. To add permission execute the chmod command below.

sudo chmod -R 777 /var/www/html/

1	sudo chmod -R 777 /var/www/html/

*Important: Please do not run this on a production server as it defeats the purpose of adding security!

Testing out PHP and Mysql Connection

Go to PHPMYAdmin and create a new database “test” with the following code.

Go to SQL and Run the insert query below.

INSERT INTO `users`(`Fullname`, `username`, `password`) VALUES ('devcraze', 'user', 'user123'), ('administrator', 'admin', 'admin123')

1	INSERT INTO `users`(`Fullname`, `username`, `password`) VALUES ('devcraze', 'user', 'user123'), ('administrator', 'admin', 'admin123')

Now let’s edit our “index.php” file. Paste the following PDO codes.

<?php
$servername = "localhost";
$username = "user";
$password = "user";
try {
$conn = new PDO("mysql:host=$servername;dbname=test", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
}
catch(PDOException $e)
{
echo "Connection failed: " . $e->getMessage();
}
$response = array();
$campus = $conn->query("SELECT * FROM users");
while($r = $campus->fetch()){
array_push($response, 
array(	'id' => $r['id'],
'fullname'  => $r['Fullname'],
'username'=> $r['username'], 
'password'=> $r['password'], 
));
}
echo json_encode($response);
?>

<?php

$servername = "localhost";

$username = "user";

$password = "user";

try {

$conn = new PDO("mysql:host=$servername;dbname=test", $username, $password);

$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

}

catch(PDOException $e)

{

echo "Connection failed: " . $e->getMessage();

}

$response = array();

$campus = $conn->query("SELECT * FROM users");

while($r = $campus->fetch()){

array_push($response,

array( 'id' => $r['id'],

'fullname' => $r['Fullname'],

'username'=> $r['username'],

'password'=> $r['password'],

));

}

echo json_encode($response);

Go to your browser and visit “localhost”. You should be able to see the JSON Array.

[{"id":"1","fullname":"devcraze","username":"user","password":"user123"},{"id":"2","fullname":"administrator","username":"admin","password":"admin123"}]

1	[{"id":"1","fullname":"devcraze","username":"user","password":"user123"},{"id":"2","fullname":"administrator","username":"admin","password":"admin123"}]