You are on page 1of 11

HOW TO OVERCOME YOUR EXISTENTIAL CRISIS

CONNECT MONGODB DATABASE TO VSCODE

Head over to mongodb.com and create your account, may option naman don to sign in with google so
yun na lang piliin nyo para mas madali. May malabas don na accept policy chuchu, just tick the checkbox
then submit.

May lalabas jan na ganito. Pwede mo pangalanan yung org mo pero sakin nag skip na lang ako. Meron
naman yung option sa baba.

Pagtapos non may lalabas na ganto. Just click on click a cluster dun sa free.
Once you’re done with this eto ang kasunod. In my case pinili ko (sanaol pinili) yung aws tas region ko is
Singapore. Then click on Create Cluster.
Pagka click mo sa create cluster mapupunta ka sa tab na to. Just wait for 1-3 minutes para magawa yung
cluster mo.

Pag tapos na macreate yung cluster ganto ang malabas. Click mo yung collections.
Mapupunta ka sa tab na to, dito dapat nakalista yung mga databases natin. Since wala pang nakalagay
dito create tayo ng bago by clicking add my own data.

Pagkaclick mo non hihingin yung database name tsaka collection name. In my case, ang nilagay kong db
name ay mernstack tas yung collection name ay users. Pagka click mo nung create eto ngayon ang
malabas. Wala pa yang laman kasi aconnect pa natin yan sa vscode.
Balik ka ulit sa clusters. This time ang iclick mo naman yung connect. Ngayon lalabas to. Para dun sa IP
click mo lang yung add my current IP address. Dito sa database user, simplehan na lang natin yung
credentials para madali matandaan. Ang ginawa ko ditong username at password ay admin123.
Remember your password dahil gagamitin pa yon mamaya.

Click on Create Database User, tas Choose a connection method.

Ganto ngayon ang malabas. Click naten yung connect your application.
Lalabas to and please take note of the connection string (yung mongodb+srv chuchu). Ito yung ilalagay
natin sa vscode. Icopy nyo yun then proceed tayo sa next step.

Kung hindi nyo pa nadadownload yung code sa github ay idl nyo na. (thehungrycoder225/mern-
template (github.com) click nyo lang yung code tas download zip, then extract nyo sa kung saang
location nyo gusto) Open mo yung folder sa vscode and follow the instructions na nandon sa readme.

1. Git clone the template


2. npm i
3. cd frontend npm i
4. cd ../
5. create .env file
6. include this variables
i. NODE_ENV = production
ii. PORT = 5000
iii. CLOUD_DB_URI =
iv. JWT_SECRET = secretcode
v. JWT_EXPIRES_IN = 60d
vi. JWT_COOKIE_EXPIRES_IN = 60d

Once nagawa nyo na to punta kayo dun sa .env file. Yung variable dito na CLOUD_DB_URI, dun natin
ilalagay yung connection string natin sa mongodb. Take note, ang mapapaste jan is something like this
mongodb+srv://admin:<password>@cluster0.kaqx4.mongodb.net/myFirstDatabase?retryWrites=true
&w=majority. Yung password, papaltan natin ng password natin. In my case ang password ko ay
admin123. Yung myFirstDatabase papaltan natin ng pangalan ng database natin. In my case, ang
pangalan ng db ko ay mernstack.
Pag napaste nyo na, try nyo itype sa terminal yung npm run dev. Make sure na nasa root directory kayo.
Pag nasa frontend pa rin kayo na folder you could always cd ../

Pag walang mali, ganto yung lalabas. If may error sa inyo retrace your steps or magtanong na kayo kay
sir.
Try natin ngayon kung gagana yung database. Punta kayo sa registration then fill out the fields. Dun sa
password, dapat at least 8 characters sya. Para mapadali ang buhay ginawa ko na lang 12345678 yung
sakin para madali pating matandaan.

Pagkaclick mo nung register rekta na agad dapat yon dito sa profile.


Para maverify natin kung naregister talaga, balik kayo sa mongodb, dun sa database natin na mernstack.
Makikita nyo dito na naka register na yung user natin. Kaya dalawa yung nakikita nyo dito kasi inulit ko
lang yung pag register.

Kung gusto nyo bigyan ng admin access yung user, click nyo yung pencil icon sa upper right corner. Then
yung role na client paltan lang natin ng admin then click on update.
Dun sa ating live server, ilog out nyo na muna yung user. Tas log in kayo ulit. Since binigyan natin yung
user ng admin access, ganto dapat ang interface na malabas.

May makikita na kayo jan na adminpanel na pagni-click nyo, may option na pwede makita yung user list.
Pwede kayo manually mag add ng panibagong user dito without going through the registration phase.
Pwede na rin kayo mag delete ng user.
Yun na lang siguro muna maaambag ko. Kinakapa ko pa rin kasi kung pano baguhin yung interface nang
di nawawala yung functionality nung program. Anyways sana nakatulong to.

Mahal tayo ni Lord

-Den

You might also like