Sumber Daya Pengembang Web Kompilasi-Mega

Internet terus tumbuh dan ada ratusan ribu sumber daya kolektif untuk pengembang web yang akan datang. Dari artikel online, tutorial, alat, panduan, hingga video, Anda dapat mempelajari apa saja melalui Web. Benar-benar tidak pernah lebih mudah untuk melompat online!

Di bawah ini saya telah mengumpulkan banyak sumber daya pengembang web yang sangat membantu. Ini termasuk materi pemula untuk HTML5 / CSS3 bersama dengan teori yang lebih rumit untuk JavaScript dan pemrograman PHP. Mungkin bagi beberapa pengembang yang antusias untuk mempelajari bahasa-bahasa ini dan membangun aplikasi web yang sangat populer mirip dengan Twitter atau Tumblr. Jika Anda memiliki minat pada aset bermanfaat untuk pengembang web modern maka Anda akan menyukai kompilasi sumber daya yang dapat dipercaya ini.

Majalah Online yang Bermanfaat

Dunia blogging telah meledak dengan ratusan ribu penulis baru mengambil ke Internet. Banyak dari blog online ini difokuskan pada desain & pengembangan web. Anda dapat menemukan banyak sumber daya bermanfaat hanya dengan membalik-balik RSS feed ini.

Bergantung pada jenis bahasa yang Anda kode, itu akan menentukan minat Anda pada salah satu blog ini. Kami dapat fokus pada pengembangan web dan menganggap ini mencakup semua pekerjaan front-end (HTML5 / CSS3 / JavaScript) serta skrip back-end sederhana (PHP / RoR / Python / SQL). Saya telah mengambil kebebasan untuk membangun satu daftar blog dev paling populer yang berfokus pada kode front-end dan back-end.

Nettuts+
24 Cara
Webmonkey
Memecahkan Kode
Arsitektur web
Memeriksa elemen
Kode Kucing
Line25 Blog Desain Web

Tentu ada banyak orang lain untuk dipertimbangkan. Saya sarankan memukul Google untuk mencari tutorial dan artikel tentang bahasa dev pilihan Anda. Kemudian menggunakan agregator umpan RSS seperti Google Reader Anda dapat mengatur daftar semua artikel terbaru dari majalah ini. Ini adalah cara yang bagus untuk memulai hari kerja Anda, atau bahkan menghabiskan sedikit waktu melalui tutorial.

jQuery Plugins Galore

Baik perpustakaan inti jQuery dan jQuery Mobile telah memperoleh banyak daya tarik pada tahun lalu. Pustaka sumber terbuka ini bekerja untuk merancang pengalaman front-end yang penuh dengan animasi yang kaya dan fitur-fitur Ajax yang mudah diimplementasikan, meskipun perpustakaan seluler belum cukup memahami induknya dalam hal plugin dan kode pihak ketiga.

Demikian pula bgStretcher produk fantastis lainnya dapat digunakan sebagai skrip latar belakang yang dinamis. Ini akan mengambil serangkaian gambar, dan beberapa skala ukuran secara proporsional dengan resolusi layar pengguna Anda. Lihatlah demo yang bagus untuk melihat ini dalam aksi. Kedua plugin ini gratis untuk diunduh, dan berperilaku sebagai contoh sederhana untuk kode pihak ketiga yang luar biasa yang dibuat dari jQuery. Bekerja dengan sumber daya ini akan menghemat banyak waktu untuk pekerjaan proyek sehingga Anda tidak perlu menemukan kembali roda.

Secara umum saya juga merekomendasikan untuk menjelajah situs web Ajax Blender dan Dynamic Drive untuk snippet / plugins kode JavaScript. Perpustakaan tidak besar tetapi terus berkembang dari konten yang dikirimkan pengguna baru. Situs-situs tersebut tidak hanya mencakup plugin jQuery tetapi juga pustaka Mootools dan Prototipe.

Jika Anda akhirnya bekerja dengan jQuery Mobile library, saya ingin merekomendasikan alat lain jqmPhp. Ini adalah kelas PHP dinamis di mana Anda dapat mereferensikan fungsi-fungsi sederhana ke baris output dan baris kode HTML5 yang ditenagai melalui jQuery Mobile. Ini sejujurnya cara termudah untuk membuat prototipe aplikasi seluler dinamis yang dibangun di sekitar kerangka PHP. Blog situs memiliki banyak contoh referensi untuk digali.

Bangunan di HTML5 & CSS3

