강의

멘토링

로드맵

Programming

/

Database

GraphQL完全征服(キオスクを作って学ぶフルスタックコース) - [2024部分リニューアル]

次世代API制御技術であるGraphQLの基本と高度な使い方、そしてGraphQLで作っていく仮想のキオスクサービスを通じて、実際のプロジェクト体験を学びます。 コースは、2024年2月現在の最新バージョンであるapollo-server v4でコースを部分的に更新しました。

  • Indie Coder
GraphQL
Svelte
MongoDB
Apollo

学習した受講者のレビュー

こんなことが学べます

  • Graphql

  • Apollo

  • MongoDB

  • Svelte

  • NodeJs

  • nodeJsファイルのアップロード

  • トークンベースの認証方法

  • フルスタック(ウェブバック&ウェブフロント&)

  • 仮想キオスクサービスの開発

フロントエンド、バックエンドとも実装可能!
GraphQLの実践を体験してください💪


自信の最高の秘訣は
何かを最初から最後まで作ってみることです。
Webの基礎を少しでも学んだら
今回の機会に様々な技術で一歩進んでみてください!

GraphQL完全征服👑

REST APIを補完、発展させて作られた次世代API制御技術GraphQL。 GraphQLの基礎から高級、完結したサービスまで!この講義では、バックエンド、フロントエンド、展開までのすべてのコースを学ぶことができます。一緒にスマートメニューを作ってみますか?

簡単に理解できるように準備した講座内容

#1.
GraphQLの
基本文法と高度な文法

GraphQLに必要な文法をすべて漸次学習することになります。講義の理論部分は、イメージ、アニメーションなどを活用し、できるだけ簡単に理解できるように準備しました。

#2.
実際のプロジェクト
(スマートメニュー)実装

基本的な使い方を学んだら、次は実際のプロジェクトの実装でしょうか?仮想のキオスクサービスであるスマートメニューをGraphQlを利用して作成します。バックエンドサーバーからフロントエンドまで、すべてGraphQLを中心に実装します。

#3.
様々な問題の
解決策

コードをたどりながらデータを読み書きすることを超えて、サービスを作成するときに発生する可能性のあるさまざまな問題と解決策を学びます。 Apolloキャッシュを使用する際に発生するデータ整合性の問題、NodeJSからファイルをアップロードする際の注意点、サービスに必要な認証などを学ぶことができます。

#4.
より効率的な
フロントエンド開発方法

最近ホットに浮かんでいるSvelteというフレームワークを利用して、より効率的にフロントエンド開発する方法もお知らせします。これにより、GraphQLの基礎知識はもちろん、1つのサービスのバックエンド、フロントエンド、デプロイまで体験できるようになります。


こんな方におすすめですよ🙋‍♀️

GraphQLに興味があり、入門を悩む方

Webバックエンド、フロントエンドフルスタックを体験したい方

Apollo、Svelteなど最新技術で作るウェブが気になる方

HTML、Javascriptの基礎を身につけた後に何か実装したい方


実装プロジェクトのプレビュー👀

無限スクロールで実装されたメニュー表示画面

ログイン画面

メニュー登録画面

ご注文後のアラーム画面

講義参考資料📍

  • 講義に使用されているパッケージやソースコードなどのリンクについては、「セクション2 GraphQL基本 - 講義資料の紹介」を参照してください。

参考講義📚


予想される質問 Q&A 💬

Q. GraphQLの理論講義ですか?

基本的な使い方から実際のプロジェクトに適用する方法のすべてを学びます。プロジェクトでは、バックエンドとフロントエンドの両方でGraphQLを実装する方法が用意されています。

Q.フロントエンドの場合、Svelteを事前に学習する必要がありますか?

講義の途中で簡単にSvelteの基本的な使い方を用意しました。準備した内容だけを知り、進んでいけば十分に最後まで学習可能だと思います。

Q.開発環境はどうなりますか?

Mac、Windows、LinuxなどのnodeJsをインストールできるどのPCでも、開発環境に必要なプログラムをインストールして進めることができます。


