@gribbl
- Member Since
- Nov 7, 2024
- Lessons Completed
- 174
- Comments Contributed
- 14
- Hours Watched
- 15.62
Recent Activity
Here's what @gribbl has been up to this past year
-
Completed lesson Querying & Listing Sortable Course Modules
-
Completed lesson The Tag Selector
-
Completed lesson Showing A Course's Details
-
Completed lesson Deleting Courses
-
Completed lesson Editing & Updating Courses
-
Commented on post Creating A New Course
Hello,
With
useTemplateRef
, I’m encountering type errors with TypeScript because the component is of typeunknown
. I also believe this issue is caused byunplugin-vue-components
. All auto-imported components are of typeunknown
, and VSCode doesn’t provide IntelliSense for these components (e.g., their attributes). However, if I manually import the components, everything works fine. Is there a solution to fix this? -
Completed lesson Creating A New Course
-
Completed lesson Querying & Listing An Organization's Courses
-
Completed lesson Replicating Behaviors for Access Levels & Statuses
-
Completed lesson Creating A Reusable Sorting Vue Component
-
Completed lesson Sorting Difficulties with Drag & Drop
-
Completed lesson Reusable VineJS Exists In Organization Validation
-
Completed lesson Replacing A Course's Deleted Difficulty
-
Completed lesson Confirming & Deleting Difficulties
-
Completed lesson Updating Difficulties
-
Completed lesson Listing & Creating Difficulties
-
Completed lesson The Confirm Delete Dialog & Deleting the Active Organization
-
Completed lesson Editing the Active Organization
-
Completed lesson Creating A UseResourceActions Composable
-
Completed lesson Switching Between Organizations
-
Completed lesson The Form Dialog Component & Adding Organizations
-
Completed lesson Setting & Loading the User's Active Organization
-
Completed lesson New Unique & Exist Validation Overloads in AdonisJS 6
-
Completed lesson Forgot Password & Password Reset
-
Completed lesson Adding the Remember Me Token
-
Completed lesson Logging In Users & Displaying Exceptions
-
Completed lesson Onboarding Newly Registered Users
-
Completed lesson Logging Out Users
-
Replied to Are you using NPM directly within Powershell? Powershell reserved...
Thank you for taking the time to explain this to me, it's much clearer now. 👌
-
Replied to I'm so sorry, my head was in the wrong spot! You're absolutely...
No problem at all. Thank you for your response.😊
-
Upvoted comment Yes, thank you for sharing!! Once completed, we'll be adding...
-
Upvoted comment Yeah, those seem to be the areas most struggle with on APIs ...
-
Completed lesson Splitting Our Routes Between Auth & Web
-
Completed lesson User Registration with InertiaJS
-
Completed lesson Creating A Toast Message Manager
-
Completed lesson Completing Our AppLayout & Navigation Bar
-
Commented on post Typing Lucid Models in Inertia with DTOs
I don't know why, if it's just me or Windows, but I'm getting an error when installing the package. For those encountering the same issue, you need to add quotes.
node ace add '@adocasts.com/dto'
Copied!This whole DTO thing seems tedious, especially if we had to write everything by hand. Thankfully, your package exists. But is there a better way to handle this in the future, or is it a technical constraint that forces us to do like this? By the way, I think it must be the same issue with an API, right?
-
Completed lesson Typing Lucid Models in Inertia with DTOs
-
Replied to Thank you for watching, gribbl! I'm ecstatic to hear you learned...
I hadn’t seen the schedule page. Nice !
The idea of an API is great. I have trouble understanding how an API and a frontend app communicate with each other, especially how to properly handle authentication. 😆
-
Replied to Sorry for the delayed response! Are you able to share the repo...
No problemo.
That's strange. I have the exact same code as you. But just to confirm, if I understood correctly (and correct me if I'm wrong), when we save a movie's poster, we use the following lines in the movie service:
await poster.move(app.makePath('storage/posters'), { name: fileName, }) return `/storage/posters/${fileName}`
Copied!So, the file is saved at
storage/posters
, and in the database,poster_url
will have the value/storage/posters/filename.png
.And when we want to delete the poster, we do this:
await unlink(app.makePath('storage', movie.posterUrl))
Copied!So, the generated path will contain
storage
twice. As a result, since no file is located instorage/storage/posters
, the deletion will not work. Right? Or did I misunderstand? -
Completed lesson Seeding Our Initial Database Data
-
Completed lesson Creating A Lucid Model Mixin for our Organization Relationship
-
Completed lesson Defining Our Lucid Models & Relationships
-
Completed lesson Defining Our Migrations & Foreign Keys
-
Completed lesson Understanding Our Database Schema
-
Completed lesson What Are Some of Inertia's Limitations
-
Commented on post Creating A FormInput Vue Component
Hello. I believe that with recent versions of Vue, it is possible to handle things more easily.
The recommended approach to implement two-way binding on a component with
v-model
is to use thedefineModel()
macro.const model = defineModel() <Input v-model="model" />
Copied!Prop destructuring is now supported and allows to declare default values.
const { type = 'text' } = defineProps<{...}>()
Copied!Lastly, there is a shorthand for attribute bindings with same name.
<Input :type :disabled :required />
Copied! -
Completed lesson Cross-Site Request Forgery (CSRF) Protection in InertiaJS
-
Commented on post The useForm Helper
Hi! Just wanted to share that a new update for
@adonisjs/inertia
has been released. You no longer need to declareerrors
in the Inertia config, and errors are now returned as a single string instead of an array of strings. -
Completed lesson Creating A FormInput Vue Component
-
Completed lesson Common useForm Methods & Options
-
Completed lesson The useForm Helper
-
Completed lesson Form Validation & Displaying Errors
-
Completed lesson Model Query Builder Macros in AdonisJS 6
-
Completed lesson Inertia Form Basics
-
Completed lesson What Code Can & Can't Be Shared Between AdonisJS & Inertia
-
Completed lesson Specifying Page Titles & Meta Tags
-
Completed lesson Default Layouts & Overwriting the Default Layout
-
Completed lesson Creating A Layout
-
Completed lesson Partial and Lazy Data Loading and Evaluation
-
Completed lesson Global Components and Hydration Mismatch in Action
-
Completed lesson The Link Component and Programmatic Linking
-
Completed lesson Linking Between Pages & Page State Flow
-
Completed lesson Sharing Data from AdonisJS to Vue via Inertia
-
Completed lesson The Flow of Pages and Page Props
-
Commented on post Setting Up TailwindCSS, Shadcn-Vue, and Automatic Component Imports
The Vue ecosystem is fantastic. I’ve also set up Prettier with the following plugins:
prettier-plugin-tailwindcss
prettier-plugin-organize-attributes
prettier-plugin-organize-imports
This setup ensures consistent code formatting while keeping Tailwind classes, attributes, and imports perfectly organized.
-
Completed lesson Setting Up TailwindCSS, Shadcn-Vue, and Automatic Component Imports
-
Completed lesson Server-Side Rendering (SSR) vs Client-Side Rendering (CSR)
-
Completed lesson Creating Our AdonisJS App With InertiaJS
-
Completed lesson What We'll Be Building
-
Completed lesson What Is InertiaJS?
-
Commented on post Thank You for Watching!
Thank you for this course. I’ve learned so much, but there’s still so much more to learn. Next time, I’ll start the series on Inertia.
By the way, out of curiosity, how did you discover AdonisJS? I hope you’ll continue teaching AdonisJS. I absolutely love this framework. 😍
What do you have planned for 2025? Complete e-commerce website with Stripe, all the way to deployment, would be amazing. 😊
Happy New Year 🥳
-
Commented on post Managed Transactions and Syncing Movie Cast Members
Hello,
I'm going to bother you again. 😆 I think there’s still an issue, especially when you add or remove the same person since they share the same
cineast_id
. I believe we should generate a unique ID, using something likeMath.random()
as a quick solution, to avoid relying oncineast_id
. -
Upvoted comment Hi Gribbl!If you're able to directly access the file via the...
-
Replied to Hi Gribbl!If you're able to directly access the file via the...
I don’t have a
public
directory, onlystorage
at the root of the project.The line
router.get('/storage/*', [StorageController, 'show']).as('storage.show')
is commented, and I can still access my downloaded files in that directory. 🤔And for file deletion, it seems like the
makePath
method generates the following path:.../storage/storage/posters/filename.png
sinceposterUrl
also contains/posters
. So, I usedapp.makePath('.', movie.posterUrl)
instead, and it works. 😁 -
Completed lesson Thank You for Watching!
-
Completed lesson Allowing Admins to Delete Movies and their Relationships
-
Completed lesson Managed Transactions and Syncing Movie Cast Members
-
Commented on post Using A Wildcard Route Param to Download Storage Images
Hello,
When I try to access uploaded file, for example
/storage/avatars/filename.png
, without a route or controller, the file displays just fine. TheStorageController
isn’t called.Finally, I get this error when I try to delete a movie’s poster :
'ENOENT: no such file or directory, unlink'
, I think the error comes from this line:'await unlink(app.makePath('storage', movie.posterUrl))'
. The generated path seems to be incorrect.But I don’t understand why it seems to work for you.
-
Completed lesson Posting Objects, Arrays, and an Array of Objects in HTML Forms
-
Completed lesson Using A Wildcard Route Param to Download Storage Images
-
Completed lesson Uploading Movie Cover Images in our Create or Edit Form
-
Completed lesson How To Use One Form to Create or Edit Movies
-
Completed lesson Allowing Admins to Update Movies and Clear Values
-
Completed lesson Allowing Admins to Create Movies
-
Completed lesson Paginated Admin Movie Table
-
Completed lesson Counting Stats for our Admin Dashboard
-
Completed lesson Creating An Admin Layout
-
Completed lesson Filtering, Preloading, and Sorting By Relationship
-
Completed lesson Displaying A User's Profile
-
Completed lesson Uploading and Displaying User Avatars
-
Completed lesson Saving All Or Nothing with Database Transactions
-
Completed lesson Using Dependency Injection to Update A User's Profile
-
Completed lesson How to Create and Fix Missing User Profiles in Your Application
-
Completed lesson Persist Filters Easily with Lucid's Query String Method
-
Completed lesson Defining A Composite Unique Constraint
-
Completed lesson Filtering By User's Watched Status
-
Completed lesson Allowing Users To Toggle A Movie As Watched
-
Completed lesson Listing and Filtering User Watchlist Items
-
Completed lesson Toggling A Movie in an Authenticated User's Watchlist
-
Completed lesson An Alternative Approach to Many-To-Many Relationships
-
Completed lesson Pagination First, Last, Next, and Previous Buttons
-
Completed lesson How To Paginate Filtered Query Results
-
Completed lesson Validating Query String Filter Values
-
Completed lesson Joining SQL Tables To Order By A Related Column
-
Completed lesson How To Apply A Dynamic Sort Filter To Your Query
-
Completed lesson Filtering Our List by Movie Status
-
Completed lesson Filtering A Query By Pattern Likeness
-
Completed lesson Creating A Movie List Page
-
Completed lesson Protecting Routes with Auth, Guest, and Admin Middleware
-
Commented on post How To Create A Custom VineJS Validation Rule
I believe there has been an update. Now, it is possible to use
unique
directly by providing an object withtable
andcolumn
properties. It's still good to know how to create a custom validation rule. :) -
Completed lesson Remembering A User's Authenticated Session
-
Completed lesson Logging In An Existing User
-
Completed lesson Logging Out An Authenticated User
-
Completed lesson Checking For and Populating an Authenticated User
-
Completed lesson Authenticating A Newly Registered User
-
Completed lesson The Flow of Middleware
-
Completed lesson How To Create A Custom VineJS Validation Rule
-
Completed lesson Creating A Login Form and Validator
-
Completed lesson Creating An EdgeJS Form Input Component
-
Completed lesson Listing and Counting a Writer's Movies
-
Completed lesson Listing A Director's Movies with Relationship Existence Queries
-
Completed lesson Seeding Movies with One to Many Model Factory Relationships
-
Completed lesson Defining One to Many Relationships with Lucid Models
-
Completed lesson Cascading and Deleting Model Relationships
-
Completed lesson Querying Relationships and Eager Vs Lazy Loading
-
Completed lesson Model Factory Relationships
-
Completed lesson Defining One to One Relationships Within Lucid Models
-
Completed lesson Generating A Unique Movie Slug With Model Hooks
-
Completed lesson Querying Recently Released and Coming Soon Movies
-
Completed lesson Tapping into Model Factory States
-
Completed lesson Reusable Query Statements with Model Query Scopes
-
Completed lesson SQL Parameters and Injection Protection
-
Completed lesson Querying Our Movies with the Query Builder
-
Completed lesson Stubbing Fake Data with Model Factories
-
Completed lesson Defining Required Data with Seeders
-
Completed lesson The Basics of CRUD
-
Completed lesson Defining Our Models
-
Completed lesson Introducing Lucid Models
-
Completed lesson The Flow of Migrations
-
Completed lesson Introducing and Defining Database Migrations
-
Completed lesson Understanding our Database Schema
-
Completed lesson Configuring Lucid and our Database Connection
-
Completed lesson Easy SVG Icons with Edge Iconify
-
Completed lesson HTTP Method Spoofing HTML Forms
-
Completed lesson Form Basics and CSRF Protection
-
Completed lesson Share vs Global Data Flow
-
Completed lesson State vs Share Data Flow
-
Completed lesson Extracting A Layout Component
-
Completed lesson Use Slots To Make A Button Component
-
Completed lesson Component Tags, State, and Props
-
Completed lesson Making A Reusable Movie Card Component
-
Completed lesson HTML Attribute and Class Utilities
-
Completed lesson EdgeJS Templating Basics
-
Completed lesson Easy Imports with NodeJS Subpath Imports
-
Completed lesson Quick Start Apps with Custom Starter Kits
-
Completed lesson Deleting Items and Flushing our Redis Cache
-
Completed lesson Improved Caching with Redis
-
Completed lesson Environment Variables and their Validation
-
Completed lesson Singleton Services and the Idea of Caching
-
Completed lesson Defining A Structure for our Movie using Models
-
Completed lesson Cleaning Up Routes with Controllers
-
Completed lesson Extracting Reusable Code with Services
-
Completed lesson Listing Movies from their Markdown Files
-
Completed lesson Reading and Supporting Markdown Content
-
Completed lesson Setting Up Tailwind CSS
-
Completed lesson Vite and Our Assets
-
Completed lesson Validating Route Parameters
-
Completed lesson Loading A Movie Using Route Parameters
-
Completed lesson Linking Between Routes
-
Completed lesson Rendering a View for a Route
-
Completed lesson Routes and How To Create Them
-
Completed lesson VS Code Extensions and Configuration
-
Completed lesson Project Structure
-
Completed lesson Creating A New AdonisJS 6 Project
-
Completed lesson What We'll Need Before We Begin
-
Completed lesson Introducing AdonisJS
-
Completed lesson Reusing Old Form Values After A Validation Error
-
Completed lesson Displaying Validation Errors and Validating from our Request
-
Completed lesson Validating Form Data with VineJS
-
Completed lesson Accepting Form Data
-
Completed lesson How To Query, Sort, and Filter by Pivot Table Data
-
Completed lesson How To Create Factory Relationships from a Pool of Data
-
Completed lesson A Deep Dive Into Relationship CRUD with Models
-
Completed lesson Many-To-Many Model Factory Relationships
-
Completed lesson Defining Many-To-Many Relationships and Pivot Columns
-
Completed lesson Using Eager and Lazy Loading to Load A Movie's Writer and Director
-
Completed lesson Adding A Profile Model, Migration, Factory, and Controller
-
Completed lesson Altering Tables with Migrations
-
Completed lesson Unmapped and Computed Model Properties
-
Account created Welcome to Adocasts, @gribbl!