Ketika kita berbicara tentang pengembangan web front-end, umumnya semua tentang efisiensi. Anda tidak memiliki masalah yang sama dengan membangun situs web dalam HTML / CSS seperti halnya Anda mengkode aplikasi Ruby back-end. Tidak ada logika nyata atau penanganan kesalahan dalam HTML - kebanyakan tentang seberapa cepat Anda dapat skala desain tata letak dengan benar di semua browser.

Pertama saya harus mulai dengan merekomendasikan HTML5 Boilerplate. Ini adalah templat tulang kosong yang dilucuti yang mencakup semua “standar” Elemen halaman web HTML5 dalam satu paket. Ini termasuk stylesheet default, JavaScript, favicon, ikon sentuhan Apple, dan banyak barang lainnya. Ini adalah proyek gratis 100% dan Anda bahkan dapat berkontribusi pada repo Github mereka. Ini adalah sumber yang harus dimiliki untuk semua pengembang sebelum memulai proyek web yang serius.

Sekarang jika Anda mematikan pelat ini, maka Anda memiliki opsi untuk menambahkan semua kode kustom Anda sendiri. Tapi saya sarankan mengambil langkah selanjutnya dan membangun dengan aplikasi seperti Initializr. Ini akan menghasilkan tata letak situs web yang khas dan bahkan memungkinkan Anda untuk menyesuaikan elemen mana yang termasuk dalam paket boilerplate Anda. Kode Google Analytics, file jQuery, .htaccess, atau web.config yang diperkecil, plus sekitar selusin opsi lain yang tersedia.

Desainer CSS

Sekarang kita telah melihat sedikit ke dalam pengkodean HTML5 kita juga harus mempertimbangkan beberapa kerangka kerja CSS3 yang populer. Ini lebih terbuka daripada template HTML karena Anda dapat melakukan lebih banyak dengan CSS. Desainer juga akan menyadari kesulitan dalam membangun kode yang memenuhi standar untuk semua browser web modern.

Golden Grid System fantastis sebagai kerangka kerja pada desain web yang responsif. Layout ini akan beradaptasi dengan layar ponsel dan lipat ke dalam saat Anda mengubah ukuran jendela browser. Ini juga membantu dengan perencanaan lebar dan ukuran setiap area kolom. Blueprint adalah kerangka kerja CSS lain yang berguna yang harus Anda periksa. Ini bagus untuk membangun situs web khusus dan menawarkan dokumentasi yang fantastis.

Namun, ketika datang ke alat CSS, CSS3 PIE harus berada di tiga favorit saya. Ini adalah aplikasi web sederhana yang mengeluarkan kode yang tepat untuk membuat efek CSS3 yang didukung di Internet Explorer 6-9. Anda dapat membuat gradien linier dinamis, sudut bulat, dan bayangan kotak dengan pengaturan yang dapat disesuaikan. Situs ini memiliki contoh IE jika Anda ingin memeriksanya juga.

Pengembang juga akan berusaha untuk memperkecil ukuran file mereka untuk produksi. Bersihkan CSS adalah salah satu sumber daya di mana Anda dapat memilih dari berbagai opsi untuk menyederhanakan kode Anda dan mengurangi ukuran file. Alternatif lain, Code Beautifier tidak menawarkan banyak pilihan tetapi mungkin lebih mudah digunakan.

Menyesuaikan Tema dengan WordPress

Penerbitan WordPress dengan mudah adalah CMS paling populer di era ini. Kami telah melihat kemungkinan jutaan blog dan situs web baru semuanya didukung oleh solusi manajemen konten yang fantastis ini. Karena itu, pengembang WordPress memiliki permintaan tinggi untuk membuat widget khusus dan tema situs web.

Rilis baru Constellation Theme memberi pengembang WordPress titik awal yang lebih mudah daripada templat default. Tema Twenty Eleven yang baru sangat licik dan minimalis, tetapi tidak dapat bersaing dengan keseluruhan templat tema yang dibangun di atas HTML5Boilerplate. Tema Constellation WP bahkan mencakup pertanyaan media untuk berbagai resolusi perangkat seperti iPhone dan tablet iPad.

Wonderflux adalah template tema WordPress lain yang tidak terlalu jauh dalam pengembangan. Baru-baru ini dirilis dari beta ke v1.0 bersama dengan beberapa dokumentasi online. Tema ini sedikit lebih rumit daripada Constellation yang memberi Anda lebih banyak kontrol atas tata letak. Pengembang telah menyertakan kait, fungsi, dan filter PHP khusus untuk membuat situs WordPress Anda lebih dinamis.

