12 yaşından 22 yaşına kadar ön uç gelişmeler hakkında neler öğrendim?

Unsplash'ta Teddy Kelley tarafından fotoğraf

Bazen arkadaşlarım bana ön uç gelişime nasıl girdiğimi soruyor. Biraz tökezlediğimi söyleyebilirim; ama gerçek şu ki, gerçekten bilmiyordum. Bu yüzden geçen hafta, 12 yaşımdan beri üzerinde çalıştığım her ön uç projeyi kazmak için İnternet'in karanlık köşelerine derin bir dalış yaptım.

Ve çocuk, bir dalış mıydı?

Yani buradalar. Her korkunç karar, her utanç verici web sitesi, her hata ve ders beni bugünkü geliştirici yapan şey olduğunu öğrendi. İşte tam filtrelenmemiş görkemleriyle.

(Ön uç gelişime yeni başlıyorsanız, yolculuğunuzda zaman kazanacağınızı umduğumda öğrendiğim bilgi külçelerini de ekledim. Yaşlı bir elseniz… Umarım bu hikaye size bir kıkırdama verir ya da iki

12 yaşında

Sahneyi ayarlayayım. 2007’di. Steve Jobs iPhone’u daha yeni tanıttı. Herkes MSN Messenger kullanıyordu. Kimse Windows Vista'yı sevmedi. Bunlar hatırladığım şeylerdi, fakat tam olarak bir web sitesi yapmaya karar verdiğim zamanları hatırlamıyorum.

İnternete giren bir şeyin sihir gibi dünyanın her yerinden biri tarafından görülebileceği fikrini sevdim. Elbette o kadar zor olamazdı. Olabilir mi?

İlk web sitem - bin adımlık bir yolculuk… seçim çerçeveleri ve flaş widget'ları ile mi başlıyorsunuz?

Ben hatalıydım. Zordu. Ne yaptığım hakkında hiçbir fikrim yoktu.

Bir noktada, satır sonu yaratan bir
etiketinin nasıl kullanılacağını bile çözemedim. Koddaki normal bir satır sonunun neden web sayfasında benzer bir sonlandırmadığı konusunda kafam karıştı. Paragraf oluşturan

etiketlerini kullanmayı denedim, ancak sarma kavramını anlamadım. Hatta yeni bir satıra başlamak için bir masa ayarlamayı bile denedim.

İşleri daha da zorlaştırmak için, tüm bu zorlu çalışmalara rağmen, yine de iğrençti (2000'ler için bile). Bağlantıyı MSN Messenger üzerinden onlarla paylaştığımda, arkadaşlarımla dalga geçtiğini hatırlıyorum. Sonra tekrar, onları suçlayabilir miyim? Web 1.0'ın tüm vahşiliğine sahipti: gif, kayan yazı, kötü döşenmiş arka planlar, Flash pencere araçları…. Cesaretimi kırdım. Ve böylece ilk dersimi öğrendim.

Project İlk projen kötü olacak. İlk HTML sayfam korkunçtu. İlk CSS dosyam çok karışıktı Marie Kondo dokunmazdı. İlk mobil uygulamam göz ardı edildi. İlk React uygulamam her dakika çöktü. Ön ucu öğrenmek zordur, çünkü tasarım ve bilgisayar biliminden birçok fikrin kesişimidir ve ilk kez elde edememek tamamdır.
Söz veriyorum daha kolay olacak. Zaman içinde, bir dizi aktarılabilir beceri geliştirmiş olduğunuzu fark edeceksiniz (örneğin, HTML, hem React bileşenleri hem de Android etkinlik düzenleri oluşturmada size yardımcı olacaktır). Bir şeyde kötü olduğunuzu kabul etmek, ön tarafta iyi olmanın ilk adımıdır.

Kötü olduğunu biliyordum ama daha iyisini yapabileceğimi de biliyordum. Bu yüzden Cadılar Bayramı için Gimp'in yardımıyla siteyi yeni bir kat balkabağı ve Evanescent tipografi ile büyüttüm. Hey, oyuncuların büyü ile fantastik bir dünyayı kurtardığı özgün bir macera oyunu bile vardı

Yeniden tasarlanırken, aynı zamanda düzgün bir numara öğrendim. HTML ve CSS dünyasında saklanma olmadığını fark ettim. Her teknik, her sır sadece bir Bakış Kaynağından uzakta idi. Apple bile güzel ürün sayfalarının sırlarını gizleyemedi ve ben de gizemlerini çözmek için sitelerinde saatler harcadım.

Başka biri yapabilirse, ben de yapabilirim.

Yol boyunca bir yerde, sınıf arkadaşlarım benimle dalga geçmeyi bıraktı.

Kaynağı görüntüleyin. Bir web sitesinde ne zaman havalı bir şey görürseniz, onu yeniden oluşturabilecek misiniz kendinize sorun. Sadece CSS ile yapabilir misin? JavaScript? Değilse, sağ tıklayın> ‘Denetle’ (Chrome) veya Araçlar> Web Geliştirici> Denetleyici (Firefox) seçeneğini tıklayın ve kodu tersine çevirmeyi deneyin. Bir gün denemek istediğiniz harika efektlerin listesini yer imlerine ekleyin veya saklayın.

14 yaşında

Snapchat ve Instagram'dan önce çocukların blogları vardı. Bütün arkadaşlarımın biri vardı. Birçoğu bloglarını kullanıma hazır temalarla kişiselleştirmek için mutlu oldular. Ama kızak yok, ben değil. Oh hayır.

Mevcut temaları kendim için değiştirerek başladım. Ardından, arkadaşlarımın doğum günleri için hediye olarak temalar hazırlardım. Başka sınıflardan çocuklar benden temalar almaya geldi. Blogcu tenli adam oldum.

Gerçekten çizgilere girdim

Ve böylece asıl baskımı HTML’e soktum. Her tema gömülü CSS içeren tek sayfalık bir HTML dokümanıydı. <$ BlogItemTitle $> gibi sahte etiketleri kullanarak, her bir öğenin nasıl ve nereye yerleştirildiğini kontrol edebilirim. Sahte etiketler daha sonra servis sağlayıcı tarafından gerçek içerikle değiştirilir. Sonunda, WYSIWYG editörlerinin sınırlarından kurtuldum!

Çok uzun, tripod.com!

Öğeleri CSS ile hareket ettirmeyi, ekran ve konum tipleri, kenar boşlukları ve dolgular arasındaki farkları öğrenmeyi harcadığımı hatırlıyorum. Belirli bir tema için, dört renkli çizgileri şeffaf bir desenle beyaz bir ön planın arkasında statik bir arka plan olarak kullandım. Her elemanın mükemmel bir şekilde hizalanması gerekiyordu, bu yüzden kullanıcı kaydırıldığında model kendini gösterdi:

Yatay bir kaydırma sitesi, çok sinirli!

Tema geliştirmeyi çok sevdim. Bir web sayfasının sadece 2D olmadığını, aynı zamanda: hover ve: active gibi JavaScript ve CSS sözde seçicileri olan insanlara yanıt verdiğini fark ettim. Büyüdüler ve küçüldü, içeri ve dışarı soldu.

Canlı, etkileşimli bir yüzeydi.

İyi yapıldığında, bu etkileşimler insanları memnun etti ve arkadaşlarımın yeni temalarına verdikleri tepkileri izlemeyi sevdim. İnsanların zevk aldığını bulmak için yeni fikirler ve teknikler denemek için kendimi zorladım.

️ Etkileşimler için geliştirin. İyi ön uç elemanları keşfedilebilir (nasıl kullanılacağına dair ipuçları sağlar) ve geri bildirim sağlar (etkileşimlere bilgilendirici bir şekilde tepki verir). Örneğin, bir düğme vurgulu üzerindeki arka plan renklerini değiştirebilir ve tıklandığında opaklığı artırabilir. İşte konuyla ilgili iyi bir video ve kitap.

16 yaşında

Temmuz 2013'te, ilk alan adımı uygun bir web sunucusuyla kaydettim Sonunda gerçek bir şey yaptığım gibi, bir geçiş ayini gibi hissettim. Portföyümü oluşturdum ve o zamandan beri projelerime ve deneylerime ev sahipliği yaptı. Yeni beceriler edindiğimde yanımda büyüdü ve gelişti.

Çok çabuk büyüyorlar

Bir etki alanı ve iyi bir sunucu barındırma benim için ne kadar yararlı olduğunu abartılamıyor. Web üzerinde yeni ön uç fikirleri deneyebilirim. Hayatımı kolaylaştıran cron işleri yaptım. Bir müşteri veya okul çalışması için ne zaman yeni bir alana ihtiyaç duysam, yeni bir alt etki alanı oluşturabilirim.

İlk web sitemi yerleştirdiğimde kendimi büyük bir çocuk gibi hissettim. Neredeyse bir yaşam için böyle şeyler yapabilir gibi hissettim. Çok güzel olurdu, kendime düşündüm.

Portfolio Bir portföy oluşturun. Bu, web'e dağıtmayı öğrenmek için harika bir proje. Basit seçenekler arasında, dosyalarınızı bir sunucuya kopyalamanıza ve bir sunucuya sunmanıza olanak tanıyan FTP vardır. Bu konuda rahat edince, Sürekli Entegrasyon ve Git'i ayarlamanızı öneririm. Son derece mutlu olduğum Dreamhost'taki (ortak bağlantı) paylaşılan barındırma işlemine başlamadan önce çeşitli sağlayıcıları denedim. Ama orada kesinlikle ücretsiz alternatifler var.

18 yaşında

Singapur'da 18 yaşındakiların orduda iki yıl geçirmeleri gerekiyor. Şansım yaver giderse, mobil geliştirici arayan bir ordu birimine gönderildim. Daha önce böyle bir şey yapıp yapmadığımı sordular. Yapmadım, ama bir web sitesi geliştirmekten ne kadar farklı olabilirdi? Ben de evet dedim.

Anlaşılan yanılmışım. Ama hey, o zamana kadar, deneyim veya nitelik eksikliğinin beni durduracak biri değildim.

Bunu daha önce biraz JavaScript ile çalışmış olmama rağmen, özellikle uygulama geliştirmede önemli olan nesne yönelimli programlama konseptine sahip olmadığımı söyleyerek başaralım. İlk görevim, askerlerin hastalanmasını sağlayan mevcut bir API için bir Android uygulaması geliştirmekti. İkincisi eğitici bir oyun yaratmaktı.

Günlerimi Google'da ve StackOverflow'ta geçirdim, “Metin alanını nasıl oluşturabilirim” ya da “Düğmeleri nasıl yaparım?” Gibi en temel yüzlerce soruyu sorarak. NullPointerExceptions üzerinden kafamı klavyede vurarak geçirdim. Dişlerimin derisi sayesinde, yarı yarıya iyi bir şey çalmayı başardım.

Uygulamalar çekici görünmesine rağmen, arkasındaki kod bundan başka bir şey değildi. Spagetti kodunun satırları ve satırları vardı, açık mimari kalıplar yoktu ve mantık bir zincir bağlantı çitinden daha sıkı bir şekilde birleştirildi. Bakım yapmak imkansızdı ve bu nedenle yaptığım hiçbir uygulama aktif olarak güncellenemedi.

Ölçeklenebilir, temiz ön uç kodunu nasıl yazacağımı okuyana kadar birkaç yıl geçecek. Ama yaptığım zaman, neden önemli olduğunu anladım.

Tests Test yaz. Testler yazmak muhtemelen daha iyi kod yazmak için aldığım en etkili alışkanlık. Kodlamayı öğrenirken birkaç test senaryosunu geçmeye çalışan fonksiyonlar yazdığınızı hatırlıyor musunuz? Öyle, ama şimdi sen de testleri yazan kişi sensin! Her özellik için iyi testler yazmak (birim testleri), kod tabanının diğer bölümlerini değiştirirken bile kodunuzun çalışmasını sağlar.
Respons️ Sorumluluklarınızı ayırın. Birden çok şey yapan bir işlevin var mı? Bunları çoklu fonksiyonlara ayırın. Farklı özellikleri uygulayan çeşitli yöntemler içeren bir sınıfınız var mı? Onları birden fazla sınıfa ayırın. Sorumlulukların ayrılması belki de KATI İlkelerinin en önemlisidir. Kodunuzu okunabilir ve ölçeklenebilir yapar. Temiz Kod: Robert Martin'in Çevik Yazılım İşçiliği El Kitabı (affiliate link) bir ön uç geliştirici için mutlaka okunması gereken bir konudur.

20 yaşında

Haziran 2016'da Google Play mağazasına bir uygulama yayınladım. Öğrencilerin her zaman sevdiğim bir konu olan fiziği öğrenmelerine yardımcı oluyor. İlk gün 3 kez indirildi. İkinci gün 5'di. Üçüncü gün 1000'di. Başlangıçta fark etmedim, ancak rakamlar artmaya devam etti. İlk ayında 7.000 indirme aldı. Eylül ayında, aylık yüklemeler 15.000'e yükseldi.

Nasıl? Ben hiç pazarlama yapmamıştım.

Görünüşe göre, biri uygulamayı Reddit'te (iki kez!) Paylaştı ve insanlar hoşuna gitti. Birkaç inceleme sitesi ve blog tarafından yakalandı. İnsanlar YouTube'da video yapmaya başladı. Bu noktada çok heyecanlandım çarpıntı yüzünden. Sanırım bir noktada ağladım. Tüm sıkı çalışmalarım sonunda işe yarayacak gibiydi.

Arkadaşlarımın blogları için doğum günleri için hediye olarak temalar oluşturduğumda geri getirildim. Bunun yerine, şimdi, dünyadaki binlerce insana hediyeler veriyordum. Birden insanlara yardım edebilecek arayüzler geliştirmeyi çok sevdiğimi fark ettim. İnsanların sevdiği.

Bu deneyimin en iyi yanı, uygulamamı kullanan kişileri tanımaktı. Reddit hakkındaki her yoruma yanıt verdim ve insanların olabilecek herhangi bir fizik sorusu hakkında e-postaları memnuniyetle karşıladım. Bazen, bunun gibi hoş küçük mesajlarım var:

Bu, daha önce yaptığım bir uygulamadan en sevdiğim e-posta
Care İlgilendiğin bir proje seç. Kitapları okudun. Codecademy kursunu yaptın. Merhaba dünyalara ve özyinelemeli işlevlere hakim oldunuz. Şimdi ne olacak? Göreceli uzman olduğunuz hangi alanlarda uzman olduğunuzu düşünün. Siz bir foodie misiniz? Bir kuş gözlemcisi mi? Bir trivia ustası? Kullanacağın bir şey düşün. Çevrenizdeki insanlara veya bir okyanusa yakın bir yerde nasıl yardım edebileceğinizi düşünün. Telefonunuzdaki uygulamalar arasında gezinin. Bunlardan herhangi birini geliştirebilir misiniz?
Bir şey bulduğunuzu düşünüyorsanız, hemen dalın. Hazır olana kadar beklemeyin, izin için beklemeyin. Kendini derin sona at; Ön uç gelişimin en yüksek ve en düşük seviyelerini sürün. Bu şekilde fark yaratan bir şey yaratırsınız.

22 yaşında

Tutkulu olduğum projeler üzerinde çalışarak yeni fikirler ve teknikler keşfetmeye devam ettim. Bunlardan bazıları çok zorlayıcıydı, ancak bildiklerimden yararlanmayı öğrendim. Ön uç geliştirme aktarılabilir becerilerle doludur.

Tepki bir vahiydi. Yıllardır görüşlerini mantıktan ayırdıktan sonra, HTML, veri ve mantığı zarif bir şekilde bütünleştiren bir çerçeve bulmak taze bir nefes gibiydi. Yıllar boyunca ağaçları bir tereyağı bıçağıyla kesiyor gibiydim ve biri bana bir testere vermişti.

Android artık çalışmak için bir zevk. Birçok acı noktasına dikkat edildi ve Kotlin yazmak bir zevk. Dünyanın en iyi zihinlerinden bazıları, React Native, Flutter ve daha pek çok şey ile mobil ön uç geliştirmeyi daha iyi hale getirmek için çalışıyor.

Öncü bir geliştirici olmak için harika bir zaman.

Birkaç yıl önce, tagline ile bir açılış sayfası geliştirdim: Hayal ettiğinden daha yeteneklisin. Keşke biri 12 yaşımdayken, ilk başarısızlığımdan sonra vazgeçmek üzere olduğumda bana haber verseydi.

Oyunculuk öğretmeni daha sonra bana yeteneğin sıkı çalışmanın toplamından başka bir şey olmadığını söyledi. Bu şekilde, olayların yolculuğuma erken başlamamı sağladığı için çok şanslıydım. Yol boyunca tanıştığım insanlara müteşekkirim, bana rehberlik eden ve işlerine ve fikirlerine sahip, utangaç bir genç olan beni emanet etti. Uzun yıllar boyunca yalnız bir hobi olarak başladı, ama şimdi tutkularımı paylaşan arkadaşlarım var.

Harika bir 10 yıl oldu ve sırada ne olacağını bekleyemem.

Community Topluluğunu bul. Hiç kimse bir ada değildir ve hiçbir ön uç dev izole edilmiş bir yüzen div elemanı değildir. Yerel ön uç buluşmalarınıza katılın. Konferanslara git. Kullanmakta olduğunuz git havuzlarını takip edin. Yayınlara yaz. Podcast'leri dinleyin. Bazı twitter DM'lerin içine kaydırın. Size söyleyecekleri bulun: Hayal ettiğinizden daha yeteneklisiniz.

Bu haberi beğendin mi? Temasa geçmeyi çok isterim!
Twitter, LinkedIn'a merhaba deyin veya web siteme bakın.