Belajar HTML - Hello World! (2/13)

 Belajar HTML - Hello World!
Belajar HTML - Hello World!
Selamat datang kembali di seri HTML CodeInfo – pada artikel ini kita akan mulai menuliskan kode HTML untuk membuat web yang sangat sederhana sekali.

Nanti web yang akan kita buat adalah web yang akan menampilkan “Hello World” ke layar.

Karena rasanya kurang afdol kalau kita belajar bahasa baru tanpa membuat aplikasi yang menampilkan “Hello World”.

Saya asumsikan kalian sudah menginstal text editor dan web browser.

Untuk text editor saya lebih suka menggunakan Sublime Text dan untuk web browser saya menggunakan Google Chrome.

Sebelum kita menuliskan kode HTML saya sarankan kalian membuat sebuah folder terlebih dahulu.

Untuk nama folder sendiri bebas terserah kalian, tapi saya sarankan untuk latihan kali ini nama folder samakan saja dengan nama folder yang saya buat.

Karena ini seri html jadi saya membuat folder dengan nama HTML kemudian saya simpan di Local Disk (D:).
Folder HTML
This PC > Local Disk (D:) > HTML
Kemudian di dalam folder HTML kita buat folder baru lagi dan beri nama Latihan1.
Folder Latihan1
This PC > Local Disk (D:) > HTML > Latihan1
Nanti folder latihan ini akan terus bertambah seiring kita belajar sesuatu yang baru mengenai html.

Ok Let's Go!

Pertama kalian buka text editor yang akan kalian pakai untuk membuat web sederhana ini.
Sublime Text
Sublime Text
Sebelum kita menuliskan kode HTML.

Sebaiknya kalian save dulu file nya di dalam folder Latihan1 dengan nama Halaman1.html dan biasakan untuk nama file tidak boleh menggunakan spasi.
Save File
Save: Halaman1.html
Untuk menampilkan "Hello World" di layar kita masukan kode HTML berikut dan simpan di dalam file Halaman1.html yang sudah kalian buat.

<!DOCTYPE html>
<html>
 <head>
  <title>Halaman 1</title>
 </head>
 <body>
  Hello World!
 </body>
</html>
Usahakan untuk menulis kode HTML ini kalian ketik ulang jangan hanya COPAS (Copy - Paste).

Kenapa harus di ketik ulang? Karena supaya nanti kalian terbiasa dengan kode HTML ini sehingga kalian lebih mudah untuk menulisnya.

Sekarang saya akan jelaskan sedikit tentang kode di atas.

<!DOCTYPE html> tag ini berfungsi untuk memberi tahu browser bahwa kita akan membuat HTML menggunakan versi 5 atau versi yang paling baru.

Kemudian tag pembungkus dasarnya adalah tag HTML.

Di dalamnya terdapat dua tag utama yang pertama tag:

<head> berpasangan dengan tag penutupnya </head>

<body> berpasangan dengan tag penutupnya </body>

jadi apapun yang akan kalian tuliskan nantinya harus berada di dalam tag <head> isi tulisan </head> atau di dalam tag <body> isi tulisan </body>.

Di dalam tag <head> terdapat tag <title> tag ini berfungsi sebagai judul dokumen yang kalian buat.

Dan yang nantinya akan tampil di halaman webnya itu adalah yang kalian tuliskan di dalam <body> Hello World! </body>.

Jika kita menulis "Hello World!" seperti contoh kode di atas maka akan tampil di halaman web seperti ini.
Hello World!
Hello World!
Jadi selamat, ini adalah website sederhana pertama kalian.

Untuk artikel selanjutnya kita akan bahas tag apa saja sih yang boleh ada di <body> dan tag apa saja yang boleh ada di <head> lalu struktur dari tag itu sendiri.

