INTRO

The FULL STACK.

The Full Stack is the set of technologies that are required to build a web application. A web application uses dynamic data from databases and the user to customize web pages and provide special functionality for the application.

Database. The foundation of a full stack application is the database. The database provides data that has been previously stored for an application, and it provides storage for new data coming from the application's users.

Server Scripts. The second level of a full stack application is the server scripting (sometimes called "middleware" or "back-end") that runs on the webserver and moves data between the database and the web browser. Server scripting also provides "business logic" that manages user accounts, creates customized experiences, and supports the application's functionality.

Browser. The top layer of a full stack system is the "presentation layer" -- the web page that is displayed in the browser. This is also known as the "front end" and contains the information actually seen by the application user. This includes the user interface, graphic design, and logic that supports application functionality.

The AMP Platform.

The AMP Platform is a collection of technologies used on the Apache webserver to create a full stack application. "AMP" is an acronym for Apache/MySQL/PHP.

Apache. Apache is web server software. It runs on the server hardware to provide the functionality for serving web pages with the HTTP protocol. It accepts connections and browser requests via http/https, and delivers HTML back to the web browser. Apache can run several server scripting languages, such as Perl, Python, and PHP.

An alternate server called nginx can sometimes be used in place of Apache. If you are an nginx enthusiast, you may want to experiment with swapping Apache with nginx.

MySQL. MySQL is database management software (DBMS), which runs on the server. MySQL can contain many databases, each with many tables. The databases and tables can be "queried" with a special language called "Structured Query Language", or SQL. SQL queries can be simple or very complex. The queries are passed to MySQL and actions are performed on the databases. Queries can store data, return data sets, update existing records, or delete records. Queries can perform other actions that are similar to programming operations, as well.

Note: MariaDB is a similar DBMS and is sometimes used instead of MySQL. The difference between MariaDB and MySQL is the licensing agreement and a few features.

PHP. PHP is a very powerful server scripting language. There is very little PHP cannot do. In a full stack application, PHP is used to compile the information sent back to the browser. When the Apache server sees that a requested file has "php" in the file extension, it runs the PHP script to dynamically compute the contents of the web page. Typically, PHP will be used to compose an SQL query, send it to MySQL, process the resulting data, and then output HTML (or JSON, XML, or other data), which is sent to the browser.

The Languages.

Building a Full Stack web application requires that you work in a few languages at once. This can be a daunting task, and requires that you have very good conceptual awareness --a "mental map"-- of the process as you work. Often, one language is used in the context of a different language and quoted as a string. For example, PHP may output a quoted string with HTML markup to the browser. Or it could be a passage of Javascript. Either of these quoted stings could have their own embedded quoted values, so this demands careful attention to the use of quotes, escaping, and language syntax. This is a skill that takes time to master. There is no substitute for paying your dues here.

Languages:

  • HTML
  • CSS
  • Javascript, JSON, and various libraries, such as jQuery
  • SQL
  • PHP

Most code is developed in the context of a PHP script. A PHP script is simply a script with the extension ".php" in the file name. It can contain simple HTML markup, and the markup will be passed to the browser as-is. However, if the script contains the PHP tags of "<?php" and "?>", the script between the tags will be processed as PHP code.

Generally, the end product of the PHP code will be one of the browser languages, which will be combined with the HTML/CSS/JS outside the PHP tags and sent to the browser. There are many forms of doing this. HTML markup can be built inside the PHP script, or PHP variables can be dropped into HTML with inline PHP tags. Sometimes loops are used to build rows of a table, and so forth.

The intermediate steps before PHP output is sent to the browser can be almost anything you can imagine, and this is what gives PHP its power. SQL queries, image processing, even access to remote resources are possible.

The possibilities don't stop with output to the browser. Using Javascript and AJAX, interactive communication between the browser and the server are opened up. User data can be sent from the browser back to the server using the POST protocol, and PHP can output JSON in response, sending data that the browser page can process and display.

The Server.

All of this requires a server for running the PHP, the MySQL database, and the rest. You can do it by working on a server account, or you can set up your own server on your local machine to work "localhost". The second option is a much more responsive development environment. You get the project working offline, then move it to server account.

The simple way to do this is to use one of the "AMP" products -- MAMP, WAMP, or XAMPP. These products handle the complete setup: Apache, MySQL, PHP, and GUI-based interface for MySQL called phpMyAdmin. So let's go!