강의

멘토링

로드맵

BEST
Programming

/

Front-end

Tìm hiểu mã hóa DO IT front-end trong khi tạo nó (Next.js, Typescript)

Thay vì tạo ra một dịch vụ có vẻ ngoài đẹp mắt, bạn có thể tạo một dịch vụ cho phép bạn gặp gỡ người dùng và nhận phản hồi. Có được sự tự tin trong phát triển web.

(4.5) 22 đánh giá

470 học viên

  • totuworld
Next.js

Đánh giá từ những học viên đầu tiên

Dịch cái này sang tiếng Việt

  • Cách sử dụng Next.js

  • Quản lý dữ liệu của bạn với Firestore trên Firebase

  • Sử dụng xác thực Firebase

  • Thiết kế và sử dụng API Web

Học bằng cách tạo ứng dụng của riêng bạn
Niềm vui của lập trình 🚀

Tôi muốn trở thành một nhà phát triển, nhưng
Tôi nên bắt đầu học từ đâu?

Tôi không biết phải học gì, nhưng tôi bị choáng ngợp bởi lộ trình front-end khổng lồ.
Nếu bạn cảm thấy mệt mỏi khi phải học thuật toán , hãy thử trải nghiệm niềm vui thực sự khi tạo ra các ứng dụng.

Nếu bạn vui vẻ, bạn có thể học lâu hơn.


Sinh viên và người tìm việc có thể thấy mức giá này khá cao, vì vậy hãy xem các bài đăng mới nhất trên blog của tôi trước.

Chúng tôi có phiếu giảm giá lớn dành riêng cho bạn!

Kiểm tra phiếu giảm giá🎟️👉 https://medium.com/@totuworld


Từ việc thiết lập môi trường phát triển
Lên đến triển khai ứng dụng🏃

Bài giảng này sẽ trình bày toàn bộ quy trình xây dựng và triển khai dịch vụ câu hỏi ẩn danh (Blahx2) từ đầu. Thay vì sử dụng phương pháp dựng hình phía máy khách (CSR) thường thấy khi học React.js, chúng ta sẽ tập trung vào Next.js, hỗ trợ dựng hình phía máy chủ (SSR), tạo mã HTML ban đầu trên máy chủ, sau đó thực hiện quy trình hydrat hóa.

Chúng tôi sẽ tận dụng Xác thực Firebase để nhanh chóng xây dựng ứng dụng của bạn mà không cần tốn thời gian triển khai nhiều phương thức đăng nhập mạng xã hội. Bạn cũng sẽ học cách lưu trữ và cập nhật dữ liệu theo mô hình NoSQL và xử lý phân trang bằng Firebase Firestore.


Tôi giới thiệu điều này tới những người này.

Niềm vui của lập trình
Người bạn đang tìm kiếm

Triển khai các chức năng thực tế
Bất cứ ai muốn thử nó

Công nghệ xu hướng mới nhất
Những người muốn học


Các tính năng độc đáo của khóa học này
Hãy xem thử nhé 💡

  • Tôi sẽ bắt đầu từ đầu từng phần một để không cảm thấy nhàm chán khi học lý thuyết.
  • Nếu bạn chỉ mới tiếp xúc với JavaScript, bạn sẽ thấy TypeScript rất hấp dẫn .
  • Khi bạn nghiên cứu phần front-end, bạn sẽ phát triển mã từng bước để phần back-end dễ hiểu hơn.
    • Ngay cả khi cùng một mã được lặp lại!
    • Ngay cả những phần dễ mắc lỗi đánh máy!
    • Đầu tiên, tôi sẽ giải thích theo hướng lập trình và sau đó dần dần cải thiện nó.
  • Tôi để nguyên những lỗi thường mắc phải trong lập trình và cố gắng sửa chúng sau.
    • Bạn có thể xem trước cách gỡ lỗi được thực hiện tại hiện trường .

Bạn sẽ học được gì ✨

메인 페이지 뷰 작업

Tạo trang chủ chính và trang chủ người dùng