Pengembang WP yang serius harus memeriksa kedua solusi untuk melihat apakah salah satu akan membantu pekerjaan proyek di masa depan.

Menemukan Gratis Pengembang Web

Dibandingkan dengan PSD dan grafik, komunitas pengembangan web tampaknya agak kurang dalam galeri freebie. Anda selalu dapat menemukan skrip hebat di Github, tetapi Anda harus sering mencari dan menguji sendiri.

Sulit menemukan situs web yang menawarkan unduhan dan demo gratis serta contoh skrip. Sumber daya baru favorit saya adalah CodeVisual yang mengatalogkan alat pengembangan yang dikirimkan pengguna, plugin, perpustakaan, dan hal-hal lain yang rapi. Tata letaknya diatur seperti galeri di mana setiap halaman menyertakan tautan ke produk, tangkapan layar demo, dan beberapa perincian lebih lanjut.

Galeri ini mencakup ratusan contoh kode templat HTML / HTML5, pustaka CSS3, dan tentu saja banyak hal jQuery juga. Saya juga menemukan ini adalah situs web yang bagus untuk mengirimkan kode sumber terbuka Anda kepada publik. Nama Anda terikat pada kiriman, ditambah Anda dapat menempatkan tautan ke situs web Anda sendiri di mana pengguna dapat mengakses kode.

API Aplikasi Web

Tren yang sangat populer dalam pengembangan web modern adalah membangun API sebagai aplikasi pihak ketiga. Sebagian besar merek jejaring sosial arus utama menyertakan API yang berfungsi dan segmen dokumentasi tepat di situs web mereka. Plus ada banyak kelas pembungkus gratis di Github yang ditulis dalam semua bahasa pemrograman back-end utama.

Pengembang harus merasa nyaman bekerja dengan jenis pustaka kode ini karena permintaannya meningkat. Menggunakan sistem OAuth Anda dapat dengan cepat membangun basis pengguna dari banyak aplikasi ini. Saya telah mencantumkan di bawah ini hanya beberapa referensi ke API online populer dan dokumentasi lengkapnya.

API Twitter
CloudApp API
API Instagr.am
API eBay
API Foursquare
API Dribbble
API Github

Manfaatkan sumber daya ini pada proyek-proyek baru bila memungkinkan. Web menjadi lebih terhubung dan pengguna selalu berbondong-bondong ke aplikasi besar berikutnya. Anda dapat merekrut ribuan anggota khusus ke aplikasi Anda ketika pengunjung Anda tidak perlu mendaftarkan akun baru dan sebaliknya dapat mendaftar langsung melalui Twitter atau Facebook.

Sumber Daya Tanya Jawab

Pengalaman paling menguntungkan antara pengembang adalah mengajukan pertanyaan dan mempelajari teknik baru. Komunitas pengembang selalu sangat membantu bagi pendatang baru dan bersedia menawarkan keahlian mereka dalam banyak situasi. Jika Anda memiliki masalah atau pertanyaan spesifik tentang suatu proyek, cari melalui Google untuk forum pengembang web terkait.

Saya pribadi harus merekomendasikan bergabung dengan komunitas Stack Exchange jika Anda belum menjadi anggota. Ini termasuk situs web luar biasa seperti Stack Overflow dan Super User di mana Anda bisa mendapatkan bantuan pemrograman pada dasarnya apa saja. Anggota komunitas memiliki pengetahuan dalam semua bahasa web utama termasuk jQuery dan kelas PHP yang lebih kecil.

Trik rapi yang saya pelajari adalah mencari melalui Google dan melihat apakah masalah Anda telah dipecahkan. Masukkan beberapa kata kunci ke dalam pencarian Google Anda dan tambahkan suffix situs: stackoverflow.com. Semua hasil pencarian yang dikembalikan akan menjadi pertanyaan dari dalam arsip Stack Overflow - jika Anda beruntung, Anda dapat menemukan solusi tepat untuk masalah Anda saat ini.

Pengujian Kecepatan Laman Daring

Alat baru ini yang dikeluarkan oleh Google Developers sebenarnya sangat mengesankan. Aplikasi Page Speed Online akan menganalisis konten situs web Anda dan menghasilkan laporan analitik tentang kecepatan Anda. Ini termasuk solusi yang mungkin untuk mengurangi waktu muat dan menjaga pengunjung Anda di situs lebih lama.

