Developer Tools for iOS and Android

Yes, you see right! That’s iPad with Web Developer Tools on the photo above! There is a new web browser app called Mr Bug (mrbug.io) for iOS and Android that has built in DOM Inspector, JavaScript console, Network monitor and more. Now you can check a bug on your website even if you are out of your office, or develop your new web app right from your tablet or phone.

 

Some key features:

 

Javascript console = Run any JavaScript command using Console tab:

 

DOM Inspector = Inspect DOM elements, check what is messing your website:

 

Network Monitor = Debug your AJAX requests, check body and headers:

 

This is a story of making an app called Riskometer. The aim of the app was to prevent coronavirus to spread. I will explain how the idea worked from the programmer point of view. Finally the app didn’t start off, because the polish government (which we were talking with for about 3 weeks) refused it, I’ll explain why in the later part.

 

In march 2020, in the time of the biggest lockdown, one of my colleges asked me to join the team that is working on the app for preventing coronavirus. In the team there was already about 30 people, but they didn’t have any programmers. I joined, cause I like interesting projects and I thought what bad can possibly happen. Maybe our app will save someone’s life.. That was worth the try.

 

The idea was simple .. in theory. Google is saving history of location of your mobile device if you have Google account connected – most people have. Now the app should take this data, and analyze it, comparing with location history of people that had covid-19 diagnosed. First, my job was to check out if it is even possible to do with the data that is provided by Google Takeout json files – the only way to get this location history. The big json file in the Takeout contains only GPS coordinates, timestamps and type of transport. The problem with this data was, the GPS coordinates are not accurate here. It can be checked if someone’s path crossed the path with someone infected, but with very bad accuracy – they can be on other side of a street for example. Also checking that someone crossed the path with the infected one was not the point at all. From the government, we’ve get restrictions, when we can assume that someone had a contact with COVID-19 infected person:

 

  • a person lives in the same house with someone infected by COVID-19
  • a person had direct physical contact with someone infected by COVID-19
  • a person had contact with someone infected by COVID-19 in less than two meters and more than 15 minutes 
  • a healthcare worker or another person that looks after someone infected by COVID-19
  • a person that was in the same plane in the distance of two places (each direction) with someone infected by COVID-19

 

We’ve focused on the point when you meet infected person for 15 minutes in less than 2 meters. That was not possible to check it just with the GPS coordinates from Google Takeout. Fortunately in the zip package, there was more files that we could use. There was a folder named “Semantic Location History” that contained JSON files for each month with a bit different data. There was more useful data including activities and visited places in the sequence of visited place -> activity -> visited place -> activity..

For example if you were in some place (house, shop, mall) or you’ve travelled from place A to place B indicating which type of transport did you use like car, bus, on foot etc. 

The most accurate result that we could get from the data that worked with the rule “2 meters for 15 minutes” was to detect if someone travelled in a car with infected one. That was very easy to check with this data. There is information about starting place, ending place, starting time, ending time and type of transport. If this parameters equals to the data of another person, that is very highly probable, that those two people was travelling in the same car, so the distance between them must have been less than two meters. 

Other options were to check if someone was working in the same place, if someone live in the same house, if someone was in a shop / barber / dentist etc. where worked someone infected. But they were not as accurate as travelling in the car, so it ended just as additional information in the app that can be shown.

 

In the first few days of the project we’ve asked volunteers on our Facebook group to get 100 Google Takeout json files (from 100 different people), for the demo. We’ve get them in 3 days, so we could start with creating the mvp. The app was a very simple php (symfony + propel) application that analyzed the json files and put them into the database. After you uploaded your Google Takeout zip file, It just checked if you travelled with someone infected (randomly at first) in a car, or have you been in same place and then displaying you a list of these activities.

 

The results in this mvp looked like this:

 

 

The main problem with the Google Takeout zip packages was providing them by the user. To download the package, user has to login into his Google account, navigate to takeout.google.com, from the list of available data select only location history and then click on export. Then he waits until the package is ready for download (may be a few minutes) and then finally he can download the takeout file. After the file is downloaded, he can upload it to the app, or extract the zip package and select json files from only last month. 

 