Chúng tôi sẽ khám phá cách cấu trúc các trang được xem nhiều nhất cho người dùng của bạn. Chúng tôi sẽ đề cập đến toàn bộ quá trình tạo bố cục chung cho mỗi trang và thêm GNB.

Tạo API nhắn tin cho người dùng

Chúng ta sẽ xây dựng cả API để lưu trữ và truy xuất thông tin người dùng sau khi đăng ký, và API để đăng ký và chỉnh sửa tin nhắn. Chúng ta sẽ đề cập đến những cân nhắc khi cung cấp API từ máy chủ, và bạn sẽ học cách cấu trúc và lưu trữ dữ liệu trong Firestore.

Tạo trình tạo hình ảnh đồ thị mở

Khi bạn chia sẻ bài đăng trên mạng xã hội, hình ảnh và văn bản sẽ tự động được thêm vào. Bài viết này hướng dẫn cách sử dụng PlayWright và Chrome không đầu, có thể chạy trên AWS Lambda, để tạo hình ảnh chỉ dựa trên dữ liệu đầu vào mà không cần người dùng phải lo lắng.

Phân phối Vercel

Ngay cả khi bạn tạo một dịch vụ, bạn cũng không thể học được nhiều nếu không có cách tiếp nhận phản hồi từ người dùng. Để cải thiện điều này, chúng tôi sẽ hướng dẫn cách tạo môi trường triển khai liên tục bằng tài khoản GitHub và môi trường triển khai Vercel.

Phần thưởng: Thư viện Ajv

Khi xây dựng API web, việc xác thực dữ liệu đầu vào do người dùng gửi lên mỗi lần có thể gặp khó khăn. Đây chính là lúc thư viện Ajv và JSON Schema có thể hỗ trợ.

Phần thưởng: React Query

Chúng ta sẽ triển khai tính năng tải dữ liệu phân trang bằng useEffect của React.js. Chúng ta cũng sẽ tìm hiểu cách điều chỉnh tính năng này bằng React Query.


Câu hỏi dự kiến Hỏi & Đáp 💬

H. Tôi có thể tham gia khóa học này ngay cả khi tôi không chuyên về kỹ thuật máy tính (không phải chuyên ngành chính) không?

A. Có thể. Tuy nhiên, sẽ dễ hiểu hơn nếu bạn biết cú pháp JavaScript.

H. Nội dung bài học được trình bày ở mức độ nào?

A. Khóa học này tập trung vào việc xây dựng các dịch vụ thực tế thay vì lý thuyết hoặc cú pháp của React.js, Node.js và Next.js. Khóa học tập trung vào việc xây dựng và trình bày các từ khóa để học sâu hơn.

H. Tôi có cần chuẩn bị gì trước buổi thuyết trình không?

A. Nếu bạn chưa từng làm việc với JavaScript trước đây, bạn nên tìm hiểu sự khác biệt giữa let và const, cũng như map của Array.


Giới thiệu Người chia sẻ kiến thức ✒️

Tôi làm việc với vai trò là lập trình viên front-end tại Elegant Brothers .
Tôi tin rằng những người bình thường có thể cùng nhau làm nên những điều phi thường.


Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Những người còn e ngại khi bắt đầu lập trình lần đầu

  • Bất kỳ ai muốn tạo một dịch vụ mà ai cũng có thể sử dụng, ngoài danh sách TODO

  • Những người có kiến ​​thức về front-end nhưng không biết gì về back-end

Cần biết trước khi bắt đầu?

  • Khái niệm cơ bản về JavaScript

Xin chào
Đây là

2,344

Học viên

36

Đánh giá

66

Trả lời

4.7

Xếp hạng

3

Các khóa học

우아한형제들에서 프론트엔드 프로그래머로 일하고 있습니다. 평범한 사람들이 모여서 비범한 일을 할 수 있다고 믿습니다.
- 현) 우아한형제들, 프론트엔드 프로그래머
- 전) 야놀자, 백엔드 프로그래머
- 전) ArasoPandan, 백엔드 프로그래머
- 전) MobiDIX, 모바일 게임 클라이언트 프로그래머