Tapi sebelumnya ada artikel yang akan saya bahas mengenai text editor yang saya gunakan.
Belajar HTML - Code Editor (3/13) 
Kalian juga bisa baca artikel sebelumnya.
Belajar HTML - Pendahuluan HTML (1/13)
Juga bisa baca artikel selanjutnya, supaya kalian bisa lebih paham tentang dasar HTML.
Belajar HTML - Tag (4/13) 
Belajar HTML - Paragraf (5/13) 
Belajar HTML - Heading (6/13) 
Belajar HTML - List (7/13) 
Belajar HTML - Hyperlink (8/13) 
Belajar HTML - Image (9/13) 
Belajar HTML - Table (10/13) 
Belajar HTML - Table Merging (11/13) 
Belajar HTML - Form (12/13) 
Belajar HTML -  Form (Lanjutan) (13/13) 

Belajar HTML - Pendahuluan HTML (1/13)

Belajar HTML - Pendahuluan HTML
Belajar HTML - Pendahuluan HTML
Selamat datang di web CodeInfo - ini adalah artikel pertama dari seri pertama yaitu seri mengenai HTML.

Dimana pada seri ini kita akan bahas mengenai HTML mulai dari:

Apa itu HTML?

Bagaimana sejarah HTML?

Fungsi dari HTML?

Sampai nanti kita akan membuat website sederhana menggunakan bahasa HTML.

Pada artikel ini saya akan bahas mengenai pendahuluan HTML. Jadi disini kita tidak akan ngoding dulu, kita akan mulai ngoding pada artikel berikutnya.

Ok, kita langsung mulai saja.

Apa itu HTML?

HTML itu singkatan dari Hypertext Markup Language. Jadi dia merupakan bahasa markup atau Markup Language bukan bahasa pemrograman.

Seperti yang kalian tahu bahasa pemrograman itu dia punya variablefunction, terus dia punya struktur control seperti pengkondisianpengulangan, dan lain sebagainya.

Nah HTML itu di sebut Markup Language karena di dalamnya itu terdapat serangkaian markup yang nantinya markup itu akan kita sebut dengan tag yang berfungsi untuk memberi tahu browser bagaimana sebuah konten akan ditampilkan.

Misalkan nanti kita akan menampikan sebuah teks. Nah, teks itu harus kita kasih tahu dulu menggunakan tag atau markup akan kita jadikan apa?.

Apakah paragraf?

Judul halaman? atau

Judul artikel?

Lalu kenapa di sebut Markup? Karena seperti penjelasan di atas yaitu berfungsi untuk memberi tahu browser bagaimana sebuah konten akan ditampilkan.

Itu bedanya antara Markup Language dengan Programming Language.

Bagaimana sejarah HTML?

Nah, HTML ini pertama kali di ciptakan oleh seseorang yang bernama Tim Berners-Lee.

Bapak Tim ini adalah seseorang yang berjasa sampai saat ini, kenapa kita bisa mengakses web setiap hari itu gara-gara bapak Tim Berners-Lee ini.

Tapi selain menciptakan atau mengajukan spesifikasi HTML yang pertama, dia juga menemukan banyak hal seperti:

HTTP

HTML

WWW

Web Browser

Web Server

Web Page

Jadi gara-gara bapak inilah kita bisa menggunakan media sosial setiap hari seperti facebooktwitterinstagramwhatsapp, dan lain sebagainya.

Nah selain itu juga, dia sekarang menjadi direktur dari sebuah organisasi atau konsorsium yang namanya W3C atau World Wide Web Consortium. Organisasi ini adalah organsiasi yang tugasnya itu membuat standar-standar untuk segala sesuatu yang ada di web tersebut.

Apa sih yang di lakukan oleh W3C ini?

Kegiatan utama dari W3C ini adalah untuk mengembangkan protokol dan panduan yang akan memastikan perkembangan web tersebut untuk ke depannya.

Dimana organisasi ini berada?

