Apa Itu Codepen?

Codepen merupakan Text Editor yang berbasis Online. Text Editor adalah software yang digunakan untuk menuliskan kode program.

Text Editor berbeda halnya dengan Microsoft Word yang disebut juga sebagai Rich Editor.

Terdapat banyak Text Editor yang banyak digunakan oleh programmer, seperti:

  • Visual Studio Code
  • Sublime Text
  • Atom

Text Editor di atas merupakan text editor yang popler dan paling banyak digunakan oleh Programmer. Selain itu, Text Editor tersebut harus diinstall di perangkat sebelum bisa menggunakannya.

Salah satu Text Editor Online yang sering digunakan oleh programmer adalah Codepen.

Codepen bersifat publik dan open source sehingga pengguna akan dimudahkan untuk berinteraksi dengan pengguna lainnya.

Codepen adalah salah satu live code playgrounds yang paling populer. Namun, ada beberapa hal yang membuat situs ini cukup berbeda dengan live code playgrounds lainnya yaitu dari fitur yang disediakan.

berikut ini beberapa fitur bermanfaat dari Codepen, antara lain:

1. Banyak varian HTML, CSS, dan JavaScript

Salah satu fitur menarik dari Codepen adalah banyaknya varian dari HTML, CSS, dan JavaScript yang tersedia.

Untuk HTML, pengguna bisa mencoba menggunakan HAML, Markdown, Slim, atau Jade. Kemudian, untuk CSS, sudah didukung dengan Sass dan SCSS serta Less dan Stylus.

Sementara itu, untuk JavaScript pengguna bisa menggunakan CoffeeScript atau LiveScript.

2. Terdapat pen view yang berbeda-beda

Codepen memiliki pen views yang bermacam-macam. Setiap tampilannya pun memiliki kelebihan masing-masing.

  • Editor View merupakan tampilan default untuk mengedit. Pengguna bisa menyesuaikan ukuran preview coding dan memilih bahasa yang akan ditampilkan.
  • Details View akan memungkinkan pengguna melihat pen’s tag, komentar, like dari orang lain.
  • Full Page View akan membuat pen menjadi layar penuh dalam iframe dan hanya menyisakan footer Codepen.
  • Debug View adalah tampilan layar penuh dan menghapus iframe dan footer Codepen.

Jika menggunakan Codepen Pro, kamu bisa mengakses pen view lainnya, misalnya:

  • Presentation Mode dibuat khusus untuk overheard projector. Jadi, header akan dihilangkan sehingga memberikan lebih banyak ruang untuk pengguna yang ingin mengubah ukuran font dan warna dengan cepat.
  • Live View memungkinkan pengguna untuk menguji karyanya di beberapa perangkat. Pasalnya, pen akan dapat diperbarui secara otomatis saat pengguna mengetik kode.
  • Mode Profesor dalam mode ini orang lain bisa melihat pengguna yang sedang menuliskan kode secara real time. Sesuai dengan namanya, dalam mode ini bisa digunakan untuk saling berdiskusi soal coding lewat ruang obrolan yang tersedia. 
  • Collab Mode sangat berguna untuk sarana kolaborasi beberapa programmer untuk membuat coding secara bersamaan. Di mode ini juga tersedia ruang obrolan untuk sarana berkomunikasi antar programmer.

3. Community

Salah satu fitur yang paling diunggulkan oleh Codepen adalah community yang dibangunnya.

Seperti yang dijelaskan di atas, Codepen menegaskan bahwa mereka adalah komunitas untuk saling berbagi pengalaman antar programmer.

Tidak hanya bisa belajar membuat coding saja, di sini setiap pengguna juga bisa memberikan like dan komentar untuk karya orang lain.

Jadi, komunitas telah menjadi bagian yang tak terpisahkan dari Codepen dan menjadi salah satu fitur yang disukai oleh para penggunanya.

Sumber:

https://aufaroot18.medium.com/cara-menggunakan-codepen-29dadcd1d6ef

https://glints.com/id/lowongan/codepen-adalah/

Loading