HTML'den JavaScript'e 6 Aylık Frontend Öğrenme Adımlarım

Jun 13, 2023·

5 min read

Ben Buse Nur Çetin, bugün 6 aylık yazılım öğrenme sürecimde frontend alanında kendimi nasıl geliştirdim? Nasıl bir yol haritası izledim? Bu konulardan bahsedeceğim.

Başlangıç : HTML

Frontend öğrenmeye karar verdikten sonra ilk olarak HTML öğrenmeye başladım. Yakın Kampüs ve Yazılım Bilimi'nin videolarını izleyip HTML kavramlarını, neyin ne yaptığını öğrendim. Ayrıca w3schools'tan da fazlaca yararlandım. Sonrasında da pure HTML kullanarak projeler yapmaya çalıştım.

Kaynak Link: https://youtu.be/fakHTnkZLRc

Kaynak Link: https://youtu.be/y745R3Lv9WI

Kaynak Link: https://www.w3schools.com/html/

Projeler: https://github.com/busenurcetin

İkinci Adım : CSS

HTML öğrendikten sonra hedefim CSS öğrenmek, ana yapılarına hakim olmak oldu. Okulda da HTML ve CSS dersini alıyor olmam o dönem benim için işleri hayli kolaylaştırdı. Okul müfredatının önünde ilerliyor ve dersi de pratik ve alıştırma yapmak için kullanıyordum. Sadece Yazılım Bilimi'nin videosunu izledim bununla birlikte w3schools'tan yararlandım. Bu süreçte beni asıl geliştiren şey video izleyip "Tamam öğrendim." demek yerine pratikler ve projeler yaparak kendimi geliştirmekti.

Kaynak Link: https://youtu.be/y745R3Lv9WI

Kaynak Link: https://www.w3schools.com/css/

Projeler: https://github.com/busenurcetin

Üçüncü Adım : Bootstrap

CSS'i de iyice kavradıktan sonra daha önce de ismini duyduğum Bootstrap'i öğrenmeye karar verdim. Aslında bootstrap öğrenmeme neden olan temel şey "Ne bu bootstrap? Niye kullanıyorlar?" merakımdı. YouTube'dan Sadık Turan'ın Bootstrap eğitimine başladım. Bir yandan da Bootstrap dökümantasyonuna okuyarak ilerledim. Eğitim bitince de daha iyi anlamak ve kullanıma az çok hakim olmak için proje yaptım.

Kaynak Link: https://youtu.be/PSqUH6FAwSE

Kaynak Link: https://getbootstrap.com/

Projeler: https://github.com/busenurcetin

Git, GitHub Ve Termial Kullanımını Öğrenme

Projelerimi GitHub'da paylaşmak, git kullanımını öğrenmek ve bunlarla birlikte işimi kolaylaştırmak için terminal kullanımını da öğrenmek istiyordum. Terminal kullanımını hiçbir kaynak olmadan sadece deneme yanılma ve pratik yöntemiyle öğrendim. Git-GitHub kullanımını ise BTK Akademi'nin "Versiyon Kontrolleri: Git ve GitHub" eğitimi sayesinde öğrendim.

Kaynak Link: https://www.btkakademi.gov.tr/portal/course/versiyon-kontrolleri-git-ve-github-19439

Mentör Bulma Sürecim

Bootstrap öğrendikten sonra daha iyi bir yönlendirme ve yol haritası için mentör arayışına girdim. WBW3(Women Build Web3) bootcampinde tanıştığım, şuan mentörüm olan Busayo'ya yazdım. Mentörlük yapmayı kabul etti, bu aşamadan sonra yaptığım her şey de çok büyük emeği var.

Figma ile Tasarımı Koda Dönüştürmek