The process was too complicated for a regular person, we had to automate it a bit.  From Google there was no any API, or any other way to get this data. There was no way to automate it using just a web application. 

 

With another programmer who recently joined the team working on bluetooth-based module for the application, we came out with an idea of using WebView component to click-through the whole download process. The only thing that user had to do was to login into his Google Account, with all the steps running automatically in the background. Two of us (with some help in design and styling from other people), we’ve made a working mobile app in just one weekend. It worked as it was expected, the user opened the app, logged into his Google account, and after clicking the start button all the magic happened. In the hidden WebView component, the injected javascript code clicked on each button to finally download the file. After the app detected that the file is downloaded, it unpacked the zip and uploaded required json files to the server and displaying the result.

 

That was how the final version of the app looked like:

 

 

 

 

After presenting the app to the government they asked us how much it will be cost for servers for maintaining the server side code. That was really hard to guess. With a help of another programmer that is a specialist in AWS, we’ve came out with the maximum monthly price of €50k (for a whole nation using it, about 0.2 cents for person a month). After this the whole situation all started to be rough. Now the method of gaining the data from users was the problem (GDPR), there was problem that Google may be not able to maintain all the exports at the same time. Even some professor related to the government send an email to everyone involved, that the whole idea of the app is completely wrong, and he presented his research that the GPS coordinates are not accurate, because it can’t be compared to his professional gps. He didn’t even analyze the way of our app worked, but it didn’t matter. After that the whole project was down. The government said that they will pick some other project, and they did. They’ve chosen a company called Polidea that was making an open-source app called ProteGo Safe

Bonus: the JS code (hack) that was injecting into WebView to download Google Takeout JSON file with location history only:

(function(){
    var downloading = false;
    var debug = false;
    var uiDebug = false;
    var forceExport = false;
    var _exporting = false;
    var _v = 3;
    var dbg = null;
    var _alert = null;
    var _preloader = null;
    var _progressBar = null;
    try {
        var dbgEl = document.createElement("ul");
        dbgEl.setAttribute("class","rm-dbg");
        document.body.appendChild(dbgEl);
        dbg = txt => {
            console.log("dbg",txt);
            let li = document.createElement("li");
            li.innerHTML = txt;
            dbgEl.appendChild(li);
        };
        dbg(JSON.stringify([_v,debug,forceExport]));
        let style = document.createElement("link");
        style.setAttribute("rel","stylesheet");
        style.setAttribute("href","/style.css");
        document.head.appendChild(style);

        var _container = null;
        var getContainer = () => {
            if (null == _container) {
                _container = document.createElement("div");
                _container.setAttribute("class","rm-container "+(uiDebug?'rm-debug-mode':''));
                document.body.appendChild(_container);
                let cnt = 0;
                _container.addEventListener("click",e => {
                    if (cnt++ > 5) {
                        uiDebug = true;
                        _container.setAttribute("class","rm-container rm-debug-mode");
                        dbgEl.setAttribute("style","display: block !important");
                    }
                    if (_cnt > 10) {
                        _container.setAttribute("style","display: none !important");
                    }
                });
                _preloader = document.createElement("img");
                _preloader.src = "/Wedges-3s-200px.gif";
                _preloader.setAttribute("class","rm-preloader");
                _container.appendChild(_preloader);
                _alert = document.createElement("div");
                _alert.innerHTML = "";
                _alert.setAttribute("class","rm-alert");

                _container.appendChild(_alert);
                _progressBar = document.createElement("div");
                _progressBar.setAttribute("class","rm-progress-bar");
                _progressBar.appendChild(document.createElement("div"));
                _container.appendChild(_progressBar);
            }
            return _container;
        };

        var setAlert = (txt = "") => {
            if (null == _alert) {
                getContainer();
            }
            _alert.innerHTML = txt;
            return _alert;
        };

        var setProgressBar = (progress) => {
            if (null == _progressBar) {
                getContainer();
            }
            _progressBar.childNodes[0].setAttribute("style", "width: "+progress+"%");
            _progressBar.childNodes[0].innerHTML = ""+progress+"%";
            return _progressBar;
        };

        var tryLang = (versions,operation) => {
            let result = false;
            versions.forEach(version => {
                try {
                    operation(version);
                    result = true;
                } catch (e) {
                }
            });
            return result;
        };
        var setAlertFinish = () => setAlert("Eksport rozpoczęty. Po otrzymaniu jego ukończeniu dostaniesz powiadomienie na e-mail od Google.");

        var downloadDaemon = () => {
            if (!download()) {
                setTimeout(()=>downloadDaemon(),5000);
            }
        };

        var finish = () => {
            setAlertFinish();
            setProgressBar(100);
            downloadDaemon();
        };


        var doExport = () => {
            setAlert("Trwa automatyczny eksport, proszę nie zamykać okna..");
            setProgressBar(5);

            dbg("deselect all");

            if (!tryLang(["Odznacz wszystkie","Deselect all"],version =>  document.querySelector('[aria-label="'+version+'"]').click())) {
                dbg("deselect not found");
                return false;
            }




            setTimeout(() => {

                setProgressBar(20);
                dbg("Select Location History");

                tryLang(["Wybierz Historia lokalizacji","Select Location History"],version => document.querySelector('[aria-label="'+version+'"]').click());

                setTimeout(() => {


                    setProgressBar(30);
                    dbg("Next step");

                    tryLang(["Następny krok","Next step"],version => document.querySelector('[aria-label="'+version+'"]').click());

                    setTimeout(function () {
                        dbg("temp1");
                        setProgressBar(40);
                        document.querySelector("[data-value='TEMP']").click();
                        setTimeout(() => {
                            dbg("temp2");
                            setProgressBar(50);
                            document.querySelectorAll("[data-value='TEMP']")[1].click();

                            setTimeout(() => document.querySelectorAll('button').forEach(el => {
                                setProgressBar(60);
                                if (-1 != ["Utwórz eksport","Create export"].indexOf(el.textContent)) {
                                    dbg("create export");
                                    if (!debug) {
                                        setProgressBar(80);
                                        el.click();

                                    }
                                    setTimeout(() => {
                                        finish();
                                    },800);
                                }
                            }), 800);
                        }, 800);
                    }, 800);
                }, 800);
            }, 800);
            return true;
        };

        var download = () => {



            var dateTest = ((txt) => {
                var res = /^(\d+)\s(\w+)(\s)(\d+): (Historia lokalizacji|Location History)$/.exec(txt);
                if (null == res) {
                    res = /^Utworzone:\s(\d+)\s(\w+)(\s)(\d+)$/.exec(txt);
                    if (null == res) {
                        var enRes = /^Created on:\s(\w+)\s(\d+),\s(\d+)$/.exec(txt);
                        if (null != enRes) {
                            res = [enRes[0],enRes[2],enRes[1],"",enRes[3]];
                        } else {
                            enRes = /^Location History on\s(\w+)\s(\d+),\s(\d+)$/.exec(txt);
                            if (null != enRes) {
                                res = [enRes[0],enRes[2],enRes[1],"",enRes[3]];
                            }
                        }
                    }
                }
                return null != res && (new Date().getDate() == parseInt(res[1]) || new Date().getDate() == parseInt(res[1])+1)
                    && new Date().getMonth() == {"marca": 2,"kwietnia": 3,"March": 2,"April": 3}[res[2]]
                    && new Date().getFullYear() == parseInt(res[4])
            });
            document.querySelectorAll("a").forEach(obj => {
                if (/^takeout\/download/.test(obj.getAttribute("href"))) {
                    [obj
                        .parentNode
                        .parentNode
                        .parentNode
                        .parentNode
                        .parentNode
                        .parentNode
                        .firstChild,obj
                        .parentNode
                        .parentNode
                        .parentNode
                        .parentNode
                        .childNodes[3],
                        obj
                            .parentNode
                            .parentNode
                            .parentNode
                            .parentNode
                            .childNodes[3]
                    ].forEach(date => {
                        console.log(date);
                        if (null != date && dateTest(date.textContent.trim()) && !downloading) {

                            dbg("download "+date.textContent.trim()+" "+obj.getAttribute("href"));
                            if (!debug) {
                                document.location.href = obj.getAttribute("href");
                            }
                            downloading = true;
                        }
                    });


                }
            } );
            if (downloading) {
                dbg("return downloading");
                return true;
            } else {
                return false;
            }
        };



        var run = () => {
            document.querySelectorAll("span").forEach(obj => {
                if (-1 != ["Anuluj eksportowanie","Cancel export"].indexOf(obj.textContent.trim())) {
                    _exporting = true;
                }
            });
            if (_exporting) {
                dbg("already exporting");
                finish();
                return;
            }

            if (!forceExport && download()) {
                setAlert("Pobieranie pliku rozpoczęte...");
            } else {
                if (!doExport()) {
                    dbg("not exporting");
                    getContainer().setAttribute("style","display: none");
                    dbgEl.setAttribute("style","display: block !important");
                }
            }
        };
        run();


    } catch (e) {
        console.error("FAILED",e);
        if (null != dbg) {
            dbg("ERROR "+e.toString());
        }
        setAlert("Error: "+e.toString());
    }

})();



