Website đầu tiên của tôi
Có bao giờ bạn tự hỏi chính mình rằng “Sản phẩm đầu tiên mình làm là gì?” chưa?
Thời gian cứ âm thầm trôi đi, kéo theo công việc và cuộc sống bận rộn khiến những ký ức dần bị “phủ bụi”, nhiều thứ từng là niềm vui khi mới bắt đầu. Và sản phẩm đầu tiên mà bạn làm chính là một trong số những thứ bị “phủ bụi” đó. Liệu bạn có còn nhớ nó đó trông như thế nào? Những dòng code ngày đó bạn code vẫn còn giữ chứ? Liệu nó có còn chạy hay không?
Uhm… Có thể bạn sẽ trả lời có nhớ hoặc cũng có thể là chẳng nhớ gì. Nhưng thật may khi tôi vẫn còn nhớ – niềm vui khi lần đầu làm quen với website. Đó là những buổi học lý thuyết HTML/CSS cơ bản trên bảng phấn trắng, là những đêm đôi tay gõ cạch cạch trên bàn phím những dòng HTML và CSS inline thẳng tắp. Cái thời của tôi – những năm 2013, khi mà các framework/lib về UI chỉ mới ở giai đoạn sơ khai và đang định hình thì việc code website với HTML/CSS thuần chỉ diễn ra trên Notepad++ hoặc ai xịn hơn thì xài Dreamweaver hay Visual Studio chứ chưa có các editor xịn xò với autocomplete code như hiện nay. Bạn biết đấy, mọi thứ thời đó khá khó khăn. Từ việc tìm tài liệu chuẩn để học đến máy tính và các công cụ lập trình đều khá giới hạn và ít ỏi. Internet thời đó cũng chỉ đang giai đoạn phát triển với mạng ADSL (cáp đồng) và EDGE/3G chập chờn chứ cũng chẳng có cáp quang hay 5G.
Những năm đầu đại học đa phần sẽ được học những môn đại cương nền tảng như toán rời rạc, đại số tuyến tính, vật lý đại cương, C/C++, lập trình hướng đối tượng, kiến trúc máy tính, tư tưởng Hồ Chí Minh… Đại học là nơi bạn phải tự lực cánh sinh, tự học tập và nghiên cứu, tự học nhóm và tham gia các câu lạc bộ. Sẽ chẳng có những cánh tay của thầy cô để dìu dắt và nâng đỡ bạn như thời cấp 3 nữa.
Đầu năm 3, tôi đã may mắn khi tham gia câu lạc bộ First Step Group+ (FSG+) của khoa CNTT. Câu lạc bộ được thành lập bởi các “tiền bối kỳ cựu” của khóa trên, mục đích là để hỗ trợ và đào tạo các đàn em khóa dưới dựa theo nguyện vọng và lĩnh vực yêu thích mà các đàn em lựa chọn. Các lĩnh vực đa dạng từ mobile, winform, webform đến design với các ngôn ngữ nền tảng như C#, Java, ASP.Net, HTML, CSS, JavaScript, jQuery, Ajax, PHP, Cơ sở dữ liệu, và cả…Adobe Photoshop. Trước khi tham gia vào nhóm, các “tiền bối” cũng cẩn thận cho chúng tôi làm những bài test về kiến thức lập trình để đánh giá năng lực và phương hướng đào tạo.
Sau bài test, các thành viên sẽ được phân chia vào các lớp theo lĩnh vực. Mỗi lớp sẽ là một vài thành viên kỳ cựu về lĩnh vực đó đảm nhiệm, chuẩn bị giáo trình, cung cấp tài liệu và tạo lớp học.
Nhóm được nhiều thành viên hưởng ứng từ những buổi test năng lực đến những buổi học đầu tiên. Ai cũng tích cóp được cho mình những kiến thức bổ ích và case study thực tế không có trong giáo trình chính thức. Tất cả đều từ sự đúc kết từ những kinh nghiệm làm việc của các “tiền bối kỳ cựu”.
Tôi cũng lựa chọn cho mình khóa học lập trình web cơ bản với HTML/CSS. Những tài liệu học được chia sẻ từ giáo viên bộ môn và tổng hợp của nhiều nguồn khác nhau. Một số trang tài liệu học phổ biến lúc bấy giờ như hocwebchuan, w3cschools,… Tôi đã hào hứng thực hành từ những trang web mẫu đầu tiên. Mặc dù nhìn code khá dỏm, lộn xộn và cả lỗi cú pháp nữa, nhưng với những hạn chế về công cụ thời đó thì cũng đã là một sự cố gắng để tiếp cận. Rất may là code vẫn chạy được nhờ cơ chế tự động sửa lỗi của trình duyệt, ảo thật nhỉ 😂. Đoạn code HTML này may mắn được tôi đăng tải và khoe với bạn bè trên Facebook sau khi tôi vừa thực hành tại nhà nên vẫn còn lưu giữ lại được =)). Đừng cười nhé. Hehe. Hoàn thiện vào lúc 12h12 đêm 03/03/2013. File HTML chỉ tập trung vào làm quen các thẻ HTML cơ bản như img, table, form, input, heading.
Bạn có thể xem file HTML code thực hành của tôi tại đây.
Mẫu web thứ 2 tôi làm là trang tìm kiếm Google. Trang Google Search năm 2013 sẽ trông như thế này:
Còn đây là giao diện trang Google do tôi code. Hoàn thiện vào 09h52 đêm 06/03/2013. Nhìn hơi màu mè hoa lá hẹ đúng không. Nhưng chính sự màu mè đó cho thấy tôi đã rất hào hứng khi thử nghiệm các thuộc tính CSS khác nhau vào trong file HTML. Bố cục cũng tạm ổn hơn lần đầu và còn có cả search params nữa. Đáng tiếc là tôi không khoe code của file HTML này mà chỉ đăng 2 tấm ảnh trên Facebook nên chẳng có “code backup” nào để cho các bạn xem. Xem lại những dòng comment cũ cũng đủ làm tôi cười khúc khích cả buổi rồi =)). Bạn có thể thấy trong ảnh, bên dưới tôi vẫn đang mở Notepad++ và file HTML được mở trực tiếp trên trình duyệt từ thư mục chứa chứ chẳng có Live Server nào.
Nhóm FSG+ trải qua hơn một năm hình thành và hoạt động tích cực, số lượng thành viên ban đầu khá đông nhưng cũng “rơi rụng” dần để tập trung cho mùa thi học kỳ kết thúc năm 3. Lịch học cũng thưa dần và nhóm cũng dần ít các hoạt động, báo hiệu một mùa hè vắng bóng sinh viên.
Cho đến hôm nay, tôi đã đi được một chặng đường rất xa, ở một tầm vóc mới và trình độ mới, vẫn vẹn nguyên niềm đam mê với lập trình web. Khi nhìn lại những dòng code chập chững, ngây ngô ngày đầu, tôi cảm thấy thích thú và vẫn nhớ cảm giác hào hứng khi tự tay dựng nên một website. Đó mãi là một nguồn động lực, là nền tảng vững chắc để tôi phấn đấu trong tương lai.
Những gì tôi và các bạn đã được học, cùng nhau thảo luận sẽ luôn còn lưu giữ trong nhóm Facebook ấy. Để rồi mỗi khi vô tình nhớ lại và tìm về, chúng ta lại được nhìn thấy những tháng năm tuổi trẻ mình đã từng nhiệt huyết và ham học như thế nào. Một thời mà dẫu có nhiều khó khăn về vật chất, hay mưa gió vẫn đạp xe đến trường để đến lớp học, và cả những đêm thức khuya để thực hành những dòng code mới.
Cảm ơn nhóm FSG+. Cảm ơn các “tiền bối kỳ cựu”! 🌻💐
– Tiến K35 –