W3C ini tidak mempunyai markas utama, dan W3C ini memiliki gabungan beberapa institusi yang ada di Amerika MIT (in Cambridge, MA, USA), lalu di Francis ERCIM (in Sophia-Antipolis, France), kemudian di Jepang Keio University (near Tokyo, Japan), dan di Cina Beihang University (in Beijing, China).

Jadi orang-orang pinter di seluruh dunia ini bergabung untuk menciptakan standar-standar di dunia web ini.

Lalu standar-standarnya apa saja?

Hampir semua standarnya ada Web Design dan AplikasinyaArsitektur WebWeb Servis, dan lain sebagainya.

Yang akan kita fokuskan pada arikel kali ini adalah Web Design dan Aplikasi yang di dalamnya ada HTML, CSS, dan lain sebagainya.

W3C ini juga mengembangkan HTML & CSS, jadi kalau misalkan HTML punya aturan baru atau tag-tag baru atau ada tag-tag lama yang hilang, itu gara-gara W3C ini.

Lalu bagaimana aturan itu di implementasikan?

Mereka akan membuat aturan itu supaya bisa di implementasikan di Web Browser. Itulah salah satu alasan kenapa kita harus update web browsernya, karena supaya kita juga bisa meng-update teknologi yang di rumuskan oleh W3C tadi.

Tapi karna yang membuat web browser ini berbeda. Mulai dari perusahaannya, developernya, dan lain sebagainya.

Maka setiap browser ini juga mengimplementasikan aturan tadi berbeda juga, walaupun perbedaannya tidak terlalu jauh.

Jadi kalau HTML punya standar atau aturan baru, pasti setelah itu browser juga di update supaya bisa mengakomodir standar atau aturan baru tadi.

Fungsi dari HTML?

HTML itu di ciptakan untuk membuat struktur sebuah halaman dan menyajikan konten.

Nanti kita juga akan menghias halaman tersebut menggunakan CSS dan JavaScript supaya halamannya terlihat lebih cantik dan lebih bagus.

Kenapa harus menggunakan CSS? Bukankah untuk menghias sebuah halaman juga bisa menggunakan HTML.

Memang benar HTML juga bisa menghias sebuah halaman mulai dari memberi warna font atau merubah ukuran font tapi CSS bisa melakukan jauh lebih baik dari pada HTML.

Jadi jangan pernah menghias sebuah halaman menggunakan HTML.

Untuk seri pertama mengenai HTML saya cukupkan sampai di sini, semoga kalian bisa memahami apa yang saya jelaskan.

Untuk lebih jelasnya kalian bisa mencari tahu tentang HTML lebih mendalam lagi.

Untuk artikel selanjutnya kita akan mulai ngoding, kemudian kita akan mencoba membuat website sederhana menggunakan HTML.

Let's Go!!!

Baca artikel selanjutnya, supaya kalian bisa lebih paham tentang dasar HTML.
Belajar HTML - Code Editor (3/13) 
Belajar HTML - Tag (4/13) 
Belajar HTML - Paragraf (5/13) 
Belajar HTML - Heading (6/13) 
Belajar HTML - List (7/13) 
Belajar HTML - Hyperlink (8/13) 
Belajar HTML - Image (9/13) 
Belajar HTML - Table (10/13) 
Belajar HTML - Table Merging (11/13) 
Belajar HTML - Form (12/13) 
Belajar HTML - Form (Lanjutan) (13/13)

15 Situs Belajar Coding Secara Gratis untuk Pemula 2018

sumber gambar: codeinfo.info
Beruntung sekali bagi kalian yang ingin mempelajari lebih dalam tentang bahasa pemrograman atau sering di sebut dengan istilah coding. Karena di era digital seperti sekarang ini, kalian sebenarnya sudah tidak perlu repot untuk mencari informasi seputar bahasa pemrograman cukup menggunakan smartphone saja, kalian sudah bisa mempelajari berbagai bahasa pemrograman yang bahkan mungkin lebih rinci dari informasi yang kalian dapatkan di bangku sekolah ataupun perkuliahan.