Temporarily, We Transfer Files

tmp.wtf which stands for Temporarily, We Transfer Files, is the Coding’s Cat new web app. If you want to just quickly share a few files with your friend, without registration etc. this service is for you. The files will be removed after seven days.

 

Get the source code

The second reason why the app was created is to show use case for the planeupload.com upload widget. The whole project was created in just a few hours and if you wan’t to get the source code (NodeJS), send an email on codingcatcodes@gmail.com

The Coding Cat got some document that he could not read on his Android phone or iPad showing only error because of read only mode that the mobile devices could not handle. He needed it on other devices than his PC, so he wrote a little ‘hack’  in JS.

Note 1: It was tested on Opera Browser.

Note 2: It converts pages to jpg images. The Coding Cat thinks it could be done preserving text, but he didn’t have more time for this and jpg solution was sufficient.

Note 3: If you’re getting only part of the document visible, try zooming out your browser and then run the script.

Step by step:

  1. Open the document in Google Docs
  2. Scroll to the bottom of the document, so all the pages are present
  3. Open Developer Tools on separate window and choose the Console tab
  4. Paste the code below (and hit enter)
    let jspdf = document.createElement("script");
    
    jspdf.onload = function () {
    
        let pdf = new jsPDF();
        let elements = document.getElementsByTagName("img");
        for (let i in elements) {
            let img = elements[i];
            console.log("add img ", img);
            if (!/^blob:/.test(img.src)) {
                console.log("invalid src");
                continue;
            }
            let can = document.createElement('canvas');
            let con = can.getContext("2d");
            can.width = img.width;
            can.height = img.height;
            con.drawImage(img, 0, 0, img.width, img.height);
            let imgData = can.toDataURL("image/jpeg", 1.0);
            pdf.addImage(imgData, 'JPEG', 0, 0);
            pdf.addPage();
        }
    
        pdf.save("download.pdf");
    };
    
    jspdf.src = 'https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js';
    document.body.appendChild(jspdf);
    
  5. Now the PDF should be downloaded

 

What it does? It iterates trough the document checking for images (Google Drive stores pages as images) then writes it’s contents to a PDF.

Leave a comment if it works for you.

In this tutorial, the Coding Cat will show you how to implement an advanced AJAX PHP uploader, with progress bars, drag&drop, comments, thumbnails etc in just 5 minutes.

We will use a free upload widget from planeupload.com that will store your files on your Google Drive, Dropbox, Amazon S3 or FTP server, and then you can do operations on those files using API requests.

 

1. First, register on https://planeupload.com, it creates your account with Google or Facebook in just a few clicks. You should see a view like this:

PlaneUpload - connect cloud

 

2. Connect your cloud by clicking the icon. With Google Drive or Dropbox is just seconds. After that, your cloud will be added to the list:

PlaneUpload cloud list

 

