FREELessons: 12Length: 1.5 hours

Next lesson playing in 5 seconds

  • Overview
  • Transcript

1.4 Project Organization and Custom Plugins

Before we spend any more time writing code, let's organize our project to save us from headaches later on. We'll also write our own Hapi.js plugin to help compartmentalize our code.

1.4 Project Organization and Custom Plugins

Before our project gets too big I want to go ahead and organize it so that it's easier to work with and it's easier to find things because we've already had just a couple of lessons and we're already at 33 lines of code and it's only Only going to get worse. So it makes sense to go ahead and organize our project now. And if you look at other projects something's you will find is, of course, the public folder which we have, but then you would find a folder that would contain All of the code for the server application. And that is usually called a source folder. Although you might find it being called something else, but usually it's source. And we're going to put all of our Applications source code in here now this means that we are going to change our JS in fact we are going to get rid of all these code so that this would just be a couple of lines and this is what I would want this file to look like we would require A file from our source we can call it server. It doesn't necessarily need to be the happy server instance, but this could be an object that represents our server application. And then we would just call a method Method called start, and we would be off and running. So let's do that. Let's create a file inside of source. We'll call it server.js, and let's paste in this code. Now, what we already have, it's not a method, but it's a function called start that we are calling at the end of this file. Now, we don't need to do that here because that's going to be done Inside of the new FJS file so what we could do is just something as simple as this we would have module exports and we will export an object that has a method simply called start and that will be A very easy change and we're good to go there. So we could just check to see and make sure that our application is building. It is. We can make sure that the behavior is the same. Looks like it is. So all is good there. But I don't want to stop here because we still have 33 lines of code. And the bulk really is setting up our routes here so it would be nice to break out a separate file. So let's do that. Let's create a new folder inside a source. And we will call it routes. And then inside of routes we'll create a file that's while I always to struggle to what to call this because. These type of routes I usually think of as the home part of the application, the root, and then any of the pages directly off of root, like about and contact and things like that. But these are also kind of default routes. These are routes that would be available and just about any typical web application so for the lack of anything better lets call it default routes, might not be the best name but that is what we are going to run with. And then we need to decide how we want to break these routes out because we could do so in a couple of different ways the first way would be to use just a normal node module, so that we can do something like this, module.exports, and we would export just the array that we have, so this would be our array of routes that we would then require. For calling the route method. So it would look something like this. We would require, we need to pull in routes and then default-routes, and that would work. I think it's at least building. And we, once again, have the same behavior. But, we could also use a happy plug in and really if you read the documentation, they really want you to use happy plug in's when it comes to organizing your application. I mean, there is no incorrect way of going about it. We can use just a normal node module or we can write a happy plug in. And let's go with the happy plug in because that will give us The practice of doing that. So we are still going to export something because this is still a node module. But now, we have a few properties that we have to define. The first is name And we'll just call it default routes and then we have a version, which well, we'll just say 1.0. But then the main thing is a method called register, so that the hapi instance can register this plug-in. And we have two arguments that are going to be passed here. The first is server. And that is the happy instance, the second is any options that we would need in order to configure this plugin. And then all we have to do then is use this server object Call route, pass in our array and we're done. So now instead of using this server route inside of our new server js file, since this is a plugin we need to register it. And we can do that by passing an array to the registrar method. So just like the route where we could pass either route or an array over route, we can pass a plugin or an array of plugins to this Register method. So that's what we will do here, we will register inert. Then we will register a route. And that will hopefully work, let's look at the command line We get no errors. So, our behavior should still be the same. Now, let's make sure that we can make requests for the other pages. I believe we had pages, and then about HT and we can see that this is the about static page. So there we go. We have started to organize our application, and we'll keep doing this, especially in the next lesson, because we're going to add a view engine to our application, so that we can start generating content and HTML.

Back to the top