EdgeJS Templating Basics

In this lesson, we'll learn the basics of AdonisJS's homegrown template engine EdgeJS. We'll cover interpolation, conditional statements, looping, variables, state, and more!

Published
Feb 10
Duration
8m 49s

Developer, dog lover, and burrito eater. Currently teaching AdonisJS, a fully featured NodeJS framework, and running Adocasts where I post new lessons weekly. Professionally, I work with JavaScript, .Net C#, and SQL Server.

Adocasts

Burlington, KY

Join The Discussion! (11 Comments)

Please sign in or sign up for free to join in on the dicussion.

  1. Commented 3 months ago

    Hi, I am getting the Cannot lookup rote Edge error when I try to use an edge template with the route() helper in it.

          Error: Cannot lookup route "moms.join"
              at anonymous (D:\www\seeds\resources\views\moms\pages\home.edge:95:0)
    <a class='button' href="{{ route('moms.join') }}">

    That route shows up in list:routes:
    GET /join (moms.join) .................................................. #controllers/join_controller.join

    What am I doing wrong? Please let me know what additional information is needed.

    Thank you.

    0

    Please sign in or sign up for free to reply

    1. Commented 3 months ago

      I should probably add that the 'moms' at the start of that route name is for a domain:

      router
        .group(() => {
          router.get('/join', [JoinController, 'join']).as('join')
        })
        .domain('moms.test')
        .as('moms')
      
      1

      Please sign in or sign up for free to reply

      1. Commented 3 months ago

        I haven't yet worked with subdomains in AdonisJS 6, but I believe they work the same as in v5. When building the route's url using the route() method, the third argument accepts the domain.

        <a href="{{ route('moms.join', {}, { domain: 'moms.test' }) }}">
          My Link
        </a>
        Copied!

        The subdomain behavior is siloed, so you can have the same route defined outside the subdomain as well, and they can also be dynamic. Due to these reasons, that's why the domain will need specified when you're specifically looking to build a route for that domain.

        Hope this helps!

        0

        Please sign in or sign up for free to reply

        1. Commented 3 months ago

          Wow thanks. I did not get that from the documentation anywhere. Hey, question: Do you know of any full-featured V6 example site on Github? It would be soooo helpful to see a full example of all this stuff, service providers, the container, everything.

          0

          Please sign in or sign up for free to reply

          1. Commented 3 months ago

            Anytime!! This site is public on GitHub and uses AdonisJS 6
            https://github.com/adocasts/adocasts

            Beyond that, I'm not aware of any that are currently public.

            1

            Please sign in or sign up for free to reply

        2. Commented 3 months ago

          So this still is not working. I tried it just like that, console.log confirmed it, and it still says it "cannot look up" the route.

          How can I recreate the route outside of an Edge template? I don't see a helper for that. Laravel had a route helper you could use anywhere in the app to craft a url string. If I had that I could just craft the string in the service and feed it into Edge. Failing that, I will just have to manually create the URL strings. I can, but for all the reasons you know, would rather not.

          Thanks for all your help.

          0

          Please sign in or sign up for free to reply

          1. Commented 3 months ago

            I just pushed up a working example of subdomain usage you can find at the link below. If you're linking into your subdomain, you'll want to prefix the generated url with your subdomain and include the port if you're local.
            https://github.com/adocasts/lets-learn-adonisjs-6/blob/subdomain_example

            The specific files of interest here are the route definition and the url generation inside of EdgeJS. Within the route definition I also added examples for both the URL builder and the makeUrl method AdonisJS provides. The route method inside EdgeJS is the same as the router.makeUrl method, so the arguments should match 1:1. Apologies, my formatter went a little extreme with the makeUrl usage lol.

            Hope this helps!! :)

            0

            Please sign in or sign up for free to reply

            1. Commented 3 months ago

              Thanks, I will check it out. I thought I had found the answer (I found "URL Builder" in the docs) but it still won't look up the routes inside Edge. And one clarification: I'm not doing subdomains, I'm doing different domains. It works fine on the routing end - everything routes correctly - but it's just inside Edge that it won't work. I will look at what you did and can probably kitbash it to my usage. I really appreciate all your time. You're a mensch.

              Just FYI, this is how I generate the routes in my routes.ts file:

              for (let site in Sites) {
               router
                .group(() => {
                  router.get('/welcome/:tab?', [WelcomeController, 'welcome']).as('welcome')
                  router.get('/join', [JoinController, 'join']).as('join')
                  router.get('/upgrade', [JoinController, 'upgrade']).as('upgrade')
                  router.resource('users', UsersController).as('users')
                })
                .domain(Sites[site].domain)
                .as(site)
              }
              
              0

              Please sign in or sign up for free to reply

              1. Commented 3 months ago

                Ah - gotcha, so you're using one server to serve multiple sites? If the routes are shared by all site, then you could most likely omit the .domain() usage as that essentially just namespaces the routes.

                Anytime! Hope you were able to get things working! :)

                0

                Please sign in or sign up for free to reply

                1. Commented 3 months ago

                  The URL builder in Adonis works fine, so I generate the route strings in my publish service and put the strings in the Edge template. Works great. Thanks!

                  0

                  Please sign in or sign up for free to reply

                  1. Commented 3 months ago

                    Oh good, happy to hear you got everything working! :)

                    0

                    Please sign in or sign up for free to reply