3. Click on the “Show buttons” button, and then on “Click here to add your first button

Add button

 

4. Your first upload button is created. But we need to embed it in our web application. So go now to “Installation code” tab, and click on “Download prepared code“:

Download prepared code

 

The ZIP package contains ready to use examples with your PlaneUpload’s API key already generated. After unpacking, you should see files like this:

file list

 

5. Move them into your web server directory, and open your browser at address http://localhost/{your directory}/form-attachment.html

You will get example view:

form attachment example

 

6. Attach some files and click the “submit” button. Form is submitted to the “form-attachment-submit.php” script which executes “confirmAttachment” method:

(you can open now the “form-attachment-submit.php” file in your favorite IDE)

After that, a new button with a new directory in your cloud is created, and uploaded files moved to it. The button object is returned. Now you can set it to your app’s database for later use, and render it on your application’s view with simple code:

 

On the browser side, you’ll get an example view, that contains some basic informations:

uploaded

Section that is most interesting to us is the “Files”. Those are fetched from API and parsed with our php script, so we can so some operations on it:

code files

 

7. Short video – check out this short 5 min video for more examples of usage

The Coding Cat has tricked you! The best OS for programmers is of course Linux!

 

 

So in this article it will show you 10 reasons why Linux is the best operating system for programmers.

 

1. Linux is not as easy to maintain as other OS’es.

Someone would think this is a bad thing. Well, not for programmers. With Linux you have to think more while configuring or installing (not apt-get, yum etc.) new programs and features. When something breaks, you can spend hours browsing the internet on the right solution. And the most important part here – you learn new things! Windows or OSX makes developers lazy. They are just calling the support, reinstalling the whole Windows, or buying a brand new Mac.

2. In Linux you are the owner of your computer

You can change everything as you want. Wanna totally different interface looks? No problem! Just install different desktop environment like Xfce or KDE and set up everything as you wish. Some process is not responding, eating too much your resources, or you just want to kill it for no reason? Type “kill <pid>” or “killall <name>” and get rid of it instantly.

3. Workspaces

Workspaces

This is one of the Coding Cat’s favourite features. You can work simultaneously on different subjects, just only switching to different workspace. For example in the first workspace you have your project’s code editors on second there is some operation running that require many windows for monitoring and third is your coffee-break workspace, where you read the Coding Cat’s blog while having a break. The Coding Cat has three monitors and six workspaces set up, that gives him 18 different screens!

4. Terminal

Terminal

In Linux, everything can be done using terminal. You don’t have to go clicking through the jungle of windows when you want to change or check something in your system. Ctrl+alt+t and there you go. All file operations, installing software, checking your computer resources consumption etc. If you want a article about most useful Linux commands, leave a comment here.

..And this is how it looks like in Windows:

Working with windows

5. CRON

Want to run some of your scripts every hour, every two minutes or only sunday at 22PM? Type “crontab -e” in your terminal, and put here your command. As simple as that. Well, there are also some wisest Windows wizards, that can set up this also in their OS. But only check yourself some tutorials on that – you’ll see how f** is that.

6. Customization trough Bash and scripting

You can customize everything with scripting. Don’t like some part of your system, want to change some behavior or add automated features yourself? Linux is open for everything you need.

Psst. want to setup your wallpaper that has a lot of useful information instead of only a picture, and doesn’t consume system resources? Like this:

Linux custom wallpaper with varialbes

That’s very easy to set up. If you wish tutorial about that, leave a comment.

7. Installation from software repositories

When you want to install something on Windows, you have to open your Internet Explorer, then go to some website, download some fishy exe file, and pray, that this is not some malware like WannaCry. In Linux, on most popular programs, just type “apt-get install <name>” (distro dependent), and you’ll get your soft from a secure place. The other benefit from that is you can automate installation of programs you like, in a very easy way. If for example you change your computer often, or have to install the same things on different machines, just create a Bash script that installs everything in one command.

8. Security and encryption

Linux has a lot better user privileges on files resolved than Windows. You don’t need there a heavy antivirus software army that keeps your computer safe and consumes a half of your CPU while scanning trough everything. In Linux, you can set up whole partition encryption, and then your home folder encryption, so your most important code can be encrypted twice by default!

