, February 06, 2023

0 kết quả được tìm thấy

Home Feed UI Instagram with TailwindCSS: Giới thiệu về series

  • Đăng bởi  Pum
  •  Nov 28, 2022

  •   2 min reads
Home Feed UI Instagram with TailwindCSS: Giới thiệu về series

Instagram là một trong những social media được rất nhiều người quan tâm và sử dụng, đặc biệt là những bạn trẻ vì chất lượng hình ảnh, nội dung, sự kết nối đến những người nổi tiếng và xu hướng mới.

Vậy bạn còn chờ gì nữa mà không khai phá "mảng đất" đầy tiềm năng này thông qua series Home Feed UI Instagram with TailwindCSS của 200Lab.

Đặc biệt là series này hoàn toàn free và được public full bộ trên website và kênh youtube của 200Lab. Nếu bạn kiên trì "cày" hết series này thì chắc chắn bạn sẽ xây dựng được cho bản thân một nền tảng kiến thức vững chắc về ReactJS. Từ đó, bạn có thể áp dụng vào những dự án tiếp theo, xây dựng một showcase demo "xịn sò" để làm portfolio cho bản thân.

Các bạn có thể tải tài liệu (Slide, Source Code) của series ở cuối bài viết.
Giới thiệu Series: Home Feed UI Instagram

Bạn còn chờ gì nữa, bắt tay vào học ngay thôi nào!

Lộ trình series

Lộ trình của series sẽ bao gồm các tiêu điểm chính:

  • Khởi tạo project và tips sử dụng Git để khởi tạo base repository.
  • Cài đặt TailwindCSS và các thư viện cần thiết cho dự án.
  • Phân tích layout và thực hiện triển khai build các item, component.
  • Cài đặt React Router và build Sidebar.
  • Thực hiện layout Home feed.
  • Responsive Sidebar và Home feed.
  • Deploy web.
  • ....

Đối tượng của series

  • Dành cho các bạn mới học, muốn tìm hiểu về cách dựng giao diện ReactJS.
  • Muốn nâng cao kỹ năng phân tích UI và luyện tay làm giao diện.
  • Mobile Developer

Mục tiêu của series

  • Giúp các bạn tự tin xây dựng giao diện bất kỳ.
  • Không chỉ kỹ năng lập trình mà còn biết cách phân tích UI, giao diện và thiết lập các Component riêng cho bản thân.
  • Showcase demo "xịn sò" để làm portfolio cho bản thân.

Thành quả sau khi hoàn thành series

Sau khi xem hết chuỗi video trong series, bạn sẽ xây dựng được:

  • Giao diện gồm có sidebar
  • List user story
  • List post
  • List suggestions

Lưu ý quan trọng

  • Quản lý code trên Github & commit source code sau mỗi video.
  • Bạn hãy tự tay xây dựng code từ đầu đến cuối, để luyện tập code.
  • Phát triển dự án lên một tầm cao mới.

Tài liệu

Tải tài liệu của series tại link bên dưới bạn nhé!

Bài viết liên quan

10 Extensions VS Code người mới học HTML&CSS cần phải biết

các extension dành cho người mới học HTML & CSS, giúp bạn có cảm hứng code nhiều hơn và code hiệu quả hơn, năng suất hơn...

10 Extensions VS Code người mới học HTML&CSS cần phải biết
Các Frontend Frameworks phổ biến nhất hiện nay

Framework là các đoạn code viết sẵn và được cấu tạo thành một bộ khung, các thư viện lập trình được đóng gói....

Các Frontend Frameworks phổ biến nhất hiện nay
Front End là gì? 11 kỹ năng để trở thành Front End Developer

Front end là một phần của một website ở đó người dùng có thể tương tác với web, xem video, đăng ký trang mua sắm trực tuyến,......

Front End là gì? 11 kỹ năng để trở thành Front End Developer
Tìm hiểu các phương thức call, apply, bind trong JavaScript

Trong bài "Tìm hiểu về this trong JavaScript", chúng ta có sử dụng phương thức bind() để fix một số bug khi sử dụng this. Cụ thể nó là phương thức như thế nào thì chúng ta cùng nhau tìm hiểu trong bài này nhé 😉....

Tìm hiểu các phương thức call, apply, bind trong JavaScript
Frontend Du Ký | EGANY Apps : Đừng thấy hoa nở mà ngỡ xuân về

Bài viết lần này sẽ kể về quá trình khắc phục hệ thống khi phía đối tác có thay đổi lớn cũng như các điều chỉnh về quy trình git để mọi thứ được suôn sẻ trong quá trình phát triển....

Frontend Du Ký | EGANY Apps : Đừng thấy hoa nở mà ngỡ xuân về
You've successfully subscribed to 200Lab Blog
Great! Next, complete checkout for full access to 200Lab Blog
Xin chào mừng bạn đã quay trở lại
OK! Tài khoản của bạn đã kích hoạt thành công.
Success! Your billing info is updated.
Billing info update failed.
Your link has expired.