React Vidly App Deployment

[DaniusK]

Hello,
I'm trying to deploy React Vidly App and have a problem with that. In Mosh videos he's using mlab for MongoBD data but this is no longer available. I'm using MongoDB Atlas now and following tutorials but whatever I do the application shows error. Just wonder if there is anything else we need to do to configure the custom-environment-variables.json files as I added "db": "vidly_db" as per video. Any help would be much appreciated.
Danius

[arielkotch]

Whats the error?

[arielkotch]

I got a couple of errors on was with "Bycrpt"
This should fix that npm install bcrypt@3 --save
And another was fsevents npm install -g fsevents also you could try installing brew install watchman

[DaniusK]

The error was when I was trying to connect Heroku with MongoDB Atlas. I've sorted that already and is all up and running.
I had to change the version of MDB Atlas string to earlier version and then it worked fine. Would be nice to know why though:) I guess it was something with the back-end as it was not build by me but provided with the React course.
Thanks for your reply.
Danius

[mark-quinn]

@arielkotch npm install bcrypt@3 --save fixed it for me. It could not find the bcrypt module during the initial dependency install.

[gregcompton]

@DaniusK I am also trying to complete the React course and am stuck in Lecture 9 of Deployment.

What do you mean by you "had to change the version of MDB Atlas string to earlier version"?

Upon running heroku open it seems that I am connecting to Mongo Atlas, but I get an error

