- 了解如何構(gòu)建解決實(shí)際問題的無服務(wù)器應(yīng)用程序。
- 了解這些技術(shù)的應(yīng)用場景(以及局限)。
- 創(chuàng)建與DynamoDB和NoSQL數(shù)據(jù)庫進(jìn)行交互的GraphQL API。
- 學(xué)習(xí)身份驗(yàn)證的工作原理,并了解身份驗(yàn)證和授權(quán)之間的區(qū)別。
- 深入了解無服務(wù)器函數(shù)的工作原理及其重要性。
- 在AWS上構(gòu)建全棧應(yīng)用程序,并使用Amplify DataStore構(gòu)建脫機(jī)應(yīng)用程序。
云計(jì)算通常與后端開發(fā)和DevOps有關(guān)。但隨著Serverless技術(shù)的興起以及新一代服務(wù)和框架的出現(xiàn),前端和移動開發(fā)人員也可以構(gòu)建強(qiáng)大的應(yīng)用程序,并且其中支持生產(chǎn)就緒的功能包括身份驗(yàn)證和授權(quán),API網(wǎng)關(guān),聊天機(jī)器人,增強(qiáng)現(xiàn)實(shí)場景等。本書向你展示了如何實(shí)現(xiàn)上述功能的步驟。
Amazon Web Services的倡導(dǎo)者Nader Dabit將指導(dǎo)你完成使用React、AWS、GraphQL和AWS Amplify構(gòu)建全棧應(yīng)用程序的過程。你將學(xué)習(xí)如何在客戶端創(chuàng)建服務(wù)并將其集成到客戶端應(yīng)用程序中,同時還會學(xué)習(xí)常規(guī)的實(shí)踐、部署策略、富媒體管理,以及整個過程中的持續(xù)集成和交付。
前言
本書緣起
次學(xué)習(xí)編程時,我對軟件開發(fā)工作的細(xì)節(jié)知之甚少。當(dāng)時一心只想著構(gòu)建一款應(yīng)用程序,當(dāng)我開始研究并磕磕碰碰地完成想做的所有事情時,才知道自己是多么天真。
我了解的重點(diǎn)之一就是,應(yīng)用程序通常由兩個部分組成:前端(客戶端代碼)以及后端API 和服務(wù)。當(dāng)時,云技術(shù)還處于起步階段,至少學(xué)習(xí)如何構(gòu)建全棧應(yīng)用程序是令人頭疼的。對于我來說情況可能更糟,因?yàn)槲蚁霕?gòu)建原生的移動應(yīng)用程序,并且著手構(gòu)建移動應(yīng)用程序比構(gòu)建Web 應(yīng)用程序要困難得多。
信息技術(shù)經(jīng)過10 年的迅猛發(fā)展后,情況有了很大的改觀。曾經(jīng)由一大批開發(fā)者完成的工作現(xiàn)在有時可以由一名開發(fā)人員完成。React Native、Flutter 和Cordova 等工具使得開發(fā)者可以使用單個代碼庫構(gòu)建和交付跨平臺的移動應(yīng)用程序。Amplify、Firebase 等云技術(shù)使得相同的開發(fā)人員也可以利用云計(jì)算技術(shù)以前所未有的速度更快地構(gòu)建后端。
我想我們正在迎接一種新的范式,它使得成為全棧開發(fā)者比以往任何時候都容易,并且全棧開發(fā)者的定義正在發(fā)生變化。寫這本書是為了展示我對這種新范式在實(shí)踐中的看法,并介紹一種專門利用前沿的前端和云技術(shù)而創(chuàng)建的技術(shù)。我認(rèn)為本書描述的是軟件工程的未來。
目標(biāo)讀者
本書適用于希望構(gòu)建全棧應(yīng)用程序的軟件工程師,特別是對云計(jì)算感興趣的。它還適用于希望學(xué)習(xí)如何使用現(xiàn)有技術(shù)來通過云技術(shù)構(gòu)建全棧應(yīng)用程序的前端開發(fā)人員。
對于CTO 和初創(chuàng)公司的創(chuàng)業(yè)者來說,這也是一個很好的資源,因?yàn)樗麄兿M褂蒙俚馁Y源來限度地提高生產(chǎn)效率和開發(fā)速度。本書概述的技術(shù)是快速原型開發(fā)和創(chuàng)意實(shí)驗(yàn)的理想之選,它可以讓開發(fā)人員和創(chuàng)業(yè)者將其創(chuàng)意迅速地推向市場,并在取得成功的情況下提供可擴(kuò)展且健壯的產(chǎn)品。
本書概要
本書的目的是向讀者介紹使用React 和無服務(wù)器技術(shù)構(gòu)建真實(shí)、可擴(kuò)展的全棧應(yīng)用程序所需的所有步驟。通過在每章中構(gòu)建不同的應(yīng)用程序,逐一介紹相關(guān)功能(例如身份驗(yàn)證、API 和數(shù)據(jù))以及一些在前端和后端實(shí)現(xiàn)這些功能的技術(shù)。
你創(chuàng)建的每個應(yīng)用程序都將基于上一章中學(xué)到的知識。在后一章中,你將構(gòu)建一個復(fù)雜的應(yīng)用程序,它將用到在實(shí)際工作或項(xiàng)目初創(chuàng)階段所需的很多云服務(wù)。當(dāng)你完成本書的學(xué)習(xí)之后,應(yīng)該具備了通過React 和AWS 云技術(shù)構(gòu)建自己的無服務(wù)器應(yīng)用程序的知識和能力。
第1 章 無服務(wù)器計(jì)算時代的全棧開發(fā)
在本章中,我們將介紹無服務(wù)器理念,無服務(wù)器應(yīng)用程序的特征和優(yōu)點(diǎn),以及AWS 和AWS Amplify CLI。
第2 章 AWS Amplify 簡介
在本章中,將使用AWS Amplify 創(chuàng)建和部署一項(xiàng)無服務(wù)器功能。我們將創(chuàng)建該功能,然后添加API 并與其交互。
第3 章 創(chuàng)建你的款應(yīng)用
在這里,我們將通過構(gòu)建一個筆記(notes)應(yīng)用來演示從頭創(chuàng)建一個新的全棧應(yīng)用程序的基本流程。我們將創(chuàng)建一個新的React 應(yīng)用程序,初始化一個新的Amplify 項(xiàng)目,添加GraphQL API,然后從客戶端(React)應(yīng)用程序連接到API 并與之交互。
第4 章 身份驗(yàn)證簡介
在本章中,我們將逐步完成向應(yīng)用程序添加身份驗(yàn)證的過程。首先將創(chuàng)建一個新的React 應(yīng)用程序,并使用AWS Amplify React 庫中的高階組件(HOC)withAuthenticator 添加基本的身份驗(yàn)證功能。我們將讀取用戶的元數(shù)據(jù),并創(chuàng)建一個用戶資料頁面,以允許用戶查看其信息。
第5 章 自定義身份驗(yàn)證策略
在本章中,我們將通過使用React、React Router 和AWS Amplify 創(chuàng)建自定義身份驗(yàn)證流程來進(jìn)一步學(xué)習(xí)身份驗(yàn)證。該應(yīng)用程序?qū)皂撁,登錄頁面和忘記密碼頁面。登錄后,將出現(xiàn)一個主菜單,以便將用戶導(dǎo)航到個人資料頁面、地圖頁面和歡迎頁面,并且歡迎頁面將作為該應(yīng)用程序的主視圖。
第6 章 無服務(wù)器函數(shù)進(jìn)階(一)和第7 章 無服務(wù)器函數(shù)進(jìn)階(二)
在這里,我們將介紹無服務(wù)器函數(shù)以及如何在React 應(yīng)用程序中與之交互。將通過創(chuàng)建一個支持CORS 保護(hù)的API 獲取柴犬(shiba inu)圖片的應(yīng)用程序來演示創(chuàng)建、更新和刪除等操作的無服務(wù)器函數(shù),相關(guān)的代碼存放在一個AWS Lambda 函數(shù)中,將使用AWS Amplify CLI 創(chuàng)建和配置這個函數(shù)。
第8 章 AWS AppSync 應(yīng)用
我們將基于第3 章的知識構(gòu)建一個更復(fù)雜的API,它包括多對多關(guān)系和多種授權(quán)類型。我們將創(chuàng)建一個事件應(yīng)用程序,它允許管理員創(chuàng)建表演節(jié)目和舞臺。將讓所有用戶都能夠讀取節(jié)目信息,無論他們是否登錄,但僅允許已登錄的管理員創(chuàng)建、更新和刪除節(jié)目和舞臺。
第9 章 使用Amplify DataStore 構(gòu)建離線應(yīng)用程序
在本章中,我們將介紹如何使用Amplify DataStore 實(shí)現(xiàn)離線功能。
第10 章 圖像與存儲
本章我們將學(xué)習(xí)如何創(chuàng)建圖片共享應(yīng)用,該應(yīng)用程序?qū)⒃试S用戶上傳和查看圖片。
第11 章 托管:將你的應(yīng)用程序部署到支持CI 和CD 的Amplify Console在后一章中,我們將會用到第10 章創(chuàng)建的圖片共享應(yīng)用程序,并使用Amplify Console 將其部署到線上。我們還會學(xué)習(xí)將更新合并到master 分支時,啟動新的構(gòu)建來添加持續(xù)集成(CI)和持續(xù)部署(CD)功能。后,我們將學(xué)習(xí)如何添加自定義域,以便讀者能夠?qū)?yīng)用程序和自己的實(shí)際URL 關(guān)聯(lián)。
排版約定
本書中將使用以下排版約定:
斜體(Italic)
表示新的術(shù)語,URL,電子郵件地址,文件和文件擴(kuò)展名。
等寬字體(Constant width)
表示程序列表,以及在段落中引用程序元素,例如變量或函數(shù)名、數(shù)據(jù)庫、數(shù)據(jù)類型、環(huán)境變量、語句和關(guān)鍵字。
等寬粗體(Constant width bold)
表示應(yīng)由用戶直接輸入的命令或其他文本。
等寬斜體(Constant width italic)
表示應(yīng)由用戶提供的值或由上下文確定的值。
代碼示例
補(bǔ)充材料(代碼示例、練習(xí)等)可以通過如下網(wǎng)址下載:https://github.com/dabit3/full-stack-serverless-code。
如果你在使用代碼示例時遇到技術(shù)問題或疑問, 請發(fā)送電子郵件至bookquestions@oreilly.com。
本書中的代碼可以幫助你完善工作。一般而言,本書中的源代碼,不需要得到我們的許可就可以應(yīng)用到你自己的程序或文檔中,除非你希望重新發(fā)布了這些代碼的副本。舉例來說,一個程序中用到本書中的若干代碼塊不需要許可授權(quán)。銷售或發(fā)布包含OReilly 圖書中的代碼樣例的CD-Rom 不需要授權(quán)許可;卮鹨粋問題引用本書中的內(nèi)容或代碼不需要授權(quán)許可。在你的產(chǎn)品文檔中加入大量的本書代碼樣例需要授權(quán)許可。
我們建議但不強(qiáng)制要求標(biāo)明出處。出處通常包括標(biāo)題,作者,發(fā)行商和ISBN。比如:Full Stack Serverless by Nader Dabit (OReilly). Copyright 2020 Nader Dabit, 978-1-492-05989-9。
如果你覺得使用代碼樣例超出了上述許可范圍,請通過permissions@oreilly.com 與我們?nèi)〉寐?lián)系。
OReilly 在線學(xué)習(xí)平臺(OReilly Online Learning)
近40 年來,OReilly Media 致力于提供技術(shù)和商業(yè)
培訓(xùn)、知識和卓越見解,來幫助眾多公司取得成功。
我們擁有獨(dú)一無二的專家和革新者組成的龐大網(wǎng)絡(luò),他們通過圖書、文章、會議和我們的在線學(xué)習(xí)平臺分享他們的知識和經(jīng)驗(yàn)。OReilly 的在線學(xué)習(xí)平臺允許你按需訪問現(xiàn)場培訓(xùn)課程、深入的學(xué)習(xí)路徑、交互式編程環(huán)境,以及OReilly 和200 多家其他出版商提供的大量文本和視頻資源。有關(guān)的更多信息,請?jiān)L問http://oreilly.com。
聯(lián)系我們
美國:
OReilly Media, Inc.
1005 Gravenstein Highway North
Sebastopol, CA 95472
中國:
北京市西城區(qū)西直門南大街2號成銘大廈C座807室(100035)
奧萊利技術(shù)咨詢(北京)有限公司
致謝
感謝我的妻子Lilly,她在我的職業(yè)生涯中一直堅(jiān)定地支持著我,當(dāng)我為了寫這本書在辦公室工作到很晚,有時在家也工作到很晚的時候,她把我的生活打理得井井有條。
感謝我的孩子,Victor 和Eli,他們都很棒并且是我靈感的源泉,我非常愛你們。
感謝我的父母,是你們讓我有機(jī)會學(xué)習(xí),讓我獲得人生的第二、第三和第四次機(jī)會。
我要感謝許多團(tuán)隊(duì)和個人: 感謝整個AWS 移動團(tuán)隊(duì),是他們大膽雇了剛結(jié)束混亂的咨詢職業(yè)生涯的我,讓我有機(jī)會與我見過的聰明的人一起工作。感謝Michael Paris, Mohit Srivastava, Dennis Hills, Adrian Hall, Richard Threlkald, Michael Labieniec, Rohan Deshpande, Amit Patel,以及所有其他的團(tuán)隊(duì)成員,他們教會了我在新工作中需要學(xué)習(xí)的知識。感謝Russ Davis、Lee Johnson 和SchoolStatus,是他們給了我在這份工作中學(xué)習(xí)前沿技術(shù)的機(jī)會,正是這份工作讓我終進(jìn)入了咨詢行業(yè)。感謝Brian Noah、Nate Lubeck 和我在Egood 的團(tuán)隊(duì),這是我得到的份真正的技術(shù)工作,它讓我接觸到技術(shù)交流大會的世界,以及成為一名偉大的開發(fā)者所需要的東西。
Nader Dabit是Amazon Web Services的一名高級開發(fā)者及其擁護(hù)者,擅長跨平臺和云服務(wù)的應(yīng)用程序開發(fā)。他與客戶端團(tuán)隊(duì)一起通力合作,改善了客戶端SDK的開發(fā)體驗(yàn)。此前,Nader通過其公司React Native Training為很多大公司提供了使用React和React Native框架構(gòu)建應(yīng)用程序的培訓(xùn)服務(wù),其中包括Amazon,、Microsoft、Salesforce和American Express等。
目錄
前言 .1
第1 章 無服務(wù)器計(jì)算時代的全棧開發(fā) 9
1.1 當(dāng)前流行的無服務(wù)器理念 10
1.1.1 無服務(wù)器應(yīng)用的特征 . 11
1.1.2 無服務(wù)器架構(gòu)的優(yōu)點(diǎn) . 11
1.1.3 無服務(wù)器架構(gòu)的不同實(shí)現(xiàn) 14
1.2 AWS 簡介 17
1.2.1 關(guān)于AWS 17
1.2.2 AWS 上的全棧無服務(wù)器特性 17
1.2.3 Amplify CLI 17
1.3 AWS Amplify CLI 簡介 20
1.3.1 安裝和配置Amplify CLI 21
1.3.2 初始化你的個Amplify 項(xiàng)目 22
1.3.3 創(chuàng)建和部署你的個服務(wù) 25
1.3.4 刪除資源 27
1.4 小結(jié) 28
第2 章 AWS Amplify 簡介 29
2.1 創(chuàng)建和部署無服務(wù)器函數(shù) 30
2.1.1 創(chuàng)建React 應(yīng)用程序并安裝依賴項(xiàng) 31
2.1.2 使用Amplify CLI 創(chuàng)建新的無服務(wù)器函數(shù) . 32
2.1.3 代碼解析 33
2.1.4 創(chuàng)建路由/coins 33
2.2 添加API 34
2.2.1 創(chuàng)建新的API. 35
2.2.2 部署API 和Lambda 函數(shù) 35
2.3 與新API 進(jìn)行交互 . 36
2.3.1 配置客戶端應(yīng)用程序與Amplify 協(xié)同工作. 36
2.3.2 Amplify 客戶端API 類 . 36
2.3.3 在React 中調(diào)用API 并渲染數(shù)據(jù) 37
2.4 更新函數(shù)以調(diào)用另一個API 39
2.4.1 安裝Axios 39
2.4.2 更新函數(shù) 40
2.4.3 更新客戶端應(yīng)用 41
2.5 小結(jié) 42
第 3 章 創(chuàng)建你的款應(yīng)用 43
3.1 GraphQL 簡介 43
3.1.1 GraphQL 是什么? . 43
3.1.2 GraphQL API 的構(gòu)成 . 44
3.1.3 GraphQL 操作 45
3.2 創(chuàng)建GraphQL API 47
3.3 查看GraphQL API 并與之交互 49
3.4 構(gòu)建React 應(yīng)用程序 51
3.4.1 列出筆記(GraphQL 查詢) . 51
3.4.2 創(chuàng)建筆記(GraphQL 變更) . 56
3.4.3 刪除筆記(GraphQL 變更) . 59
3.4.4 更新筆記(GraphQL 變更) . 61
3.4.5 實(shí)時數(shù)據(jù)(GraphQL 訂閱) . 63
3.5 小結(jié) 64
第4 章 身份驗(yàn)證簡介 .66
4.1 Amazon Cognito 簡介 67
4.1.1 Amazon Cognito 的工作原理 . 67
4.1.2 Amazon Cognito 與AWS Amplify 的集成 68
4.2 創(chuàng)建React 應(yīng)用程序并添加Amplify . 69
客戶端身份驗(yàn)證概述 . 70
4.3 構(gòu)建應(yīng)用程序 71
4.3.1 創(chuàng)建文件和文件夾結(jié)構(gòu) 71
4.3.2 創(chuàng)建個組件 72
4.3.3 Public 組件 . 73
4.3.4 Nav 組件 73
4.3.5 Protected 組件 74
4.3.6 Router 組件 . 76
4.3.7 Profile 組件 . 77
4.3.8 UI 美化組件 79
4.3.9 配置應(yīng)用程序 79
4.3.10 測試應(yīng)用程序 . 79
4.4 小結(jié) 80
第5 章 自定義身份驗(yàn)證策略 81
5.1 創(chuàng)建protectedRoute 鉤子 82
5.2 創(chuàng)建表單 83
5.2.1 登錄組件(SignIn) 87
5.2.2 注冊組件(SignUp) . 88
5.2.3 注冊確認(rèn)組件(ConfirmSignUp) . 89
5.2.4 ForgotPassword 組件 . 89
5.2.5 ForgotPasswordSubmit 組件 90
5.2.6 完善Form.js 91
5.2.7 updateForm 輔助函數(shù) 93
5.2.8 renderForm 函數(shù) 94
5.2.9 表單類型切換 95
5.2.10 更新Profile 組件 96
5.2.11 測試應(yīng)用程序 . 98
5.3 小結(jié) 98