[TODO] TODO (See TODO.md)

[gbowne1]

Need to add a logger.

app.use(logger); as a middleware function to add logging to the NodeJS and ExpressJS sever and application. morgan is already installed on the serverso we will use that as a logger.

I also installed helmet. This is a middleware tool to help protect our server from some well-known web vulnerabilities by setting HTTP response headers appropriately. It comes with a collection of several middleware functions that set security headers returned from our Express application

[jzunigarce]

I can help you

[gbowne1]

Ok @jzunigarce

[jzunigarce]

Did the middleware implementations work for you?

[gbowne1]

Havent tested yet. Everything I've read says this is the way to go and we are still getting stuff set up.

Have you tried?

[gbowne1]

I did manage to fix the login.html which works fine. If you load login.html through a preview it works now. I also added the missing .js files called out in the body of the login.html but they are kinda incomplete.

[jzunigarce]

I've been doing some basic tests and everything works fine, I returned some responses from the routes

[gbowne1]

Cool. Yeah, I was able to see routes too. We will have to send cors headers in the routes too. I have the code we will need for that.. the browser will go nuts in console.

In the old project the login page (now login.htm) loaded at / till you logged in and or registered. At which point it would go as a redirect to either profile or dashboard, but some routes failed. Just depended on a few things.

Im going to add the components pages in public for each of the routes tomorrow.

[jzunigarce]

Will you use jwt token or sessions for authentication?

[gbowne1]

We have both options available. I am ok with either option. I would like to leverage both the server and the browser.

I prefer jwt. Its already installed, so is cookie and body parser and axios (axios to both sides if you noticed.)

We can send both cookies and tokens.

We arent using external auth like google to log in.

External APIs like from radioreference.com might need some auth too and in fact that API need its own token.

We are bringing in a bunch of external APIs depending on where you are in the app.

[gbowne1]

Added a pile of more stuff today. @jzunigarce including all of the HTML pages in the /src/client/public

I worked on getting the res.send's in the routes for the pages for a few of the items.

Now just gotta get a bunch of stuff wired up.

[jzunigarce]

Can I separate the routes in another folder?

[gbowne1]

yeah you can. @jzunigarce

something like?

└── src
    ├── client
    │   ├── css
    │   ├── js
    │   └── index.html
    └── server
        ├── routes
        │   ├── index.js
        │   └── users.js
        └── server.js

Then I guess you could:

const indexRoutes = require('./routes/index'); const userRoutes = require('./routes/users');

app.use('/', indexRoutes); app.use('/users', userRoutes);

or whatever... just let me push up a couple changes I flubbed on today.

[gbowne1]

You should save server logs into /src/server/logs.. that needs wired up too. .gitignore is set to ignore them. for obv reasons. but theres a couple packages we have now for logging.

[jzunigarce]

@gbowne1 What routes will you implement and what methods (post, get, put, delete, etc)?

[gbowne1]

Lets start with get and post. As we wire up the app, we can decide.

My inital goal is getting the dashboard and login and signup all wired in everywhere, server, routes, db, auth, etc.. etc..

I put in the routes in server.js that I had in my old project

[gbowne1]

I think we might also need const http = require('http'); at some point.

[jzunigarce]

What will you do with the http module?

[gbowne1]

not sure. Just a thought. We are already doing a lot of things with the server at this point. I dont know if it will solve any particular issues.

Can you have a look through the PR? Would you like to be added as a collaborator?

[jzunigarce]

For now I consider that it will not be necessary to use it, since we are using express. Of course I would like to be a collaborator. I will upload a PR, although it still has a detail with the external images, CSP details. I will work to correct it.

[gbowne1]

Merged, btw. Yeah it probabky wont be needed.. just know its there.

We still need logging, etc. Nodemon logs are ok.. but not terribly granular.

I still get 505 in Nodemon. when I have a React app I am working on run on 3000 at times. It really should ask you if you want the next available port if somethings already on 3000.

I think a backend start script might help out too.

[jzunigarce]

We can use docker or I can set the .env to set the PORT of the server

[jzunigarce]

Can you delete the issues that have already been resolved to avoid accumulation?

[gbowne1]