Ini juga dapat membantu Anda menentukan masalah dengan rasio pentalan dan konversi yang lebih rendah. Google Analytics adalah suatu keharusan untuk situs web apa pun, tetapi saya merasa bahwa Kecepatan Laman hanya mencapai tingkat analisis yang lebih tinggi.

Output laporan diberi peringkat dari prioritas tinggi ke rendah dan sering kali mencakup banyak item berbeda. Jika Anda memahami pengaturan LAMP dan bekerja di server Apache maka Anda juga dapat mempertimbangkan modul mod_pagespeed. Secara otomatis melakukan banyak optimasi ini di situs web Anda untuk mengurangi waktu muat dan cache data web penting (gambar, ikon, skrip).

Perangkat Lunak Pengembang Terbaik

Di antara dua Sistem Operasi yang paling populer, Anda dapat menemukan lusinan program. Dari perangkat lunak grafik hingga editor kode sumber dan IDE, ada banyak sumber daya untuk dipilih pengembang web. Tetapi jika Anda mencari saran populer, saya merekomendasikan judul-judul berikut.

Mac OS X

Panic adalah perusahaan perangkat lunak yang menciptakan Coda - sejauh ini merupakan aplikasi pengembangan web terbaik untuk Mac. Anda memiliki akses ke editor kode sumber, terminal, dan klien FTP di mana Anda dapat membuat perubahan langsung ke file server. Coda juga mendukung daftar panjang penyorotan sintaks untuk bahasa seperti HTML, XML, CSS, JavaScript, PHP, SQL, dan banyak lagi.

Namun jika Anda membutuhkan solusi gratis, Anda harus memeriksa Komodo Edit. Perangkat lunak ini dikembangkan untuk Windows dan Mac, open source, dan sepenuhnya gratis untuk diunduh. Ini mencakup semua dukungan yang sama untuk penyorotan sintaks dan banyak fitur serupa seperti Coda (sayangnya tidak ada FTP). TextWrangler adalah solusi gratis lain yang mungkin ingin Anda coba, juga hanya editor teks sederhana.

Untuk aplikasi FTP gratis, periksa Cyberduck di Mac App Store. Meskipun secara pribadi saya lebih suka alternatif berbayar seperti Yummy FTP atau Transmit.

Microsoft Windows

Paket perangkat lunak Adobe selalu muncul ketika Anda memikirkan desain dan pengembangan web. Pengguna Windows memang memiliki banyak alternatif untuk Dreamweaver, dan banyak dari mereka benar-benar gratis.

Notepad ++ adalah contoh yang bagus dari beberapa perangkat lunak Win32 open source. Proyek ini masih dalam pengembangan aktif dan sering merilis pembaruan (hampir setiap bulan). Saya suka antarmuka tab dan dukungan untuk begitu banyak plugin tambahan. Seperti yang saya sebutkan di atas Komodo Edit juga ditawarkan untuk Windows XP / Vista / 7, jadi Anda dapat mencobanya sebagai alternatif.

Pengembang web di Windows juga bukan tanpa klien FTP. Filezilla mungkin merupakan alternatif gratis paling populer. Untuk alternatif, lihat daftar klien FTP gratis kami bersama dengan alat serupa.

Sumber Daya Dev Bermanfaat Lainnya

100 Alat Pengembangan Web Penting
Best Of 2011: Plugin dan Tutorial jQuery Berguna Terbaik
Ruby on Rails Tutorial untuk Pemula Pengembangan Web
7 Tren Pengembangan Web yang Menyenangkan untuk 2011

Kesimpulan

Sejauh ini kuartal pertama 2012 telah dimulai dengan keras! Kami telah melihat beberapa konten luar biasa mengalir dari desainer dan pengembang web dari seluruh dunia. Profesional yang membangun untuk web memiliki banyak alat yang dapat digunakan dibandingkan dengan 1-2 tahun yang lalu.

Ini harapan saya bahwa kumpulan besar alat dan sumber daya ini akan mendorong metodologi Anda untuk pengembangan yang lebih baik. Saya suka bekerja dengan pengembang web dan belajar tentang proyek baru setiap saat. Namun hanya ada begitu banyak ruang untuk sumber daya baru yang bisa kami sertakan, jadi saya pasti telah melewatkan beberapa permata. Jika Anda memiliki ide atau saran untuk sumber daya pengembang web terkait, beri tahu kami di area posting diskusi.