Dan lebih beruntungnya lagi sudah banyak sekali situs yang bisa mebantumu untuk belajar bahasa pemrograman secara gratis tanpa pungutan biaya sepeserpun. Maka dari itu, melalui artikel ini saya berikan 15 situs belajar coding secara gratis untuk pemula 2018.

15 situs belajar coding secara gratis untuk pemula 2018

Berikut 15 situs belajar coding yang bisa kalian manfaatkan keberadaannya segali situs ini menyediakan pembelajaran secara gratis.

1. Codecademy

Situs Codecademy merupakan salah satu situs yang memungkinkan kalian belajar coding secara gratis. Situs ini sudah di gunakan lebih dari 24 juta orang untuk mempelajari lebih dalam bahasa pemrograman yang tersedia di sini. kalian bisa belajar banyak tentang bahasa pemrograman di sini, dari mulai HTML & CSS, JavaScript, jQuery, PHP dan bahasa pemrograman yang lainnya.

2. Coursera

Situs untuk belajar coding secara gratis selanjutnya adalah Coursera. Situs ini sudah berdiri sejak tahun 2012 silam. Situs ini adalah sebuah platform yang menawarkan beberapa kelas pemrograman setara dengan mata kuliah di kampus.

Menariknya, selain kalian bisa belajar secara gratis di sini, kalian  juga bisa mendapatkan sertifikat yang menyatakan bahwa kalian menguasai bahasa pemrograman tersebut.

3. GitHub

Situs GitHub dapat memungkinkan kalian untuk mencari buku referensi ketika suatu waktu kalian dalam kondisi terdesak. Bahkan, kalian dapat mencari dan menemukan lebih dari 500 buku tentang pemrograman secara gratis. Dan buku-buku yang tersedia di sini selalu update setiap waktu.

Fakta menarik, jika kalian seorang programmer profesional, sebaiknya kalian mulai membuat akun GitHub karena banyak sekali industri kreatif mencari seorang programmer handal dari situs ini.

4. Udemy

Udemy adalah platform belajar coding secara online yang diciptakan untuk para profesional untuk meningkatkan kemampuan mereka. Meski ada beberapa kelas yang memang membayar, namun ada juga kelas gratis yang bisa kalian manfaatkan, bahkan kalian bisa lebih mudah belajar coding karena di sini tersedia video tutorial yang bisa menunjang kemampuanmu.

5. MIT Opencourseware

Situs ini cukup menarik untuk kalian kunjungi, karena jika kalian sudah merasa cukup dengan pembahasan pemrograman dasar, kalian bisa langsung mengunjungi MIT Opencourseware untuk belajar coding secara gratis yang lebih mendalam lagi. 

Sama seperti situs lainnya, kalian bisa mengambil beberapa jenis pelajaran sekaligus, tapi di sini kalian akan lebih fokus pada coding itu sendiri. Bahkan kalian akan diberi beberapa tugas untuk membantumu lebih memahami bahasa pemrograman tersebut.

6. edX

edX merupakan salah satu platform online-learning yang cukup terkenal di bidang pendidikan teknologi. Situs ini dikembangkan oleh Universitas Harvard dan MIT pada tahun 2012. Sekarang edX telah meangkul lebih dari 60 sekolah yang memiliki latar belakang yang sama.

7. Khan Academy

Situs belajar coding gratis ini sudah cukup tua, karena Khan Academy sudah ada sejak tahun 2006 yang lalu. Metode pembelajaran di sini disajikan dalam bentuk video tutorial, sehingga lebih efektif bagi jutaan pengunjung Khan Academy dan lebih mudah dipahami.

8. Code Avengers

Perusahaan yang berbasis di Selandia Baru ini akan mengajarkan beberapa bahasa pemrograman dengan cara interaktif. Di sini kalian bisa mempelajari bagaimana coding game yang sesungguhnya, coding sebuah aplikasi, serta mempelajari beberapa bahasa pemrograman seperti JavaScript, dan HTML & CSS.

