Objectives

Students will be able to:

  • use PHP to place the results of an SQL query onto a webpage

Full Stack Web Developer

They can design the Front End of the webpage/site - this is what the user sees when a webpage is downloaded from a web server. Technologies such as:

  • HTML
  • CSS
  • Javascript

are required to be a Front-End Developer.

They can also design the Back End of the webpage/site. This is what the user doesn't see. This is where calculations happen, database tasks are completed, passwords are processed.

Back-End Developers need skills in server-side technologies such as:

  • SQL
  • PHP
  • Node.js
  • Python
  • Java

So, Full Stack Developers have both Front-End and Back-End skills! They can do everything.

As you can imagine, they are saught after!

Address

460-0026

Aichi

Nagoya

Naka Ward

2-17-13

Full Stack

 

Full Stack Web Developer

What is a web developer?

In this review project, you will adopt the role of Full Stack Developer.

The Development Environment

So what environment does a Full Stack Developer work in?

The Front End Development work is pretty straightforward - it can be done on any client device which has a browser.

This is possibly because browsers can directly process front end languages like:

  • HTML
  • CSS
  • Javascript

But what about backend laguages like PHP and SQL?

When your client device requests a file from a server which contains PHP, the server processes the PHP and only sends HTML 9or other front-end languages) back to the browser for processing.

PHP Intro

Some web services use PHP, a server-side language. Here is a common scenario:

  • Your browser sends a request to a server, eg facebook.com
  • PHP code is executed on the server. It may be used to:
    • read user input forms
    • run SQL queries
    • process the query results
    • generate dynamic HTML
  • the HTML generated is sent back to the client (not the PHP, it only runs on the server side, not the client side)

Set up #1

Import the following csv file into a database. Make sure you identify (or create) a primary key.

data file

Set up #2

You will be working with file in this unit.

Download it onto your device.

In the first video below, you will be shown where to store this file.

Part 1

Let's a webpage to a database.

Follow the video.

Part 2

Now let's:

  • run a query and grab the result
  • process the result
  • generate dynamic HTML eg create a of data.

Follow the video.

Worksheet

Complete the worksheet.

C.R.U.D.

Now that we've figured out how to connect a webpage to a database, we can start to perform the following operations on the database:

  • Create - create new records in the database
  • Read - read records from the database (as we did above)
  • Update - update records in a database eg if someone's address changes
  • Delete - delete records from the database

These fundamental operations are sometimes referred to as CRUD.

Click the purple CRUD button at the top of the page to explore these concepts.

C.R.U.D.

essential vocabulary

database querycriteriaimport evidence table integer screenshot record text ascending field double descending data type Yes/No

SUBSCRIBE

Join my mailing list to receive updates on the latest blog posts and other things.