Chương trình giảng dạy

Tất cả

53 bài giảng ∙ (5giờ 41phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

22 đánh giá

4.5

22 đánh giá

  • xxiiuu님의 프로필 이미지
    xxiiuu

    Đánh giá 3

    Đánh giá trung bình 4.7

    5

    45% đã tham gia

    일단 중간까지 듣고 남깁니다. 프론트엔드로 취업하시려는 취준생분들 들어주세요. 이유는 1. 떠먹여 주지 않음 이 강의는 엄청 잘하는 사수한테 모르는 거 물어보면 요약한 느낌으로 설명해주시면서 5분 화면 보여주시는데 => 내 자리로 돌아와서 방금 본 거 구글링해보고 좀 더 독스 찾아보면 보여주신 게 이해되는 느낌의 강의입니다. 근데 진짜 못따라가는 정도는 아닙니다. 저처럼 이해가 안되면 꼭 짚고 넘어가는 모난 성격 아니면 그냥 넘기면서 강의 보셔도 괜찮을 거에요. 저는 초반에 나오는 OOP 디자인 패턴 한 개, firebase 독스 읽어보기, chakra 읽어보기 정도를 추가로 했습니다. 큰 그림 보고 스스로 공부하는 스타일로 공부해야 취업합니다 2. 모르는 라이브러리 Chakra 차크라 처음해봤습니다만. 이것도 어떻게 사용하는지 자세히 안알려주시고 샤악 보여주심. 하지만 회사에서 일하는 느낌으로다가 알아서 독스 찾아 보고 조금 익히고 다시 따라오면 괜찮습니다. 사실 스타일링 라이브러리 자세히 알려주는 게 프론트엔드 강의는 아니잖아요 3. 리팩터링 강의를 따라가다 어떤 코드를 작성하고 나서 좀 복잡해지거나 재사용성할 필요성이 느껴지면 그 코드를 바로 옮기고 다시 작성하는 게 좋았습니다. 4. 쿠폰신공 강사님이 medium 에도 글 올리시는데 거기 글 찾아보면 할인율 높은 쿠폰 올라와 있는 거 비밀 아닌 것 같습니다. 5. 적극추천 제가 실력이 부족한 프린이라 그럴 수도 있지만 강의에서는 그냥 대충 넘길 내용은 1도 없고 편집이나 구성도 많이 고민해서 하신 것 같습니다. 그리고 수강기간 3개월이 긴 것 같으면서도 은근 압박되어서 놀다가도 "앗, 강의 들어야지" 하고 돌아오게 됩니다. Dead line Driven Development에 딱 맞는 강의라고 생각됩니다. 6. 질문-답변 제가 귀찮게 이것 저것 많이 물어보고 있는데..잘 설명해주십니다. 좋은 강의 올려주셔서 감사합니다.!

    • totuworld
      Giảng viên

      츄츄님 너무 감사합니다. 글 읽으면서 많이 웃고 힘도 많이 받았어요. 제가 의도한 학습 방법을 너무나 잘 해주신듯해서 좋네요. 어디서 어떤 일을 하실지 모르지만 늘 응원하겠습니다.

  • 365kim님의 프로필 이미지
    365kim

    Đánh giá 4

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    속도감 있는 코딩 덕분에 재밌게 잘 들었습니다. 제가 이 강의의 수강 직전에 이거랑 비슷하게 최신 기술스택 라인업에 강사님께서 라이브 코딩해주시는 다른 강의를 수강했는데 그 강의는 강사분께서 좀 즉흥적으로 진행하셔서 수강생 입장에서 흐름 따라가기 좀 힘들었는데 이 강의는 순서대로 따라가기 훨씬 수월해서 좋았어요. 강의 하나하나 준비 많이하신 것 같아요. 강의 중에 Thunder Client 사용하시는거 보고 저도 익스텐젼 바로 설치했습니다. 포스트맨 설치안해도 VS Code 상에서 요청 보내볼 수 있어서 편하네요. 주석을 작성할 때 ‘//‘ 말고 ‘/** */’ 처럼 JS Doc 방식으로 작성하면 주석 내용이 에디터상에서 hover했을 때 표시된다거나 하는 잔잔바리 꿀팁도 들려주시는데 이게 은근 좋았어요. 다음에 또 강의 출시하시면 이런거 또 많이 전수해주세요. + 강의 리뷰 중에 Chakra-ui 학습에 대한 부정적인 의견이 있는데, 저는 조금 다르게 생각합니다. 챠크라 UI는 잘 만들어진 UI 라이브러리로 평가되어, 많은 개발자 분들이 컴포넌트 설계할 때 참고하시기도 하고 사용법이 다른 UI 라이브러리랑 큰 차이가 없어 보입니다. 지금까지 UI 라이브러리를 써보신 분께는 러닝커브가 거의 없으실 것이고, 지금까지 UI 라이브러리를 안써보신 분께는 이번 기회에 잘 만들어진 UI 라이브러리를 접해보시면 좋을 거라고 생각합니다. 재미와 실무팁 모두 가져갈 수 있는 프론트엔드 강의라 주변에 추천하고 싶습니다. 좋은 강의 감사합니다.

    • 저도 material ui 자주썼었는데 사용법이 매우 비슷하네요. 앞으로 회사에서 어떤 ui를 쓸지 모르는데 다른 ui 라이브러리를 써봐서 좋았어요.

  • 나두코딩님의 프로필 이미지
    나두코딩

    Đánh giá 4

    Đánh giá trung bình 4.8

    4

    23% đã tham gia

    객관적으로 평가하면, 가격 대비 1. firebase 및 API 작성시 코드에 대한 설명이 부족합니다. 2. Chakra UI를 사용하지 않는 입장에서 또 다른 UI framework를 배우는 불편함 개인적으로 앞에만 듣고 환불을 하고 싶었는데, 불필요한 부분들 수강해서 환불 기준을 넘어서 환불을 진행할 수가 없었음 개인적으로 배운게 없고, 더 들어도 배울게 없어서 돈 낭비 했다고 생각이 듭니다. 강사님은 최대한 친절할려고 하는게 있지만 제 입장에서는 코드에 대한 친절한 설명보다는 이거는 이렇다 정도로만 들려서 배운게 없었네요. 그리고 3달이면 충분히 다 들을 수 있는 시간이긴 하지만, 다른 강의들과 비교했을 때, 시간이 지나서 확인하고 싶은 부분이 있을 수 있기 때문에 3달이라는 시간은 짧은 것 같네요. 강의 비용이 적은 것도 아니구요. 그래도 정성으로 강의 만드셨기에 4점 평점으로 남기도록 하겠습니다

    • totuworld
      Giảng viên

      안녕하세요 나두코딩님. 지적감사합니다. 어떻게 수정할 수 있을지 고민해보겠습니다.

  • 소라연님의 프로필 이미지
    소라연

    Đánh giá 81

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    출퇴근 길에 들었는데 이해가 잘되었습니다. 시간내서 코딩 해볼께요 좋은 강의 너무 감사합니다.

    • endymion cheon님의 프로필 이미지
      endymion cheon

      Đánh giá 14

      Đánh giá trung bình 5.0

      5

      100% đã tham gia

      완강했습니다~ 실제 서비스를 만들면서 쉽고 빠르게, 깔끔하고 즐겁게 공부할 수 있었습니다. 개운한 기분이드네요 ㅎㅎ 많이 배울 수 있었습니다. 감사합니다~

      • totuworld
        Giảng viên

        endymion님 벌써 과정을 마치셨군요! 축하해요 🎉🎉🎉 다른분들에게 도움이 될 꿀팁도 남겨주시고 이렇게 수강평까지 남겨주시다니 감동이네요.

    2.089.184 ₫

    Khóa học khác của totuworld

    Hãy khám phá các khóa học khác của giảng viên!

    Khóa học tương tự

    Khám phá các khóa học khác trong cùng lĩnh vực!