9. Linux servers

Most of the internet runs on Linux servers. If you get familiar with this system on your desktop, it’ll be easier for you to manage servers where you run your projects.

10. Prestige

how they see you

When some programmer asks you: “Which Windows do you have installed on your PC?” and you respond “Linux“, you are like some black magic wizard and Anonymous hacker to him, at the same time. And when he starts complaining, how his Windows is bad and slow, and how last time someone hacked his webcam, you redirect him to this blog post, so he can change his OS, before it’s too late.

Offtopic – Mr. Robot

If you like Mr. Robot series, you must check their website, is the best website made by humans that the Coding Cat has ever seen!

https://www.whoismrrobot.com/

This is a website:

Mr robot website screenshot

 

 

Enter your domain name here:

This blog post will be parametrized for your case

Why installing SSL certificate?

SSL certificate is used for encrypting the data transfered between your website and it’s visitors. It encrypts all the data, including passwords, credit cards, files, preventing others from reading them. Nowadays browsers like Google Chrome show security alerts, when such a website has sensitive form data, and is not using SSL encryption. In this tutorial, the Coding Cat will show how to install free Let’s Encrypt SSL certificate for your website, that auto renews on Debian. On other Linux distributions the process is very similar, you can check it here: link.

Let’s Encrypt certificates expire in 90 days, but you can automate renewal, in this article we will show how. There is also a limit: 20 certificates per week. More about the limit: link.

Before installing the certificate make sure you have domain properly installed. If not, check out our tutorials How to install LAMP and How to configure a domain.

Installing certbot

First you need to add jessie-backports to your sources.list:

sudo sh -c 'sudo echo "deb http://ftp.debian.org/debian jessie-backports main" >> /etc/apt/sources.list'

Then update:

sudo apt-get update

Installing certbot for Apache:

sudo apt-get install python-certbot-apache -t jessie-backports

Installing certbot for Nginx:

sudo apt-get install python-certbot-nginx -t jessie-backports

Installing certificate for a domain

For Apache configuration run:

sudo certbot --apache

For Nginx:

sudo certbot --nginx

You should see something like this:

Certbot - choosing domain

Enter numbers of domains you want to enable HTTPS separated by commas or spaces, like “1 2 3” and press enter.

Then enter your email address, which will receive important notices from Let’s Encrypt about security issues and expiration. Then accept Terms of Service by typing “A” and pressing enter.

∗If you see an error like this (Apache):

Expected </VirtualHost> but saw </VirtualHost></IfModule>

Just add an enter to the end of your VirtualHost configuration file and try again by “sudo certbot –apache” command.

If all went well, you should be able to choose “Easy” or “Secure” mode. In “Easy” mode, all requests are allowed, http and https. With secure mode, all http requests are redirected to secure https. Choose one and press enter.

Next you should see “Congratulations! You have successfully enabled https://{domain}” message

Navigate to your website and check if https works, you can also test on ssllabs.com:

https://www.ssllabs.com/ssltest/analyze.html?d={domain}

Or sslhopper:

https://sslshopper.com/ssl-checker.html#hostname={domain}

 

Configuring auto renewal

To renew your certificates you can use a command:

sudo certbot renew

If you want to automate that, you need to register it on cron table:

sudo crontab -e

Crontab - choose an editor

Choose your editor and press enter.

Now, at the bottom, add a line:

12 3 * * * /usr/bin/certbot renew

so it looks like this:

Crontab - edit

Your auto-renewal task will be executed every day at 3:21 AM. Don’t worry, certbot will renew only certificates that are soon to expire.

 

Enter your domain name here:

This blog post will be parametrized for your case

1. Configuration directory

After you installed LAMP, you are ready to set your application online. To do that, you need to set VirtualHost configuration. Apache2 VirtualHost configuation files are in /etc/apache2/sites-enabled/. A good practice is to put them on /etc/apache2/sites-available/ and then symlink to sites-enabled, so you can remove domains by simply removing symlinks, without deleting the file.

