Module 1 - Introduction
1. Welcome to the course2. Why Go3. Why start and build a blog?4. What about React/Vue/Angular?5. Getting setup and source filesModule 2 - Tech Stack Walkthrough
1. Introduction to Golang Part 12. Introduction to Golang Part 23. Introduction to Golang Part 34. Structuring Golang Applications5. Templating with Templ6. Just enough interactivity with HTMX7. Getting started with postgres8. Servers, routers and endpointsModule 3 - Creating the MVP
1. What are the minimal requirements?2. Doing some initial plumbing3. Embedding static assets4. Creating our first views5. Tailwind & Utility-first CSS6. Styling the Landing Page7. Styling the Article PageModule 4 - Managing Content
1. Choose your own adventure2. Writing in Markdown3. Parsing Markdown to HTML4. Frontmatter and Meta Information5. Making our code examples look nice6. Adding error pagesModule 5 - Adding the Database
1. What is a Migration?2. Our first migration: articles table3. Creating the Database Layer4. Showing the Latest Posts5. Slugs and Human Readable URLsModule 6 - Managing the Blog
1. What are the minimum requirements?2. A new layout approaches3. Introduction to authentication4. Our second migration: Users Table5. Storing passwords securely6. Authenticating users Part One7. Authenticating users Part Two8. Remember me/Forget me9. Managing posts using a hypermedia API - Part One10. Managing posts using a hypermedia API - Part Two11. Managing posts using a hypermedia API - Part Three12. Managing posts using a hypermedia API - Part Four13. Implementing CRUD For Articles - Part One14. Implementing CRUD For Articles - Part Two15. Implementing CRUD For Articles - Part Three16. Implementing CRUD For Articles - Part Four17. Flashing Ourselves/Providing Visual Feedback - Part One18. Flashing Ourselves/Providing Visual Feedback - Part Two19. Flashing Ourselves/Providing Visual Feedback - Part ThreeModule 7 - Adding Subscribers
1. What are the minimum requirements?2. Expanding the database: Tokens & Subscribers3. Creating the token and subscriber models - Part One4. Creating the token and subscriber models - Part Two5. Creating the subscription form6. Saving and verifying subscribers - Part One7. Saving and verifying subscribers - Part Two8. Saving and verifying subscribers - Part Three9. Emails and Clients - Part One10. Emails and Clients - Part Two11. Emails and Clients - Part Three12. Our fifth migration: Tokens Table13. Email validation view14. Email validation tokens15. Sending validation emails with SES16. Making it all come togetherManaging the Blog
Flashing Ourselves/Providing Visual Feedback - Part Two
Summary
Coming soon.
Transcript
Alright, so before we create the toast component, we need a way to extract all of the flash messages in our view. So just as we did with the app context, with this extract app, we can create another one called extract flash messages. And this one is not going to be app context, it's going to be flash context, not flash key, but flash key, flash message, also return a flash message, and return an empty flash message if we couldn't convert it. Should we call this? Yeah, let's just call it flash context, that's probably fine. Then in our views, we can now create a toast message dot temple, and we are going to be creating a package views. There we go. And the component is going to be toast base. It's going to take a T type string, which is the toast type, flash, which is going to be the context.flash. Nope. Context. Flash message. And there we go. Now, this is going to be a div with a bg base 300, rounded, border. And we want the border to be white with a little bit of like half opacity, flex, flex call, and let's make it a width 72. And I didn't succeed in using emit for this, let me just, so what we have bg base, we have rounded, we have border white, and we want border white slash 50, and flex and flex call with width 72. Now, the toast is going to be having like a header that has a success color or info color or basically whatever color depending on the type it is. And then it's going to say the time since it was posted and then a little X to close it with the actual message. So nothing really new for that part is going to go into this. So let me just quickly copy paste this here. And I can see I have added this carbon. Let me just see if we can get it in and then we will add it to our go.mod file. Carbon is basically a way that's really easy to work with timestamps. So they have a lot of, basically not only timestamp, but timing go in general. They're very nice to make these like this for humans. So it was instead of saying like the specific time, it will say like three seconds ago, five minutes ago, whatever. It is very nice to work with. And we need to go out and say go mod tidy should now hopefully be included. There we go. Then these toast should not live on forever. They should show for a certain amount of time and then they should disappear. And for that, we are going to be implementing Alpine JS. So copy paste this and all of these methods is basically Alpine JS. So we have a show. So this is just an object with an attribute show set to true. And we show if show is true, then we have some transitions here. So we'll ease in and out. Finally, a timeout. So this will show for eight seconds and then it would also remove itself. Or if you click the X button, then it will also close itself. So this is our toast base. Now we just need to create all of the different versions. So template toast message takes in the flash context toast message. And in here, oh, I misspelled this, did I? Toast. Toast message, right, is flash message. Flash message. I'm going to say switch flash type. And if it's a context dot flash success, then we would return toast base with BG success and a flash. So we're going to repeat this for the other type, flash info, BG info, flash warning, BG warning, and then lastly, error, BG error. All right. Now in our dashboard base here, we can at the bottom here create a div where we will simply loop over the flash messages that gets put into the context. And we're going to be using app so loot, bottom five, and right five so that it gets put down in the bottom right corner. And in here we're going to say for flash in range contexts, extract flash message, pass the context, then say toast, toast message, and then flash. All right, we need to import context. Go.Extract.Don't we have extract flash messages?There we go.Nope.Okay.Ah.Yes, we are going to be having multiple, right, no, and now we simply just need to add some help on it and start adding the flashes and we can start to get some visual feedback whenever we do an operation in our dashboard.