Yeah am working on doing that some atm.

We can move some to discussion that need further clarification, etc.

Dockerization might help. I was going to wait for that.

There is a port set in .env already. Its 3000. But its not forwarding to a new port if theres already one in use. React dev server does that. You just push y or type yes and enter and it goes to 3001 or whatever is next.

[gbowne1]

I was reading that you could set bin/www but it requires http.

[gbowne1]

Users will get their own user profile too.

We can use app.js I created on both sides to run as a controller.. one does DOM stuff on the client. The other app.js acts as a engine on top of express, node and the db.

I added more of the json data.

We still have at least one external API to consume and will likely provide our own. FCC lisence records to help with records in the DB. You type in a callsign and it could auto populate some fields??

[gbowne1]

Re-naming this issue as a [TODO] TODO, but expect a TODO.md file with actual TODOs to avoid 'Issues' collecting issues..

[gbowne1]

TODO.md pushed. If you have VSCode and a TODO tracker extension it should pick up the file.

[gbowne1]

This page:

which loads at: /

Ideally should be a splash/cover page (/src/client/public/index.html) called by either the server side app.js by linking the app.js && index.js in the html. The app.js will have DOM stuff built as a controller. It would have a button, page spinner or load progress indicator, photo and an app title. The very next page you would see is the /login which loads login.html. The next page would be /dashboard.

[gbowne1]

I tested login, register, reset password with some typical credentials.. it's not really working. :-1: :disappointed:

[jzunigarce]

We need fix all routes, Do you think that I work with the refactoring of the routes?

[gbowne1]

fine with me.

[jzunigarce]

We need define a route for "/", we currently do not have a defined route

[gbowne1]

Yep. The page would the one at /src/client/public/index.html in the tree.

[gbowne1]

An example of what I had in mind for the off canvas drawer.

[gbowne1]

@jzunigarce I fixed up the page that loads at localhost:3000 or / it needs an image, etc. but should be good

This is what you should see when the app loads. The next page should be /login then /dashboard then possibly /profile if the user has not created one.

You should be able to get to /login by clicking on the button unless there is a better idea. Ideally it should have some loader spinner, progress bar, etc.

[gbowne1]

What I noticed now is that the login doesn't work. Didn't seem to work before now but perhaps some more stuff needs wired up. So, entering creds like testuser@example.com and a hashable password and clicking Login doesn't progress the login to the next stage.

[gbowne1]

New screen for root /

[jzunigarce]

After logging, which page should i go to?

[jzunigarce]

Today i work login in backend

[gbowne1]

/dashboard should totally be the next page in the process. But, ideally if the user is not a returning user, should go to a profile creating page. If a returning user should be just /dasbhoard.

[gbowne1]

I got some work done on a profile page.. Might get some of that done.

[gbowne1]

Pushed up the initial work for the profile. Both the index.html and profile need some work. There are some errors in console, but otherwise work. Now just needs routes, more CSS work, etc.

[gbowne1]

I wasnt sure where to put the button on the index.html.

[jzunigarce]

Are you have a mockup of project?

[gbowne1]

No, I do not have a mockup. I have screenshots of various iterations I tried out.

[gbowne1]

I think we already have about 90-95% of what will be needed just need cleaned up a bit and actually working.

Including the HTML pages, CSS.. cleaning up and debugging the js.. etc. Traditionally I have not needed mockups anyhow.. especially in community driven development. Typically people come up with much better designs than I do.

[gbowne1]

using the signUp.js I did get this message in console.. maybe it partially works??

User registered: Object { username: "testuser", email: "testuser1@example.com", password: "Testpass1!" }

[gbowne1]

yeah. I am getting a Uncaught ReferenceError: checkpass is not defined error from formEvents.js though. (also while still navigated to /signin.. but using the signup function)

[gbowne1]

@jzunigarce I am gonna work on the dashboard a bit today.

The click event listener on the index.html isnt working

Ive been trying random things on dashboard.html to get the cards in two rows of 4 or 5 cards. I think it needs a row/col setup in Bootstrap.

Let me know if there are any TODOs in the TODO.md you think we should open up issues for.

[jzunigarce]

Have you tried using css grid?