Web Development Basic

belajar-web.md

Tools Untuk Pengembangan Web

1. Code Editor / IDE

• VSCode ( recommended )
• SublimText 3
• Notepad ++
• Vim
• Text Editor lain

2. Alur Belajar

• Bagaimana Internet Bekerja - (Optional)
• HTML / HTML5 *
• CSS *
• JavaScript *
• PHP / Python / Ruby / JavaScript - (Pilih Salah Satu)
• Database - MySQL / PostgreSQL
• Web Hosting

3. Framework Web Development

• PHP
  • Laravel ( recommended ) - https://laravel.com/
  • Code Igniter - https://codeigniter.com/
• WordPress ( optional / highly recommended ) - https://wordpress.org/download/
• Python
  • Django
  • Flask
• CSS Framework
  • Bootstrap ( recommended ) - https://getbootstrap.com/
  • Tailwind CSS ( advanced ) - https://tailwindcss.com/

4. Web Server

• Apache2
• Nginx

Yang Penting dari HTML

0. Dasar elemen di head tag ( optional )
1. Dasar penggunaaan Element & Tag
2. Inline & Block Element
3. styling dengan CSS ( Internal & External )
4. embed script ( CSS dan JavaScript )
5. Menstruktur Data ( Table / Div )
6. Membuat list item sederhana ( ul / ol > li )
7. Menggunakan Gambar ( PNG / JPG )
8. Menggunakan SVG
9. Iframe

Pendalaman Bahasa Pemrograman

1. Dasar Syntax ( variabel / tipe data / aturan dasar )
2. Conditional ( if / else / switch )
3. Perulangan ( while loop, for loop )
4. Fungsi ( Function )
5. OOP ( Object Oriented Programming )
6. Debugging ( Melihat keluaran program / Melihat error program )

Untuk Diinstal di linux

1. Visual Studio Code ( atau text editor lain )

• download di https://code.visualstudio.com/ | lalu pilih instalasi sesuai distro linux ( cth : kali-linux : .deb )

2. Web Server

• Cara mudah : lampp , download di https://www.apachefriends.org/index.html - pilih linux
• apache2 : apt install apache2
• nginx : apt install nginx

3. PHP
4. JavaScript ( NodeJS )
5. Database

• MySQL : apt install mysql
• Postgresql : apt install postgres | atau googling 'how to install postgresql in linux x'

Lanjutan

1. Cloud Service -> Amazon Web Service ( AWS ) , Google Cloud Service
2. Front End -> ReactJS , VueJS
3. Back End -> NodeJS , Django , Ruby On Rails

Extension untuk VSCode

1. Emmet -> snippet untuk html
2. Tag Auto Close & Tag Auto Rename
3. Prettier
4. ...

Tempat Belajar / Situs Web

1. freecodecamp - https://www.freecodecamp.org/
2. W3Schools - https://www.w3schools.com/
3. Udemy ( Video ) - https://www.udemy.com
4. Youtube - https://www.youtube.com | Channel :

• Web Programming Unpas | Sandika Galih
• FreeCodeCamp
• WebDev Simplified
• Dev Ed
• Derek Banas
• Dev Tips
• Fireship

** 19/04/2021 *** feel free to add another references