Full Stack Photobook App | Vue, GraphQL, AWS Amplify

Program With Erik YouTube Channel

Code:

AWS Workshop:

Timestamps:
0:00 Overview of Application
1:32 Setup
4:04 Overview of AWS Services
06:10 Install Tools
11:36 Amplify Configuration
16:03 Configure Vue App With Amplify
18:45 Authentication
20:00 Adding AWS Cognito To App
24:50 Add Authentication To Vue
27:42 Setting up Auth Vuex Store
41:29 Creating Login Component
49:17 Setup Routes
51:51 Create Signup Page
01:04:20 Creating Nav Component
01:11:57 Adding Route Guards
01:17:45 GraphQL and Storage
01:18:42 Add AWS Storage
01:20:15 Add AWS App Sync
01:22:46 Updating GraphQL Schema
01:27:46 Mocking GraphQL API with Playground
01:38:17 Adding Album Vuex store
01:49:43 Update Albums page
02:05:25 Update AlbumsDetails page
02:14:39 Testing out album feature
02:15:44 Lambda Function
02:17:00 Adding Lambda in AWS Amplify
02:20:00 Update Amplify Photo Processor
02:22:45 Update amplify storage
02:24:31 Update cloud formation template
02:29:20 Testing App E2E

[ProgramWithErik]

Thanks for having me on Brad! It was fun!

[DesignCourse]

I thought this said, "Full Stack Photoshop" and I was immediately intrigued. :|

[andrewiglinski]

Dude I didn't even get to watch it... I'm about to head out to the gym and I CANT WAIT to get back and watch this just based on the stack. STOKED.

[andrewplater]

Wow that explained so much in one place that I had trawled documentation all over the place to find, well done!

[Viralplace]

Love Vue.js and Laravel... hope to see here Jeffrey Way like special guest!

[DevMadeEasy]

Brad Traversy bring another amaning video, thanks!

[DJPrice-cclg]

I love the direction your channel has taken, Brad. I know it's because of personal difficulties, so I admire your determination and creativity!

[tonythorne]

I made it! (to the end, not the app) Great tutorial. Thanks

[lardosian]

Thanks Eric and Brad, I'm using Amplify with React in my project, seems like a very powerful framework, you need to be careful as well, very easy go wrong. For example when updating your schema you can only add one @key directive at a time or else amplify push will fail. The only thing I find slightly confusing is multiple dynamodb tables generated per model, my understanding was dynamodb uses just one table as per nosql, but ye I'm learning as i go!

[cnikolov]

I made it, its crazy how services like aws can accelerate develpment.

[ahrmerd]

Finally...i've been waiting for erik to be on trasversy media....

[hamzasayyid]

This is awesome. I'm really liking the theme and font you have for VS Code. Mind sharing which ones you are using?

[shrutichaturvedi]

Great video! But, isn't there a step missing? in order to create the aws-exports.js file, we'll first have to do an amplify add <api-service>

[felipechaves]

I still have to create some interfaces to get rid of some "any" in the code, but the project is done and working.

[technoinfoworldwide]

We need node js backend projects...i can't find latest one on this channel

[danielbark]

Ooo Nice topic! Definitely going to enjoy this one ⭐️

[AaronTheImposter]

Idk why, but Erik makes me think of The Purge

[SeyedSadeghAtaii]

Are you using a mechanical keyboard? I've found I'm making all those typos, etc, now that I've upgraded. Great tutorial btw, keep up to good work!

[JoseMartinez-mdif]

If you get stuck @1:55:30 (est) you need to run amplify mock api and make sure that it is running in order to create the new album....

[aleb]

my first Vue.js experience !! (coming from React)