Build a Basic CRUD App with Vue.js and Node

Randall Degges

This sounds like you haven’t setup the S3 bucket right. The nouschkey means the file being requested isn’t being found.

What AWS CLI commands are you using to sync the filles into your bucket?

Kyle Hatch

So i downloaded aws-cli, and am just using regular command line, is that right? and i’m using

aws s3 sync ./dist s3://your-bucket-name with my bucket name.

Yijie Xie

Is it possible to get Organisation and Group info from user, then use epilogue middleware to implement access control on Post? It will be nice to see an example.

Randall Degges

You’ll want to do:

aws s3 sync dist/ s3://your-bucket-name --acl public-read --delete

You’ll also need to configure your S3 bucket to be a website. This guide will show you how to configure the bucket: https://docs.aws.amazon.com…

Kyle Hatch

Alright I got it to work, the okta login gives a 404, saying it’s trying to redirect to localhost, so that’s what im working on now.

Randall Degges

Cool! Go through the Okta tutorial and make sure all the necessary URIs are updated in your app, trusted origins, etc. Then you should be good to go.

Kyle Hatch

I guess i’m just confused on what the Login redirect URIs and the Initiate login URI should be, i think i have everything else set.

I’ll just link my github so you can look at it if you want.
https://github.com/Relofr/t…

Doug Richar

I’m new to building APIs and setting one up in Laravel (my first attempt) seemed like way overkill for a simple web app. I had this up and running in less than an hour. Thank you thank you thank you.

Rich

Great tutorial! What would be the best way to go about handling user roles? What if I wanted to restrict what pages a user could access or whether they could create or update data based on their role?

For instance: what if I wanted to allow only certain users to create and update posts in PostsManager? Do I have to set this up myself or is there an okta api that I could use? Are there any other guides that cover this?

Thanks in advance!

Pines

This is a great tutorial !!! espcially for people as new as me in FE development. I have a quesiton though. When I close the browser/tab and when I open again the page it redirects me to the ‘/’ instead of the enpoint I created that is accessible for all signed-up users.
What I didi with your code was get rid of Home and post-manager endpoints and only have a home page which is the one anyone can see and when clicking the login you go to the particular endpoint:

<b-navbar-nav>
<b-nav-item to="/access/request" @click.prevent=“login” v-if="!activeUser">

Login

</b-nav-item>
<b-nav-item href="#" @click.prevent=“logout” v-else="">Logout</b-nav-item>
</b-navbar-nav>

I have been looking for some time now a way to make it work but I haven’t been able to do so. Do you have any idea on suggestion for this to work?

Seorang Kapiten

simple trigger the login

Seorang Kapiten

you should set the roles first in database, if you want more flexibility then make a table that had reference per menu

T Mst

What if I want to develop an app with multiple related content types (posts, subjects, etc) and want to manage each in a separate tab in a SPA? Seems like a lot of code to duplicate. Since the front and back ends are both running Javascript, shouldn’t it be relatively straightforward to create both from a set of model definitions?

T Mst

Posts has only text fields. What if radio and select fields are added? Will it require an in-depth understanding of Vuejs to add them? How would the list of select tag <option>s be dynamically added to the front end based on fields on the back end model?

Matt Raible

If you add those type of fields, they’ll still be text values when you send them back to your server. For showing them on your UI, you can use arrays of text values. Showing this type of functionality is beyond the scope of this tutorial.

I’d recommend looking at Vue’s documentation for more information. https://vuejs.org/v2/guide/…

Matt Raible

Sounds like a reasonable assumption. Let us know if you figure out a way to do it. Better yet, write a blog post about it! I’d be happy to help you promote it.

You could also use JHipster and its Vue support (still in alpha) and generate everything (front and backend) from a single JDL file. https://github.com/jhipster…

Mika Kaakinen

The tutorial seems very good but I might have a different view on Angular and React.

Steven Woolston

That is an outstanding article. Well done!

CarbonTeq

Hi T Mst,
You should check this related to your query might be helpful for you!
https://blog.carbonteq.com/…

Manuel

Hey Jone, how did you install them separated, like which parts did you separate? I keep on getting tons of errors as well when trying to do this just like your errors.