Use TypeScript to Build a Node API with Express

teoman shipahi

Amazing content and walkthrough, works flawlessly thanks!

dhantoot

nice, clear and flawless.

Adnan Murtaza

I found this tutorial a bit broken, the github version includes “src/types/*” inside “compileroptions” in tsconfig.json but its not present in the post.
Below link is the solution if anyone encounter the error of "cannot find the declaration file for module ‘@okta/oidc-middleware’"

https://github.com/Microsof…

Adnan Murtaza

Thanks it works.

Nathan Brenner

npm run initdb results in
<br>{ Error: connect ECONNREFUSED 127.0.0.1:5452<br> at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1191:14)<br> errno: 'ECONNREFUSED',<br> code: 'ECONNREFUSED',<br> syscall: 'connect',<br> address: '127.0.0.1',<br> port: 5452 }<br>finished with errors<br>

I have postgres installed locally (on a mac), and I tried different ports on the docker run with the port argument a few different ways.

What am I missing?

ZpeedTube

For any future user that is confused about {yourOktaDomain} in the config file
# Okta configuration
OKTA_ORG_URL=https://{yourOktaDomain}
OKTA_CLIENT_ID={yourClientId}
OKTA_CLIENT_SECRET={yourClientSecret}

Should be like this OKTA_ORG_URL=https://dev-012345.okta.com just replace the 012345 with the number you see in url when you are logged in on the okta Dashboard.

EDIT:
Forgot to mention it was this Error: Unknown authentication strategy “oidc” that I got because I did not have the OKTA_ORG_URL correctly.

Alexander Robert Novotny

Hi! I really enjoyed this tutorial. I had a question about using a custom version of the materialize css. I downloaded their SASS directory. Made changes. Created a new CSS file. Added that to my src directory, along with their js file. I changed the link in the ejs files’ headers. But I can’t get the site to show the new styles. After I remove the link to the cloudflare version, css as a whole stops working. What am I missing?! :slight_smile: I attached a photo of my file structure and one of the ejs files. The reason I am doing this is so I can set a site primary color. In your example, the header bar is red while all the buttons are teal. Rather than updating a color in line everywhere I wanted to update it everywhere all at once. https://uploads.disquscdn.c… https://uploads.disquscdn.c…

Matt Raible

Hello Alexander,

You might try asking this question on Stack Overflow with the materialize tag. That way, it’ll get more eyeballs on it.

Alexander Robert Novotny

I totally just figured it out! You have to have other js and css files inside the public folder. At least that did the trick. Haha. Thanks!

Matt Raible

That’s fantastic! Thanks for contributing your knowledge back to this post.

hasparus

I’m not sure if using so much : any in a tutorial isn’t hurtful to the readers. You end up in search results for “express typescript” (due to ads).

Richard Collette

Maybe by now Okta should be publishing the typescript types for the middleware. It’s not a huge SDK.

Arxip Dulicov

Thanks! Do you know what type app (const app = express())
i need this in code:

function Router(app: any) {
app.use(${host}/auth, authRoutes);
}

Arxip Dulicov

Sorry, already find it’s – Application

Benjamin Pitts

Hello, just wanted to leave a comment:

this style of including EJS files is deprecated:
<% include partials/nav %>
In favor of
<%- include(‘partials/nav.ejs’, {user: user}) %>
according to official documentation here

zazzles

I followed along until adding the src/views/partials/nav.ejs file. I tried different variations of

<% include partials/nav %>
<%- include(“partials/nav”) %>

<%- include("./partials/nav", {user: user}) %>

per other comments, but they all cause an error, “user is not defined”. I tried okta-middleware 1.0.2 and 2.0.0.

ReferenceError: /home/zazzles/okto/dist/views/index.ejs:12
10| </head>
11| <body>
>> 12| <%- include(“partials/nav”) %>
13| <div class=“container”>
14| <h1 class=“header”>Guitar Inventory</h1>
15| arrow_forwardGet started!

/home/zazzles/okto/dist/views/partials/nav.ejs:3
1| <nav>
2| <div class=“nav-wrapper”>
>> 3| <% if ( user ) { %><%= user.name %>'s <% } %>Guitar Inventory
4| <ul id=“nav-mobile” class=“right hide-on-med-and-down”>
5| <li>My Guitars</li>
6| <% if ( isAuthenticated ) { %>

user is not defined
at eval (/home/zazzles/okto/dist/views/partials/nav.ejs:12:8)
at nav (/home/zazzles/okto/node_modules/ejs/lib/ejs.js:691:17)
at include (/home/zazzles/okto/node_modules/ejs/lib/ejs.js:689:39)
at eval (/home/zazzles/okto/dist/views/index.ejs:12:17)
at index (/home/zazzles/okto/node_modules/ejs/lib/ejs.js:691:17)
at tryHandleCache (/home/zazzles/okto/node_modules/ejs/lib/ejs.js:272:36)
at View.exports.renderFile [as engine] (/home/zazzles/okto/node_modules/ejs/lib/ejs.js:489:10)
at View.render (/home/zazzles/okto/node_modules/express/lib/view.js:135:8)
at tryRender (/home/zazzles/okto/node_modules/express/lib/application.js:640:10)
at Function.render (/home/zazzles/okto/node_modules/express/lib/application.js:592:3)

zazzles

It happens that the version of ejs used in this tutorial is “^2.6.1” where I was using “^3.1.5”. It works fine when I specify the former version.

Rodolfo Davis

Express.JS development services are required to layer fundamental structure and features that are needed to build an app since Node.JS does not offer such capability.

dusanbass

This dosen’t work for me:
Invalid option for configuration: tslint.json and I dont know how to move on.
Windows 10

Matt Raible

Can you please try cloning the example from GitHub and using the README to set things up? https://github.com/oktadev/…