知識共有者の紹介✒️

2000年度半ばから本格的にウェブ開発を始め、現在までフリーランスの開発者として活動しています。約5年間、Amplix BIソリューションの実務者教育を進め、開発を支援し、新しい技術を効率的に伝えることに多くの経験と悩みを持ってきました。

現在は、開発業務とともに、開発者に役立つWeb関連分野の新技術を探し、講座や本を通じて共有しています。

  • 県)フリーランサー
  • 前)(株)ビーズプラグ戦略ソリューション事業部チーム長
  • 前) (株)ファーニーモンキースウィニストリーサービス開発チーム長

email: freeseamew@gmail.com

blog: https://medium.com/freeseamew

出版書


こんな方に
おすすめです

学習対象は
誰でしょう?

  • javascriptの基礎を学ぶ

  • Webサービスを最初から最後まで一度作りたい方

  • Webバックエンドエンジニア

  • Webフロントエンドエンジニア

前提知識、
必要でしょうか?

  • html

  • javascript

こんにちは
です。

2,446

受講生

60

受講レビュー

84

回答

4.8

講座評価

5

講座

2000년도 중반부터 본격적으로 웹개발을 시작하여 현재까지 프리랜서 개발자로 활동하고 있습니다. 약5년간 Amplix BI 솔루션 실무자 교육을 진행하고 개발을 지원하며 새로운 기술을 효율적으로 전달하는 것에 대한 많은 경험과 고민을 했습니다. 

현재는 개발 업무와 함께 개발자들에게 도움이 될만한 웹관련 분야의 새로운 기술을 찾고 강좌와 책을 통해 공유하고 있습니다. 

 

현) 프리랜서

전) (주) 비즈플러그 전략솔루션 사업부 팀장

전) (주) 퍼니몽키스 위니스토리 서비스 개발 팀장

youtube: https://www.youtube.com/channel/UC3cJspjF4TRTyD_RS0azeaw 

email: freeseamew@gmail.com

blog1: https://medium.com/freeseamew

blog2: https://dev.to/freeseamew

 

강좌 목록

출간도서

yes24, 교보문고, 알라딘

 

 

 

カリキュラム

全体

72件 ∙ (10時間 28分)

講座掲載日: 
最終更新日: 

受講レビュー

全体

6件

4.5