[ 'MongoError: not authorized on admin to execute command { listIndexes: "users", cursor: { }, $clusterTime: { clusterTime: 6740035423914950658, signature: { hash: [236 31 24 12 51 148 8 126 22 171 160 158 122 222 178 130 35 230 199 57], keyId: 6737669609899425792.000000 } }, lsid: { id: {4 [51 14 151 138 224 82 79 87 137 183 223 166 44 78 33 133]} } }',

I have no issue connecting to the vidly project via MongoDB Compass.

This feels like an issue with how the back-end provided with the course is implemented on m-lab versus MDB Atlas.

Because this is a front-end course, Mosh should re-record this section immediately to clarify the process for deploying the back-end. I have been working on this for hours without any results and that is unacceptable

[DaniusK]

Hi Greg, As I remember when I was generating a token or string on Mongo DB to connect it to Heroku I had to chnage the version of Mongo DB to earliest available version and it generates quite longer string than if you choose latest version and then it worked for me. I hope it will work for you. Thanks Danius

…

________________________________ From: Greg Compton <[email protected]> Sent: 24 September 2019 02:18 To: mosh-hamedani/vidly-api-node <[email protected]> Cc: Danius Kvedaras <[email protected]>; Mention <[email protected]> Subject: Re: [mosh-hamedani/vidly-api-node] React Vidly App Deployment (#14) @DaniusK<https://github.com/DaniusK> I am also trying to complete the React course and am stuck in Lecture 9 of Deployment. What do you mean by you "had to change the version of MDB Atlas string to earlier version"? Upon running heroku open it seems that I am connecting to Mongo Atlas, but I get an error [ 'MongoError: not authorized on admin to execute command { listIndexes: "users", cursor: { }, $clusterTime: { clusterTime: 6740035423914950658, signature: { hash: [236 31 24 12 51 148 8 126 22 171 160 158 122 222 178 130 35 230 199 57], keyId: 6737669609899425792.000000 } }, lsid: { id: {4 [51 14 151 138 224 82 79 87 137 183 223 166 44 78 33 133]} } }', I have no issue connecting to the vidly project via MongoDB Compass. This feels like an issue with how the back-end provided with the course is implemented on m-lab versus MDB Atlas. Because this is a front-end course, Mosh should re-record this section immediately to clarify the process for deploying the back-end. I have been working on this for hours without any results and that is unacceptable — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<#14?email_source=notifications&email_token=AMLCPN462RS6NX7C4QV2A43QLFTGXA5CNFSM4IH7GGRKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD7MXSDA#issuecomment-534345996>, or mute the thread<https://github.com/notifications/unsubscribe-auth/AMLCPN6LBT4Q47ULFDELWZTQLFTGXANCNFSM4IH7GGRA>.

[vedant0712]

Hello! I am trying deployment as well but unable to find a solution. This is the error I got. Please help out.

[safi-alt]

Please help me, I tried deploying the vidly-api-node backend give by Mosh in the React course but this is the problem I am facing while connecting the mongodb with heroku. Since now mLab is mongodb Atlas. Please help

[olpner]

I also tried to fix this but couldn't. Tried all three Node.js versions of the connection string provided by MongoDB Atlas. I also tried different versions of bcrypt. None of this seemed to make a difference. If somebody manages to solve this please share it with the rest of us. Mosh isn't going to solve it that's for sure.

[andre-rd-rodrigues]

I guys! Just had this issue. Don't know if you managed to solve it, but this way worked for me:

1. Import genres (JSON object) for MongoDB Atlas Database - you can do it with MongoDB Compass, which facilitates the management of your MongoDB Database objects;
   Here's the link: https://www.mongodb.com/blog/post/import-export-your-data-with-compass

2. Then, what happened to me was the connection to MongoDB Atlas was ok, but I didn't get any data from the database I had created. This problem is because the connection string was pointing to a database called test by default.
   In your MongoDB Atlas go to: clusters > connect > connect your application > copy the connection string (something like this: mongodb+srv://:@.25vz6.mongodb.net/?retryWrites=true&w=majority) AND substitute with your user password and with the name of your database.
   Here's the link: https://stackoverflow.com/questions/56397921/mongodb-atlas-connection-working-but-not-displaying-data-in-heroku

3. Config heroku in vidly-api-node (showed in video number 9 - Setting Environment Variables) - heroku config:set vidly_bd (...)

Now this should be working :)

[mohith2310]

Hi andre,

Thanks so much. Ur solution helped

[udayaugustin]

@DaniusK I am also trying to complete the React course and am stuck in Lecture 9 of Deployment.

What do you mean by you "had to change the version of MDB Atlas string to earlier version"?

Upon running heroku open it seems that I am connecting to Mongo Atlas, but I get an error

[ 'MongoError: not authorized on admin to execute command { listIndexes: "users", cursor: { }, $clusterTime: { clusterTime: 6740035423914950658, signature: { hash: [236 31 24 12 51 148 8 126 22 171 160 158 122 222 178 130 35 230 199 57], keyId: 6737669609899425792.000000 } }, lsid: { id: {4 [51 14 151 138 224 82 79 87 137 183 223 166 44 78 33 133]} } }',

I have no issue connecting to the vidly project via MongoDB Compass.

This feels like an issue with how the back-end provided with the course is implemented on m-lab versus MDB Atlas.

Because this is a front-end course, Mosh should re-record this section immediately to clarify the process for deploying the back-end. I have been working on this for hours without any results and that is unacceptable

I got the same error when I deploy the node js app. Please follow below to fix this error:

1. Vidly node app is using the mongoose package version "mongoose": "^5.0.2". Update it to the latest by using the below command "npm install mongoose". You need to run this command in the vidly-api-node project.
2. After that push it to Heroku git.

sample connection string : <vairablename>=mongodb+srv://<user>:<password>@vidly.wrejo.mongodb.net/<dbname>?retryWrites=true&w=majority
sample environment variable : heroku config:set <vairablename>=mongodb+srv://<user>:<password>@vidly.wrejo.mongodb.net/<dbname>?retryWrites=true&w=majority

Now it will work.

[sepehr71]

Hi @udayaugustin , thanks alot , but this command "npm install -s mongoose" worked for me

[ForestLin2020]

Hi everyone, I just solved this question. And there are some solutions in the below link. Hoping it can help the following people.
https://forum.codewithmosh.com/t/heroku-deployment-with-mongodb-atlas-failed/1626/5

[qiqiliang1996]

https://forum.codewithmosh.com/t/heroku-deployment-with-mongodb-atlas-failed/1626/5
credit to: sampreeth

I fixed it !!!!!!!!!!!! I stuck on it for 2 days!!!!!

Steps I followed to fix this issue.

First,

npm update mongoose
Latest mongoose as of 5/01/2021 is mongoose 5.11.10. If there is a newer version please check the documentation.

Second,
If you are following mosh course. Open db.js in startup folder.

Change

mongoose.connect(db)
to

mongoose.connect(db, {useNewUrlParser:true, useUnifiedTopology: true})
Three,
copy the connection string for Node driver version 2.2.12 or later.

make sure the connection string does not have (mongodb+srv)

copied connection string for node driver version 2.2.12 will look like as shown below.

mongodb://:@vidlycluster-shard-00-00.knv7y.mongodb.net:27017,vidlycluster-shard-00-01.knv7y.mongodb.net:27017,vidlycluster-shard-00-02.knv7y.mongodb.net:27017/?ssl=true&replicaSet=atlas-8ezfa5-shard-0&authSource=admin&retryWrites=true&w=majority
Replace “password” with the password for the “username” user. Replace “dbname” with the name of the database that connections will use by default.
Once replaced, remove all the angle brackets.

Four,
Head over to heroku dashboad,
→Settings → Click on “Reveal Config Vars” → Enter the Key as vidly_db, value will the connection mongodb connection string.

Five,
Back to terminal,
git add .
git commit -m “Commit message”
git push heroku master
heroku open

Hope this helps someone. It was a struggle for me to find this solution.

Cheers.

Ps: @programmingwithmosh Mlab is now bought by mongodb atlas. If you could update this in your course it would be really grateful.

[asjn3e]

guys all you have to do is to update your mongoose package to the latest version by typing
npm update mongoose

and then for getting rid of mongoose warnings in terminal you can modify db.js in startup folder like this
from this: mongoose.connect(db) .then(() => winston.info("Connected to db"));
to this: mongoose .connect(db, { useNewUrlParser: true, useUnifiedTopology: true, }) .then(() => winston.info("Connected to db"));