Backend Introduction with PHP

    Finally I've accomplished my frontend journey. It was a pithy journey and i learned a lot of new experiences during that. However, that is not the end of the journey.

In web development, theres two main parts: frontend and backend development.

The frontend is the part of the application that users directly interact with. It focuses on User Interface (UI) and User Experience (UX). There is a lot of tech stack you can use in frontend development, though the main stack that people usually use is HTML, JavaScript, and CSS; that's the core of frontend development. 

On the other hand, in order to make a fully functional application, you need to integrate with backend but it's all fine if you want to make an application just with frontend; for example, blog and portfolio website. 

Backend role is to manage server, databases, and application logic. It ensures that when a user submits a form, logs in, or requests data, the server processes that data requests correctly and securely. 

The technologies that commonly used for backend development include PHP, Python, Node.js, Java, and databases like MySQL or PostgreSQL

But in this lesson we'll use PHP and MySQL.

Below. this is what we're gonna create. It's a form but it's fully functioning, in other words, we can create, read, update, and delete the data (in backend development, this is called CRUD).


This is a tricky lesson rather that the frontend development and i hope my explanation is clear enough 😅.

So, in order to run the application, we need a server for our app and database. For now, i use MAMP for practice but you can use XAMPP for a better alternative.

  1. MAMP Setup Installation.
First step is to install MAMP and start the server. In order to start it, click the start button at the top. This is what my MAMP setup looks like.



2. Database Setup.

After we start the server, click WebStart beside Stop button. It will redirect you to this interface.




Click the tools section at the top left corner. After you click it, there is "phpMyAdmin" option and click that option. It'll redirect you to MySQL database.

           3. To make a database for this lesson, just use this command and submit it in SQL Query section.

CREATE DATABASE IF NOT EXISTS pendaftaran_siswa;

USE pendaftaran_siswa;

CREATE TABLE IF NOT EXISTS calon_siswa (

    id INT AUTO_INCREMENT PRIMARY KEY,

    nama VARCHAR(100) NOT NULL,

    alamat TEXT NOT NULL,

    jenis_kelamin ENUM('laki-laki', 'perempuan') NOT NULL,

    agama VARCHAR(20) NOT NULL,

    sekolah_asal VARCHAR(50) NOT NULL

);

INSERT INTO calon_siswa (nama, alamat, jenis_kelamin, agama, sekolah_asal)

VALUES

('Ahmad Fauzi', 'Jl. Mawar No. 12, Surabaya', 'laki-laki', 'Islam', 'SMP Negeri 1 Surabaya'),

('Dewi Lestari', 'Jl. Melati No. 45, Malang', 'perempuan', 'Kristen', 'SMP Katolik Santo Yosef'),

('Rizky Pratama', 'Jl. Anggrek No. 23, Gresik', 'laki-laki', 'Islam', 'SMP Muhammadiyah 3 Gresik'),

('Citra Ayu', 'Jl. Kenanga No. 7, Sidoarjo', 'perempuan', 'Hindu', 'SMP Saraswati'),

('Bagus Saputra', 'Jl. Dahlia No. 19, Mojokerto', 'laki-laki', 'Islam', 'SMP Negeri 4 Mojokerto');


Those command is called SQL Query. it'll automatically create database, use database, create table, insert data into table.

          4. Project Directory.

The last step is we need to create the project directory. However, in order to start the project, we need to make the project inside this directory: /Applications/MAMP/htdocs/ . There is a few php files you need to make inside your project. Below is what you need to create.


           5. Code.

You can check the code result through my github; there's also a result video, you could check it out: https://github.com/farrasnazhif/pweb-a/tree/main/pendaftaran-siswa-baru
  • If you want to check your code result on your local computer. Run this URL in the browser: http://localhost:8888/(your-project-name) 

Comments

Popular posts from this blog

Typewriting Speed for Coders

Building Profile Page with HTML

Learning by Doing: Web Development Course Landing Page