9. Free Code Camp

Jika kalian ingin bersenang-senang dan bermanfaat dalam waktu yang bersamaan, maka Free Code Camp adalah tempat yang tepat untukmu. Banyak komunitas pelajar dan programmer profesional yang bekerja sama untuk saling meningkatkan kemampuan agar mampu menyelesaikan sebuah aplikasi dengan gratis.

kalian akan mempelajari HTML5, CSS3, JavaScript, Database, DevTools, Node.js, Angular.js dan Agile.

10. Hack.pledge

Situs ini cukup menarik karena di sini banyak berkumpul para developer yang memang mendedikasikan kemampuan mereka untuk mengajari orang-orang bagaimana untuk mengenal bahasa pemrograman. Yang lebih menarik dari situs ini adalah bahwa beberapa pengajarnya adalah orang-orang terkenal di dunia pemrograman. Bahkan ada beberapa developer terkenal yang bernama Bram Cohen, beliau adalah penemu software BitTorrent. Jadi kalian bisa belajar coding gratis sambil berbagi pengalaman kalian ke beberapa developer terkemuka di dunia.

11. aGupieWare

Situs aGupieWare merupakan sebuah pengembang aplikasi yang mana sudah disurvei oleh program ilmu komputer dari beberapa lembaga terkemuka di Amerika Serikat. Pada akhirnya, situs ini memiliki kurikulum yang sama berdasarkan program gratis yang juga tersedia di Stanford, MIT, Carnegie Mellon, Berkeley dan Columbia.

12. HTML5 Rocks

HTML5 Rocks merupakan proyek Google yang sudah diluncurkn pada tahun 2010. Situs ini didirikan unuk melawan HTML5 Apple. kalian bisa mendapatkan beberapa tutorial di sini. Semakin kalian sering mengunjungi situs ini, kalian akan bisa memiliki dasar yang lebih baik dalam bidang pemrograman.

13. Code School

Dalam situs ini, kalian akan disajikan beberapa tutorial, contoh kode, latihan, dan penghargaan menarik mengenai bahasa pemrograman. Situs ini bersifat interaktif dalam melakukan pengajarannya.

Ketika kalian berhasil menyelesaikan latihan yang diberikan Code School kalian akan mendapatkan nilai layaknya seperti di sekolah. Situs ini mendukung beberapa bahasa pemrograman yang terdiri dari Ruby, JavaScript, HTML & CSS, dan Objective C.

14. W3School

Situs ini merupakan tempat yang baik untuk belajar pemrograman web. Dukungan dari situs ini cukup lengkap mulai dari tutorial untuk setiap langkah pemrograman, contoh-contoh kode yang dapat langsung ditampilkan secara interaktif. kalian juga dapat mencoba sendiri melakukan pemrograman yang akan ditampilkan secara interaktif.

Bahasa pemrograman yang didukung oleh W3School ini terdiri dari HTML & CSS, HTML5, JavaScript dan masih banyak bahasa pemrograman lainnya.

15. LearnStreet

Situs ini menyediakan tutorial, menu latihan, dan proyek untuk belajar pemrograman dari JavaScript, Ruby, dan Python. Untuk metode latihannya, situs ini hampir sama dengan Codecademy dan Code School dimana penggunanya akan disajikan penjelasan inti, glosarium, video tutorial dan lain sebagainya.

Menariknya di situs ini terdapat proyek-proyek aplikasi yang dapat diujikan oleh situs ini kepada penggunanya agar dapat memahami struktur program dari proyek tersebut. Selain itu, pada LearnStreet ini kalian bisa menjadi guru untuk memberikan tutorialnya.

Itulah 15 situs belajar coding secara gratis untuk pemula 2018 yang dapat saya berikan. Semoga dengan adanya 15 situs tersebut bisa meningkatkan minat belajar kalian terhadap bahasa pemrograman agar bisa menjadi programmer profesional.

Sumber: