M
minhanhtrantran
Guest
Bài viết này mình chia sẻ dưới góc nhìn cá nhân về Frontend Roadmap tức là mọi người theo chuyên môn Frontend giống mình. Mình thấy nhiều bạn hỏi lúc mới học về web thì nên học gì thì bài này sẽ giải đáp cho các bạn.
- Lúc mới vào ai cũng mơ hồ, không biết bắt đầu như thế nào, ai cũng tư vấn mỗi cách làm chúng ta sẽ bị rối não không biết theo ai là đúng cả, vì khi chia sẻ ai cũng thấy là mình đúng nhưng phải hiểu là người khác học theo chưa chắc đã được từ đó suy ra mỗi người sẽ có cách phù hợp cho riêng bản thân mình.
- Theo Frontend thì sẽ học nhiều thứ như sau: đầu tiên là cần biết viết từ website hay trang web chứ không phải là wed, biết cách F12 để xem code, sau đó là học về HTML để nắm vững kiến thức về các thẻ, các thuộc tính của thẻ, cách đặt tên cho class, cho các thuộc tính của các thẻ, hiểu được từng thẻ chức năng của nó là gì, những thuộc tính đi kèm có tác dụng gì, HTML tuy dễ nhưng không dễ, đa số newbie học được vài bữa hay bảo là học xong, đến lúc code giao diện thì code dùng thẻ tè le, đặt tên loạn xạ, phải biết thẻ nào inline, thẻ nào block, khi nào thì dùng thẻ inline, khi nào dùng thẻ block, đặt tên sao cho dễ hiểu, nên nhớ code cho máy hiểu thì dễ nhưng cho người hiểu không dễ chút nào...
- Sau đó là học CSS để có thể làm giao diện đẹp hơn với nhiều kiến thức từ cơ bản tới nâng cao, từ các CSS về chữ cho đến thẻ, position, dàn layout với flexbox, responsive, form, table, selectors, pseudo....
- Code CSS cũng thế khi code cũng phải đặt câu hỏi tại sao nó center được, tại sao cái kia không center được thì phải xem thử ví dụ như thẻ inline ko thể dùng margin: 0 auto để căn giữa được mà phải dùng text-align: center bao ngoài, hoặc dùng position relative kết hợp transform, tại sao độ rộng lại to thì phải biết là do box-sizing, tại sao before hay after ko chạy thì phải biết là do thiếu thuộc tính content, tại sao abc xyz đặt nhiều câu hỏi như vậy thì mới mau hiểu được nhiều điều và sâu hơn...
- Sau khi học ổn ổn HTML CSS thì câu hỏi nhiều người hay hỏi là sẽ học gì tiếp theo và làm sao để luyện cho mau giỏi, về cách luyện thì có thể vào các trang như dribbble. com để tìm giao diện rồi code cho giống nhất có thể, làm nhiều ắt sẽ giỏi, sau đó tìm các template dài như psd template có thể tìm kiếm Google với từ khóa "psd template free" để tải về làm, khi code hãy đặt mindset là để kiếm tiền thì mới có động lực làm được, và làm tốt
- Khi code CSS phải biết là bản thân đang code cái gì, từng dòng code xuống editor thì phải hiểu tại sao lại dùng đoạn code đó, chứ chỉ biết cắm đầu làm ra giông giao diện thì mãi chỉ ở mức Junior thôi, lên Senior thì phải khác, phải biết các dòng code chúng ta đang code sẽ làm việc gì, luyện đến mức không cần nhìn kết quả cũng biết kết quả như nào luôn mới đỉnh(tuỳ thuộc vào các UI đơn giản).
- Tìm hiểu thêm khái niệm UI UX để biết thế nào là giao diện đẹp, giao diện xấu, giao diện dễ trải nghiệm, giao diện khó trải nghiệm, cải thiện con mắt thẩm mỹ rất tốt cho Frontend, sau này ngta nhờ làm chỉnh giao diện có sẵn lúc này bạn có thẩm mỹ tốt sẽ làm cho giao diện họ đẹp hơn từ đó có thể kiếm được tiền từ họ chẳng hạn.
- Tìm hiểu và học thêm Sass để code CSS nhanh hơn, tìm hiểu Emmet trong Vscode(Nếu dùng vscode) để gõ HTML CSS siêu nhanh hoặc tìm hiểu VSCode custom snippets để gõ nhanh hơn nữa cho các đoạn code hay dùng
- Học SASS thì phải biết nó mạnh là như nào các bạn mới hay học bảo code Sass lẹ ghê mà hỏi chỉ biết dùng nested code tức là lồng code vào nhau thôi mà ko biết sức mạnh của nó còn biến, function, mixins, điều kiện, vòng lặp, kế thừa...
- Phải hiểu Bootstrap cũng chỉ là CSS dựng lên cho nên khoan vội học nó mà hãy nắm vững kiến thức về CSS layout như flexbox trước, master nó thì sau này học Bootstrap không còn khó nữa.
- Tìm hiểu thêm các shortcuts trong VSCode để thao tác nhanh hơn nữa, như mở terminal, tìm file, mở file, di chuyển file...
- Sau đó tiếp tục luyện HTML CSS lúc rãnh để nâng cao trình độ hơn, trong khi đó bắt đầu học Javascript, thì cần tìm hiểu Javascript để làm gì, học thì học có nhiều nguồn lắm, hãy tìm cho bản thân 1 nguồn mà bản thân cảm thấy hợp nhất, học cho kỹ và chậm mà chắc, đừng học vẹt hay học mới có tí xíu là đăng hỏi nhóm rồi, học như thế thì khó mà giỏi lên nổi.
- Có MDN(Mozilla Development Network) dạy JS khá kỹ có thể lên đây học, vì JS khá sida nên việc tiếp thu sẽ khó hơn so với HTML CSS cho nên cần cố gắng nỗ lực và quan trọng là thực hành nhiều. Những concept nâng cao nếu đọc tiếng Anh khó hiểu thì có thể đọc blog anh Hoàng(Toidicodedao) ấy ảnh giải thích dễ hiểu.
- Tìm hiểu thêm Codepen để code online để có gì đăng hỏi cho dễ, ngta vào xem cũng dễ và dễ giúp mình chứ đừng có đăng 1 đống code lên bài hỏi nhìn chán lắm.
- Lúc học hãy cố gắng là đặt nhiều câu hỏi cho bản thân, tại sao code nó lại chạy, lại ko chạy, tại sao nó lại thế này, thế kia rồi tự tìm hiểu tự trả lời có khi lại tốt từ đó biết nhiều hơn chẳng hạn.
- Học thêm kỹ năng mềm như cách đăng bài, cách nhờ vả cho hay, cách gửi mail cho nhà tuyển dụng, cách làm CV... mấy cái này quan trọng nên cũng phải học thêm để tăng skills cho bản thân
- Học thêm photoshop cơ bản hoặc các phần mềm liên quan tới designer như figma, zephlin, để sau này làm việc với designers thì dễ hiểu hơn, học photoshop để cắt ảnh cơ bản để làm psd cũng tốt.
- Sau khi học JS thì tìm hiểu về Frameworks như Angular, React, hay Vue tuỳ vào sở thích mỗi người, rồi theo đuổi nó
- Nếu chưa có kinh nghiệm thì kiếm project nào đó tự làm rồi đưa lên web bằng git github thì tiện tay tìm hiểu luôn git github là gì luôn vì nó rất cần sau này đi làm việc nhóm để quản lý source code.
- Có project rồi thì đi xin thực tập dễ hơn nhiều nếu không có sản phẩm gì cả, lúc làm CV đừng có ghi % kẻo bị người ta hỏi trả lời không được, đi phỏng vấn thái độ quan trọng lắm, hay đến đúng giờ, ăn mặc lịch sự...
- Còn nhiều lắm có gì chia sẻ sau, nguồn học HTML CSS JS như thế nào thì mỗi người có 1 cách riêng cho nên hãy tự khám phá cho riêng mình sao cho phù hợp và hiệu quả nhất nha.
Nguồn Evondev
- Lúc mới vào ai cũng mơ hồ, không biết bắt đầu như thế nào, ai cũng tư vấn mỗi cách làm chúng ta sẽ bị rối não không biết theo ai là đúng cả, vì khi chia sẻ ai cũng thấy là mình đúng nhưng phải hiểu là người khác học theo chưa chắc đã được từ đó suy ra mỗi người sẽ có cách phù hợp cho riêng bản thân mình.
- Theo Frontend thì sẽ học nhiều thứ như sau: đầu tiên là cần biết viết từ website hay trang web chứ không phải là wed, biết cách F12 để xem code, sau đó là học về HTML để nắm vững kiến thức về các thẻ, các thuộc tính của thẻ, cách đặt tên cho class, cho các thuộc tính của các thẻ, hiểu được từng thẻ chức năng của nó là gì, những thuộc tính đi kèm có tác dụng gì, HTML tuy dễ nhưng không dễ, đa số newbie học được vài bữa hay bảo là học xong, đến lúc code giao diện thì code dùng thẻ tè le, đặt tên loạn xạ, phải biết thẻ nào inline, thẻ nào block, khi nào thì dùng thẻ inline, khi nào dùng thẻ block, đặt tên sao cho dễ hiểu, nên nhớ code cho máy hiểu thì dễ nhưng cho người hiểu không dễ chút nào...
- Sau đó là học CSS để có thể làm giao diện đẹp hơn với nhiều kiến thức từ cơ bản tới nâng cao, từ các CSS về chữ cho đến thẻ, position, dàn layout với flexbox, responsive, form, table, selectors, pseudo....
- Code CSS cũng thế khi code cũng phải đặt câu hỏi tại sao nó center được, tại sao cái kia không center được thì phải xem thử ví dụ như thẻ inline ko thể dùng margin: 0 auto để căn giữa được mà phải dùng text-align: center bao ngoài, hoặc dùng position relative kết hợp transform, tại sao độ rộng lại to thì phải biết là do box-sizing, tại sao before hay after ko chạy thì phải biết là do thiếu thuộc tính content, tại sao abc xyz đặt nhiều câu hỏi như vậy thì mới mau hiểu được nhiều điều và sâu hơn...
- Sau khi học ổn ổn HTML CSS thì câu hỏi nhiều người hay hỏi là sẽ học gì tiếp theo và làm sao để luyện cho mau giỏi, về cách luyện thì có thể vào các trang như dribbble. com để tìm giao diện rồi code cho giống nhất có thể, làm nhiều ắt sẽ giỏi, sau đó tìm các template dài như psd template có thể tìm kiếm Google với từ khóa "psd template free" để tải về làm, khi code hãy đặt mindset là để kiếm tiền thì mới có động lực làm được, và làm tốt
- Khi code CSS phải biết là bản thân đang code cái gì, từng dòng code xuống editor thì phải hiểu tại sao lại dùng đoạn code đó, chứ chỉ biết cắm đầu làm ra giông giao diện thì mãi chỉ ở mức Junior thôi, lên Senior thì phải khác, phải biết các dòng code chúng ta đang code sẽ làm việc gì, luyện đến mức không cần nhìn kết quả cũng biết kết quả như nào luôn mới đỉnh(tuỳ thuộc vào các UI đơn giản).
- Tìm hiểu thêm khái niệm UI UX để biết thế nào là giao diện đẹp, giao diện xấu, giao diện dễ trải nghiệm, giao diện khó trải nghiệm, cải thiện con mắt thẩm mỹ rất tốt cho Frontend, sau này ngta nhờ làm chỉnh giao diện có sẵn lúc này bạn có thẩm mỹ tốt sẽ làm cho giao diện họ đẹp hơn từ đó có thể kiếm được tiền từ họ chẳng hạn.
- Tìm hiểu và học thêm Sass để code CSS nhanh hơn, tìm hiểu Emmet trong Vscode(Nếu dùng vscode) để gõ HTML CSS siêu nhanh hoặc tìm hiểu VSCode custom snippets để gõ nhanh hơn nữa cho các đoạn code hay dùng
- Học SASS thì phải biết nó mạnh là như nào các bạn mới hay học bảo code Sass lẹ ghê mà hỏi chỉ biết dùng nested code tức là lồng code vào nhau thôi mà ko biết sức mạnh của nó còn biến, function, mixins, điều kiện, vòng lặp, kế thừa...
- Phải hiểu Bootstrap cũng chỉ là CSS dựng lên cho nên khoan vội học nó mà hãy nắm vững kiến thức về CSS layout như flexbox trước, master nó thì sau này học Bootstrap không còn khó nữa.
- Tìm hiểu thêm các shortcuts trong VSCode để thao tác nhanh hơn nữa, như mở terminal, tìm file, mở file, di chuyển file...
- Sau đó tiếp tục luyện HTML CSS lúc rãnh để nâng cao trình độ hơn, trong khi đó bắt đầu học Javascript, thì cần tìm hiểu Javascript để làm gì, học thì học có nhiều nguồn lắm, hãy tìm cho bản thân 1 nguồn mà bản thân cảm thấy hợp nhất, học cho kỹ và chậm mà chắc, đừng học vẹt hay học mới có tí xíu là đăng hỏi nhóm rồi, học như thế thì khó mà giỏi lên nổi.
- Có MDN(Mozilla Development Network) dạy JS khá kỹ có thể lên đây học, vì JS khá sida nên việc tiếp thu sẽ khó hơn so với HTML CSS cho nên cần cố gắng nỗ lực và quan trọng là thực hành nhiều. Những concept nâng cao nếu đọc tiếng Anh khó hiểu thì có thể đọc blog anh Hoàng(Toidicodedao) ấy ảnh giải thích dễ hiểu.
- Tìm hiểu thêm Codepen để code online để có gì đăng hỏi cho dễ, ngta vào xem cũng dễ và dễ giúp mình chứ đừng có đăng 1 đống code lên bài hỏi nhìn chán lắm.
- Lúc học hãy cố gắng là đặt nhiều câu hỏi cho bản thân, tại sao code nó lại chạy, lại ko chạy, tại sao nó lại thế này, thế kia rồi tự tìm hiểu tự trả lời có khi lại tốt từ đó biết nhiều hơn chẳng hạn.
- Học thêm kỹ năng mềm như cách đăng bài, cách nhờ vả cho hay, cách gửi mail cho nhà tuyển dụng, cách làm CV... mấy cái này quan trọng nên cũng phải học thêm để tăng skills cho bản thân
- Học thêm photoshop cơ bản hoặc các phần mềm liên quan tới designer như figma, zephlin, để sau này làm việc với designers thì dễ hiểu hơn, học photoshop để cắt ảnh cơ bản để làm psd cũng tốt.
- Sau khi học JS thì tìm hiểu về Frameworks như Angular, React, hay Vue tuỳ vào sở thích mỗi người, rồi theo đuổi nó
- Nếu chưa có kinh nghiệm thì kiếm project nào đó tự làm rồi đưa lên web bằng git github thì tiện tay tìm hiểu luôn git github là gì luôn vì nó rất cần sau này đi làm việc nhóm để quản lý source code.
- Có project rồi thì đi xin thực tập dễ hơn nhiều nếu không có sản phẩm gì cả, lúc làm CV đừng có ghi % kẻo bị người ta hỏi trả lời không được, đi phỏng vấn thái độ quan trọng lắm, hay đến đúng giờ, ăn mặc lịch sự...
- Còn nhiều lắm có gì chia sẻ sau, nguồn học HTML CSS JS như thế nào thì mỗi người có 1 cách riêng cho nên hãy tự khám phá cho riêng mình sao cho phù hợp và hiệu quả nhất nha.
Nguồn Evondev