Mentörüme neler yaptığımı, kullandığımı, şuana kadar hangi projeleri tamamladığımı anlatıp gösterdikten sonra Figma tasarımını koda çevirmemi istedi. Bunun için 2 hafta süre verdi. 1 haftada verdiği görevi yapıp gönderdim. Hayli acemice bir tasarım yaptığımı ve tam anlamıyla istenilen şeyi ortaya koyamadığımı daha o zaman bile farketmiştim. Hala Figma tasarımları konusunda fazlaca eksiğim.

TailwindCSS ile Tanışma

Figma öğrendikten sonra mentörüm TailwindCSS öğrenmemi söyledi ve yine 2 hafta süre verdi. Arin Yazılım'ın TailwindCSS eğitimi bu süreçte bana en çok yardımcı olan kaynaklardan biriydi. Ayrıca TailwindCSS dökümanından da birçok kez faydalandım. Yaklaşık 5 günde TailwindCSS öğrenip yaptığım projeyi, aldığım notları gönderdim. Bootstrap'ten çok daha kolay ve esnek bir kullanımının olduğunu düşünüyorum.

Kaynak Link: https://youtu.be/vCgQcyCPH0Y

Kaynak Link: https://tailwindcss.com/

Projeler: https://github.com/busenurcetin

Yazı Yazmaya Başlama Adımları

Sürekli projeler geliştiriyordum fakat hala elimden gelenin sadece bu olmadığını hissediyordum. Twitter'da gezerken takip ettiğim insanların teknik konular hakkında yazı yazdığını görünce "Ben neden yazmayayım hem pratik olur." diye düşündüm fakat yazı yazmaya başlamama sebep olan asıl şey C# ve JavaScript notlarımı paylaşmam ve insanların bunlardan faydalandığını görmem sayesinde oldu. "E o zaman bir şeyler yazayım hem insanlar faydalansın hem ben kendime yeni bir beceri katayım." diye düşünerek Medium ve Hashnode'a bomba gibi bir giriş yaptım.

Yeni Yazılımcı'nın Hikayesi

Network edinmek, sorularım hakkında yardım alabilmek için pek çok Discord grubunda vardım fakat bu gruplarda hiç kimseyi tanımıyordum ve yeniden tanışmak için de çaba harcamak istemiyordum. Birçok yazımı, yazılıma yeni başlayanlara faydalı olduğunu vurgulamak için "Yeni Yazılımcı" başlığıyla paylaşmıştım. "E niye bu yeni yazılımcının soruları, sorunları, kod hataları için konuşabileceği bir sunucu kurmayayım? Zaten en fazla 100 kişi olur, sonrasında belki topluluk bile kurarız." diye düşündüm. Sunucu ilk gününde 800+ kişi oldu ve topluluk kurma süreci benim için çok daha fazla kolaylaştı.

Sunucuya Davet: https://discord.gg/QSrTWjWqJt

JavaScript ile Mücadele

TailwindCSS'de bitince yine mentörümün yönlendirmesiyle uzun zamandır öğrenmek istediğim ama vakit bulamadığım JavaScript'i öğrenmeye başladım. Enes Bayram'ın JavaScript eğitim serisi üzerinden çalıştım. Videoyla birlikte w3chools'u da sıkça kullanıyorum. Bu aşamalardan en çok hangisi seni yordu sorusuna cevap vermek zorunda kalsam JavaScript derdim. Daha önce C# öğrenmeme ve belli başlı yapılara hakim olmama rağmen Javascript öğrenmek ve kavramlarına hakim olmak hayli zordu, hala zor. Hala Javascript öğreniyor ve JavaScript kullanıp projeler yaparak kendimi geliştirmeye çalışıyorum.

Kaynak Link: https://youtu.be/mcwBvvThO40

Kaynak Link: https://www.w3schools.com/js/

HTML, CSS, TailwindCSS, Bootstrap ve JavaScript kullanarak geliştirdiğim projeleri görmek için göz atabilirsiniz: https://github.com/busenurcetin

Etkinliklere/Yarışmalara Katılım

Bu 6 aylık süreçte yaptığım en büyük hatalardan biri yeterince etkinliklere katılmamak oldu bence. Bu eksiği ilerleyen dönemlerde tamamlamayı düşünüyorum. Katıldığım ilk community Aydın Huawei Student Developer topluluğuydu, organizatör olarak görev yapmama rağmen 2 ay sonra ekipten topluca ayrıldığımız için organizasyon yapamadık. Şuan Bursa Bilişim Topluluğu'nun etkinliklerini takip ediyorum ve organizasyonları için şimdiden heyecanlıyım. Arkadaşım Elif Hilal Umucu'nun organizatör olarak görev yaptığı ChainlinkTR topluluğuna olan hayranlığımı da beni tanıyanlar az çok bilir. Bu 6 ay içinde yaklaşık 5-6 etkinlik ve yarışmaya katıldım, ilerleyen süreçte çok daha fazla etkinliğe, yarışmaya katılım sağlayacağım.

Gönüllü Olarak Startup'da Çalışma Süreci

Şuan startup aşamasındaki bir projede gönüllü frontend developer olarak çalışıyorum. Yakın zamanda yüz yüze tanıştığım bu ekiple hackathon'a da katılacağız ve birlikte çok güzel işler başaracağımızı düşünüyorum.

Gönüllü Staja Başlamak

Bu kısmı başka bir yazımda detaylı anlattığım için üstünkörü anlatacağım. LinkedIn'den Tamamliyo'nun tech lead'i Musa'nın bana ulaşmasıyla gönüllü staja başladım. Staj sürecim hala devam ediyor fakat sınavlarımdan dolayı bu aralar toplantılara katılım sağlayamıyorum, anlayış gösteriyorlar.

Hatalarım

Bu süreç boyunca bana destek olanlar kadar köstek olanlar da oldu ve ilk başta yıkıcı eleştirileri çok fazla ciddiye aldım. Bunlar belli bir noktada daha fazla hırslanmama sebep olsa da kimi zaman kendimi yetersiz hissetmeme de sebep oldu. Tüm bu serüven boyunca gerçekten çok disiplinli bir şekilde ilerlememe rağmen hala kendimi yetersiz görüyorum, elimden geleni yapmadığıma inanıyorum fakat bu düşüncelerin beni demoralize etmesine izin vermeden daha çok çalışarak susturmaya çalışıyorum. Daha fazlasını, daha iyisini yapabileceğimin farkında olarak gece gündüz çalışıyorum. Birçok kez gerek kod yazarken gerek proje yaparken yüzlerce hatayla, nezaketsiz insanlarla (ki onlara da hata demek yanlış olmaz) karşılaştım. Pes etmeyi hiçbir zaman düşünmedim. Durmamak üzere yola çıkanlar yorulmazlar. Çok güzel işler, projeler yapacağım, umuyorum ki birlikte yapacağız. Kendime ve benim gibi çalışan gençlere olan umudumu hiçbir şey kaybettiremez. Sadece iyi günlerinde çalışanlar değil, gerçekten çalışmak istemediğinde bile çalışanlar kazanacak.

"Başarısızlık, başarının en temel basamağıdır. Hiç hata yapmayan, hiçbir şey yapmayan biridir." - Albert Einstein

Sonraki Durak?

JavaScript öğrenme sürecim bittikten ve yeterince proje yaparak JavaScript öğrendikten sonra NodeJS sonrasında ise React öğreneceğim. Bu süreçte fikrim değişmezse tüm bunları yaptıktan sonra Solidity öğrenmeyi ve Web3 alanına adım atmayı hedefliyorum. Gelişimimde çokça emeği olan mentörüme, bu yolda gerek yanımda gerek arkamda duran arkadaşlarıma, dostlarıma, abilerime çok teşekkür ederim. Benim için hayli yoğun, zor ama bir o kadar da inanılmaz bir süreçti. Çok daha iyilerine, hep birlikte!