Just wondering what's the clean way (if possible) to have a function that can be reused in both inertia scope and adonisjs scope. For example Enum that created at `/app/enums/…ts`, how do I make it possible so I can call it from my inertiajs scope. For now, I alway copy it twice to put under inertia just so i can use it.
Transcript
-
All right. So before we leave our basics module here, let's quickly talk about what we can and cannot share between our Adonis and client-side application view,
-
in this case, with InertiaJS. As we previously discussed, inside of our application, we have access to these reference directives.
-
These allow our InertiaView application, in this case, to be able to understand types from AdonisJS using module augmentation.
-
Module augmentation being where you dynamically add things using that. Declare module, the namespace, and then add the types in. What we cannot make use of these reference directives for is
-
dynamically inferred types or really anything added in whenever our application is run through its boot cycle.
-
Because at the point that we're in our InertiaView application here, our Adonis application is completely out of the picture. Sure, it's used whenever we do server-side rendering,
-
but we need to treat it the same as we are accessing it inside of the browser because the actual view application is still running on the client,
-
even though we're rendering it initially on the server here using SSR. Meaning that any code that we want to use that relies on our booted AdonisJS application,
-
which is the event system, HTTP contacts, dependency injection, really anything like that, the mailer, that all requires the AdonisJS application to be booted in order for it to work properly.
-
In terms of that, none of that stuff can be shared with our InertiaView application here. If however, say we go up to our app and we create a service,
-
new file, services, and we create something like a utility service, .ts, export default class utility service,
-
and we add, I'm just going to make a static, some method here where you can return working, give that a save. If we had something like this that we
-
wanted to share with our Inertia application, that would be perfectly fine. So we can jump into, say, our login page and import our utility service
-
from hash services utility service, and then we can make direct use of this inside of our template or our script as needed.
-
So if we just do hyphen utility service.some method, and we call that directly inside of our template, jump back into our browser, give that a refresh.
-
You can see that we see login hyphen working, working coming from that some method from our app services utility service class. So really the main thing to take away here is,
-
if your AdonisJS application needs to be booted in order for something to work, no, you cannot use it inside of your Inertia view application. At that point, you need to treat them as
-
two separate applications decoupled from one another, because the app on your client side is still running the browser at the end of the day, and your AdonisJS application is still run on the server.
-
Inertia is just brokering the transfer flow between those two, but it cannot share running instances between the two. I'll note this, even though we'll get to
-
it later on whenever we actually start talking about it, types for models cannot be shared directly either, because if you try to, the inference will just come through as model object,
-
and it won't actually contain any of your models columns due to the way that the models are written. Because of this, in this series, we'll be using DTOs to describe our models.
-
Of course, you could always do casting instead of DTOs, if you prefer to do that, that's where you do the variable, and then as, and then describe the type yourself.
What Code Can & Can't Be Shared Between AdonisJS & Inertia
We'll discuss what code we can and cannot share between AdonisJS and Inertia.
Join the Discussion 4 comments
-
-
Responding to nonwiz
Hi nonwiz! As we did with the service in this lesson, you can import and use enums directly inside your frontend. It'll then be bundled with the frontend code when you build it.
1-
Responding to tomgobich
-
Responding to nonwiz
-
-
-