So, go to your sites-available directory:

cd /etc/apache2/sites-available/

2. Create a VirtualHost config file

Create your domain config file, let’s assume, your website files are under /var/www/html/{domain}/

sudo nano {domain}.conf

Then, paste the code:

<VirtualHost *:80>
        ServerAdmin webmaster@localhost
        ServerName {domain}
        ServerAlias *.{domain}
        DocumentRoot /var/www/html/{domain}/
        <Directory />
                Options FollowSymLinks
                AllowOverride None
        </Directory>
        <Directory /var/www/html/{domain}/>
                Options -Indexes
                Options FollowSymLinks MultiViews
                AllowOverride All
                Require all granted
        </Directory>

        ErrorLog ${APACHE_LOG_DIR}/error.log

        LogLevel warn

        CustomLog ${APACHE_LOG_DIR}/access.log combined

</VirtualHost>

Press ctrl+o to save, and ctrl+x to exit.

Then, create a symlink to sites-enabled directory:

sudo ln -s /etc/apache2/sites-available/{domain}.conf /etc/apache2/sites-enabled/{domain}.conf

3. Check configuration and reload

Run this code to test your Apache2. Coding Cat’s advice is to run this code everytime you make changes to Apache configuration. It may save you a lot of trouble.

sudo apachectl configtest

To reload Apache2 without impact of current website visitors, simply run:

sudo service apache2 reload

4. Done! Let’s check if it works

Open your browser, and go to http://{domain}/

If you get DNS errors, check if your domain points at your server:

dig {domain}

If not, you need to configure DNS records at your domain provider.

 

If you see 404 error, check if you have index file under /var/www/html/{domain}/ directory, like index.html or index.php, and make sure you did not receive any errors at step 3.

 

If you see other errors or a blank page, check out error.log file:

tail -f /var/log/apache2/error.log

 

What is LAMP?

LAMP stands for Linux + Apache + Mysql + PHP. In this blog post the Coding Cat will show how to install ready to use LAMP with newest versions: Apache 2.4, Mysql 5.7 and PHP 7.1.

Preparation

If you are on vanilla Debian 8, first update and upgrade:

sudo apt-get update && sudo apt-get upgrade

 

Install Apache 2.4 on Debian 8

Installing Apache is simple, just run the code:

sudo apt-get install apache2

 

Install PHP 7.1 on Debian 8

By default PHP on Debian 8 is in lower version than 7.1, so we need to add some addresses to the sources:

sudo apt-get -y install apt-transport-https lsb-release ca-certificates
sudo wget -O /etc/apt/trusted.gpg.d/php.gpg https://packages.sury.org/php/apt.gpg
sudo sh -c 'echo "deb https://packages.sury.org/php/ $(lsb_release -sc) main" > /etc/apt/sources.list.d/php.list'

Next, we can use apt-get to install PHP with modules we want:

sudo apt-get update && sudo apt-get install php7.1 php7.1-cli php7.1-fpm php7.1-apcu php7.1-apcu-bc php7.1-common php7.1-curl php7.1-intl php7.1-json php7.1-mbstring php7.1-mcrypt php7.1-mysql php7.1-opcache php7.1-soap php7.1-xml php7.1-xmlrpc php7.1-xsl php7.1-zip php7.1-gd php7.1-imap php7.1-intl php7.1-zip

 

Installing Mysql 5.7 on Debian 8

First we need to install libaio1 package

sudo apt-get install libaio1

Then download deb package from mysql website:

sudo wget http://dev.mysql.com/get/mysql-apt-config_0.8.6-1_all.deb
sudo dpkg -i mysql-apt-config_0.8.6-1_all.deb

When you see this screen below, just use arrows to go to this “Ok” and press enter. This is one of the worst UX the Coding Cat have ever seen..

Mysql installation screen

 

Update and install

sudo apt-get update
sudo apt-get -y install mysql-community-server

Done. Check installed versions.

Now you are all set, check your version of PHP:

php -version

Version of MySQL:

mysql --version

Version of Apache

sudo apache2 -v