PCAT

Çalışma Ortamı
ExpressJS
Template Engine EJS
MongoDB
Method Override
Heroku-MongoDb Atlas Canlı Ortam

CALISMA ORTAMI HAZIRLANMASI

NPM Yükleme:
npm init -y | -y => Default options
Prettier Yükleme :
npm install prettier -D --save-exact
.prettierc File :

{
  "tabWidth": 2,
  "useTabs": false,
  "semi":true,
  "singleQuote": true,
  "trailingComma": "es5"
}

.gitignore Dosyası Oluşturma:
https://www.toptal.com/developers/gitignore/api/node
ExpressJS Yükleme :
npm i express --save
Nodemon Yükleme (Sunucuyu tekrar çalıştırmadan değişikliklerin algılanmasını sağlıyor):
npm i --save-dev nodemon

--save-dev flagı yardımıyla nodemon modülünün bir devDependency olduğunu belirtiyoruz.
İndirme işlemi tamamlandıktan sonra package.json dosyasında scripts claiminie yeni bir start claim ekliyoruz.

  "scripts": {
    "start": "nodemon app.js" 
  },

Express Js

Statik Dosyalar :

app.use(express.static('public')); //public klasöründeki dosyalar static

Detay Sayfalarında statik dosyalar yüklenmez ise başına / işareti koymalıyız. Örnek : /css/style.css

Middleware :

//Örnek Loggler Middleware
const myLogger = (req, res, next) => {
  console.log('Middleware Log 1');
  next();
}

File Upload :
Resim Yüklemek için npm i express-fileupload modülünü kullanıyoruz.
yrıca görsel göndermemiz için encType="multipart/form-data" eklememiz gerekir. app.use(fileUpload()); //file upload için middleware

Template Engine

Template Engine Yükleme : npm i ejs
EJS views klasörüne bakmaktadır
html dosya uzantılarını .ejs olarak değiştiririz.
partial kullanımı mevcut _partialname
partial include <%- include('partials/_partialname') %>
linkler path olarak verilmeli. Örnek : /about /contact app.js den requestler karşılanmalı.

MongoDb

https://www.mongodb.com/try/download/community adresinden indirilebilir.
C:\Program Files\MongoDB\Server\5.0\bin mongo terminal ekranı için sistem değişkeni olarak eklenmeli.

MongoDB Compass : Mongo için GUI
show dbs Veritabanlarını Listeler
use deneme-test-db Veritabanı Oluşturmak ve Kullanmak İçin
Photos collection ve bu collection içerisindeki ilk dökümanımızı oluşturmak için:

db.photos.insertOne(
  {title: "Photo 1", description: "Photo description lorem ipsum", qty:20}
)

db.photos.find() dökümanı görebilmek için.
show collections collectionları görmek için.
Birden daha fazla döküman oluşturmak için:

db.photos.insertMany([
  {title: "Photo 2", description: "Photo 2 description", qty:50},
  {title: "Photo 3", description: "Photo 3 description", qty:150}
])

Belirli özelliklere sahip dökümanları sıralamak için 2 örnek:

db.photos.find({title: "Photo 1"})
db.photos.find({title: "Photo 1", qty:200})

Güncelleme yapmak için :

db.photos.updateOne( {title: "Photo 1"}, { $set: {qty:222}} )

Silme yapmak için :

db.photos.deleteOne({qty: 50})

Eğer birden daha fazla döküman varsa ilki silinir. Birden fazla döküman silmek için, deleteMany() kullanılır.

Mongoose

npm i mongoose Mongoose için dökümantasyon : https://mongoosejs.com/docs/guide.html

Method Override

Bilgileri "POST" request ile göndereceğiz ancak değişen bilgileri göndermek için http PUT request kullanacağız.Tarayıcılar desteklemediği için PUT requesti simule edeceğiz.
npm i method-override

// Middleware
app.use(methodOverride('_method',{
  methods:['POST','GET']
}));

form method="POST" action="/photos/<%= photo._id %>?_method=PUT" -> formu düzenliyoruz

PROJEYI CANLI ORTAMA ALMA

Heroku sitesinden CLI indirip kuruyoruz.
MongoDB Atlas'a kaydolup bir Cluster oluşturuyoruz.
Cluster içerisinde kullanıcı adı ve şifremizi ayarlıyoruz.
Uygulama içerisinden bağlanmak için Connect your application seçeneğine tıklıyoruz.
app.js de mongodb connect alanını güncelliyoruz.
package.json dosyasında nodemon u node olarak değiştiriyoruz.
CMD de heroku login komutunu giriyoruz.

 > heroku login
 > cd my-project/
 > git init
 > heroku git:remote -a photocat-app
 > git add .
 > git commit -am "make it better" // branch main olduğundan heroku master branch e baktığından ayarlama yapmak lazım
 > git checkout master
 > git checkout -b main
 > git push heroku main // eğer main branch zaten seciliyse direkt olarak main branch yazılabilir.
 // remote u değiştirdiğimiz unutulmamalı düzenleme yapılacaksa git remote edilmeli yoksa herokuya gider 😉

Mongo Atlas sitesinde Network Access sekmesine geliyoruz.
Add Ip Accesss -> Allow Access Anywhere ekliyoruz...
const port = process.env.PORT || 5000; // sistemden gelecek olan portu kullan yoksa yada 5000 portunu kullan
🔴CANLI TEST

kadiraciktan / PCAT