6件の受講レビュー

  • wndtlr10248980님의 프로필 이미지
    wndtlr10248980

    受講レビュー 5

    平均評価 4.4

    3

    100% 受講後に作成

    Nhìn chung thời gian giảng ngắn, có ưu điểm là không gây cảm giác nặng nề và có ưu điểm là trả lời câu hỏi nhanh chóng. Về phần nhược điểm... Mã đã được viết sẽ được hiển thị và giải thích ở định dạng ppt. (Khi được nhấn, mã hiện có sẽ bay đi và mã được thêm vào bằng một thanh trượt) Mặc dù tôi đang xem các cấu trúc mã lạ và nghe giải thích ở định dạng ppt, nhưng tôi không thể hiểu được dòng mã và rất khó theo dõi. Đã có mã bài giảng cho phần này trên GitHub, vậy tại sao bạn không sao chép và dán nó? Bạn có thể làm điều đó. Tuy nhiên, nếu bạn đã có ý định làm như vậy thì GitHub lẽ ra cũng nên lưu mã vào các nhánh cho từng phần bài giảng. Mã bài giảng GitHub đã là mã hoàn chỉnh và việc sao chép và dán mã bằng cách so sánh chúng với bài giảng mà tôi hiện đang nghe rất mệt mỏi. Nghe phần server đầu khóa mình đã học chăm chỉ suốt 4 tiếng đồng hồ không ngừng nghỉ và say mê nhưng từ khi tham gia phần front mình bắt đầu nghĩ học phí quá đắt so với chất lượng. của bài giảng tôi đã chuyển nó đi. Cuối cùng, đây không phải là một buổi hội thảo như Tech Tech, nhưng tôi nghĩ sẽ có nhiều người không thích bài giảng dạng PPT này hơn là thích nó. Hơn nữa, mã không quá phức tạp hay dài nên tôi nghĩ sẽ tốt hơn nếu bạn thêm phần giải thích khi nhập mã cùng nhau. Khi tôi theo dõi bài giảng đến ppt, tôi cảm thấy thực sự mệt mỏi với tư cách là một người nghe. Tôi chỉ xem nửa sau của bài giảng và bỏ qua nó bằng cách nhấp vào nút.

    • viewee님의 프로필 이미지
      viewee

      受講レビュー 3

      平均評価 3.7

      4

      100% 受講後に作成

      Bạn đã hoàn thành khóa học. Với sự hiểu biết cơ bản về Javascript, HTML và CSS, Tôi tham gia lớp học vì tôi muốn tạo một dịch vụ toàn diện. Ngoài ra còn có React và Vue nhưng Svelte được cho là dễ dàng và hấp dẫn. Tôi đã chọn thư viện này. Lớp này bao gồm toàn bộ quá trình từ con số 0 đến việc tạo ra một dịch vụ menu thông minh. Lời giải thích được giải thích từng bước nên tôi hiểu rất rõ. /// Điều đáng thất vọng là tôi cứ bị mắc kẹt trong giờ học. Tôi đã mắc một số lỗi chính tả khi viết mã, nhưng có nhiều lỗi chính tả quan trọng trong video bài giảng, vì vậy sẽ nảy sinh vấn đề nếu tôi cố gắng làm theo bằng cách chỉ xem video bài giảng. Thỉnh thoảng có lỗi chính tả trong mã ví dụ nên mỗi lần chạy máy chủ và kiểm tra nó, tôi thường bối rối không biết mình đã mắc lỗi hay có lỗi đánh máy trong nội dung bài giảng. (Tôi không hiểu làm thế nào những người viết bài đánh giá lớp khác lại tiến hành lớp học mà không đặt câu hỏi trên bảng thông báo. Chẳng phải họ đã đi đến cùng sao?) Môi trường trong lớp là Mac OS và môi trường của tôi là môi trường Windows, vì vậy không giống như lớp đó, lệnh thực thi máy chủ là met.bat thay vì sao băng. Hoặc có vấn đề về tiến độ lớp học khác nhau do phiên bản hiện tại của Meteor khác. Tuy nhiên, khi tôi đăng câu hỏi về những vấn đề này lên bảng tin cộng đồng, giáo viên đã trả lời trong vòng một hoặc hai ngày nên tôi có thể tiếp tục đến lớp. // Từ phần 4 về cách tạo SMART MENU, ban đầu thì không sao, nhưng khi mã ngày càng mở rộng, việc so sánh sự khác biệt với mã trước đó khi xảy ra lỗi trở nên rất quan trọng. Tôi cảm thấy cần phải kiểm soát phiên bản, đồng thời nghiên cứu và áp dụng Git riêng biệt. Vì tôi tham gia lớp học bằng cách tạo một nhánh bất cứ khi nào mã trong mỗi phần được hoàn thành mà không có lỗi và cam kết mỗi khi hoàn thành một chương nhỏ trong phần đó nên tôi có thể phản hồi nhanh chóng ngay cả khi có lỗi xảy ra sau phần 12 và 13. Đối với những người mới bắt đầu như tôi, tôi khuyên bạn nên học Git riêng và sử dụng nó trong lớp. Ngoài ra, về việc gỡ lỗi trong lớp, tôi nghĩ sẽ tốt hơn cho những người mới bắt đầu như tôi nếu có nhiều phần hơn để kiểm tra cửa sổ terminal cho phần phụ trợ và cửa sổ bảng điều khiển cho giao diện người dùng. Đây là nội dung cơ bản nên tôi không nghĩ nó được đưa vào nội dung của lớp. Tuy nhiên, tôi nghĩ sẽ tốt hơn nếu đề cập ngắn gọn về git và các phương pháp gỡ lỗi trong lớp. // < Sự cố chặn phụ đề > Ngoài ra còn có các video có phụ đề giữa các bài giảng và tôi hy vọng rằng khi đổi mới phụ đề, chúng sẽ được đặt phía trên thanh phát. Mỗi lần tôi dừng lại và nhìn, phụ đề đều bị che khuất. ㅠ // Trong khi dạy lớp, tôi đã làm việc chăm chỉ để báo cáo bất kỳ chỗ mắc kẹt và lỗi chính tả nhỏ nào, và để giải quyết những chỗ này, Giáo viên cho biết công việc đổi mới khóa học sẽ được thực hiện vào tháng 3 năm 2023, vì vậy những người tham gia lớp học sau đó có thể sẽ thấy lớp học thoải mái hơn. // Sau khi hoàn thành lớp học, - Cách thức hoạt động của GraphQL nói chung và cách vận hành nó trên máy chủ Apollo. - Bạn đang sử dụng Svelte để xây dựng front-end kết nối với back-end một cách dễ dàng và nhanh chóng? Tôi đã có thể tìm ra. Tôi chăm chú nghe và hiểu, nhưng tôi nghĩ mình cần đọc lại hai ba lần để hiểu rõ hơn về cấu trúc và cách thức hoạt động. Cá nhân tôi nghĩ mình cần nghiên cứu thêm về cách tạo front-end bằng Svelte, vì vậy tôi nghĩ mình cần phải học thêm. Là người mới bắt đầu chỉ xem React hoặc Vue qua video nên tôi không chắc lắm, nhưng sau khi tạo dịch vụ bằng Svelte, tôi thấy Svelte rất dễ dàng và trực quan. Một khung tích hợp dành riêng cho Svelte có tên là svelteKit đã được phát hành và tôi hy vọng rằng bạn cũng sẽ tạo một khóa học cho phần này.. Nội dung bài giảng thực sự mang tính thông tin nên nếu bạn muốn nghe thì hãy nghe nhé.

      • holocoding
        知識共有者

        Tôi rất vui vì bạn đã hoàn thành bài giảng một cách an toàn. Trước tiên, chúng tôi đã cải thiện lỗi chính tả và các phần có vấn đề bằng cách nhận xét về video. Cảm ơn bạn đã chỉ ra phần này. Và về sveltekit, chúng tôi sẽ cố gắng ra mắt sớm nhất có thể. Một lần nữa xin chúc mừng bạn đã hoàn thành khóa học. Cảm ơn

    • sycheon3883님의 프로필 이미지
      sycheon3883

      受講レビュー 2

      平均評価 5.0

      5

      80% 受講後に作成

      Bố cục hay quá

      • holocoding
        知識共有者

        Tôi rất vui vì bạn thích khóa học. Chúng tôi sẽ tiếp tục nỗ lực chuẩn bị những bài giảng hay trong thời gian tới. :)

    • lsmin01님의 프로필 이미지
      lsmin01

      受講レビュー 1

      平均評価 5.0

      5

      100% 受講後に作成

      Cảm ơn bạn vì bài giảng tuyệt vời. Tôi quen với cách phát triển giao diện người dùng/được hỗ trợ dựa trên graphql. Các phần bộ đệm, liên kết, tải lên tệp và xác thực cũng rất hữu ích. Đây là lần đầu tiên tôi sử dụng sao băng, nhưng tôi thấy nó hữu ích sau khi làm theo quá trình triển khai cuối cùng. Tôi mong đợi nội dung tốt trong tương lai.

      • holocoding
        知識共有者

        Cảm ơn bạn đã để lại đánh giá. Tôi rất vui vì bạn thấy nội dung này hữu ích. Sau đó hãy vui vẻ viết mã :)

    • leaguematter7718님의 프로필 이미지
      leaguematter7718

      受講レビュー 5

      平均評価 4.6

      5

      31% 受講後に作成

      期間限定セール、あと3日日で終了

      ¥895,637

      23%

      ¥6,752

      Indie Coderの他の講座

      知識共有者の他の講座を見てみましょう!

      似ている講座

      同じ分野の他の講座を見てみましょう!