MERN Stack Application:

Mongo DB
express
react
Node js

	MongoDB (How to use it)

		NO SQL DB

Generally every DB needs language -Why?
	-To manipulate Data

MOngo DB has functions/JS like commands to manipulate data -no need of SQL

It is a document based DB-its schema less=>structureless

Setup mongo db :

https://www.mongodb.com/try/download/community

download the required specification

-while installing u will get an option to choose "MongoDb compass"  =>please choose it mandatoritly

MongoDb compass will provide GUI and CLI for database

once installed pls start mongoDb server

generally by default its installed but sometime might be because of other DB taking over the port/any issue it might not have started

got to program=> go to services => check for mongo db if not started pls right click and start it

connection string: mongodb/127.0.0.1:27017
		   mongodb://localhost:27017

we need to know commands to work with mongodb like we have in any other db like mysql,oracle etc

note: React cant communicate with DB directly so we need server side support


Oracle/MySQL etc						mongoDB

we store data in tables						we store in collections
In table data is stored as records/rows				here as document
field								field
joins								embedded docs

mongo db is case sensitive

1.to view existing DB
	-show dbs 

2.to use /create an existing db or new db

	use databaseName

if databaseName is available it will switch to that Db else it will create a new one with that same DB name
you need to add some collection else the table is not permananetly saved

3.Add collections:
	db.createCollection("name",{options})

options:

autoindexid			Boolean			set an auto primary key of account

max				number			defines max no of records/documents to allow

size:				number			defines amemory allocation for collection[bytes]

capped:				boolean

	

capped and max are dependents

if max as 10 and capped as true .when we try to insert 11th record it will not be inserted
if max is 10 and capped is false when we try to insert 11th record it will be inserted by replacing old one

by default autoindexed and capped is true

size should be in bytes 

4mb=> 1024 x 1024 =result
result x 4


add data/documents to collection:
inserOne()
insertMany()	


	-db.collectionName.insertOne({})
	-db.collectionName.insertMany({},{})

In oracle if i want to add string what s the datatype?
	-varchar
	
in MongoDb 
	-JS datatype will be used here
	mongoDb uses JS data types -ex: string,null,number Boolean etc 



select * from emp

similar way mongo Db also should provide us t search data:

	find({query})

mongodb supports various opeartors

$gt greater than

$lt less than

$gte greater than equal to

$lte less than equal to

$ne not equal

$eq equal

$and AND

$or OR


ex: i want all the records whose price is more than 600

ex: db.fakestore.find({price:{$gt:600}})

I want price between 200 and 600
	
	{$and :[{query1},{query2}]
	-
db.fakestore.find({$and:[{price:{$gt:200}},{price:{$lt:600}}]})



update data into documents:

-updateOne()
-UpdateMany()

syntax:
	db.collection.updateOne({find},{update})

	update requires some operators:
	
	$set : to update value
	$sunset: to remove field
	$rename: to rename field

	we need to find record to update it=> then update

	db.fakestore.updateOne({id:4},{$set:{price:400}})

	
	pls try updateMany()

	Delete documents
	
		-deleteOne()
		-deleteMany()

	db.collection.deleteOne({findquery})


Distributed computing and API

	-Node is required to create server side web application
	-Express JS is a middleware that handles communication in network application
	-TS project

set up typescript project

	npx create-react-app ts-react --template typescript

	npx uses which bundler=> webpack

	pre-req:you should have installed Typescript in the system.

new file system:
	-tsconfig.json
	-.tsx file for hooks and components
	-.ts for contracts

Contracts in OOP
	-a contract defines set of rules for designing a component
	purpose:
		-In any OOP interface are used to define rules and these rules are implemented using classes.
		
		-
benefits of contract is :
	-reuse the rule ,extend the rule

design a contract and use it

interface IProduct {
    Id: number;
    Name: string;
    Stock: boolean
}


var product: IProduct = {
    Id: 1,
    Name: "Abhi",
    Stock: true
}


how to work with use state
const [categories, setCategories] = useState<string[]>()
    const [product, setProduct] = useState<FakestoreContract>()
    const [products, setProducts] = useState<FakestoreContract[]>()

export interface FakestoreContract {
    id: number;
    title: string;
    price: number;
    description: string;
    category: string;
    image: string;
    rating: {
        rate: number;
        count: number
    }
}


bindingexpression {}
stylebinding,classbinding,databinding,eventbinding=> all are same as we have used

Ajax request are same
	-XMLHttprequest
	-Fetch
	-jqueryAjax
	-Axios

ex of contract and how to present data in TS react

import { useEffect, useState } from "react"
import { FakestoreContract } from "../../contract/FakeStoreContract"
import axios from "axios"

export function DataBinding() {
    const [categories, setCategories] = useState<string[]>([''])
    const [product, setProduct] = useState<FakestoreContract>()
    const [products, setProducts] = useState<FakestoreContract[]>()

    function LoadCategories() {
        axios.get("https://fakestoreapi.com/products/categories")
            .then(response => {
                setCategories(response.data)
            })
    }

    useEffect(() => {
        LoadCategories();
    }, [])

    return (
        <div>
            <ol>

                {
                    categories.map(category => <li>{category}</li>)
                }


            </ol>

        </div>
    )
}


how to create API with node and express JS

nodejs is used to build server side web application and that web application has to handle communication between client and database

we need middleware to connect

what is oracle?

Oracle is not a DB its a ERP technology,db is one of the service they offer

SAP-CRM
SAP-ABM

install required libraries and tools

npm install express --save

npm install mongodb --save

npm install cors --save    [cross origin resource sharing ] 


var express = require("express")
var app = express()
app.get("/", (request, response) => {
    response.send("welcome to API world")
})

app.get("/product", (req, res) => {
    var product = {
        Name: "TV",
        Price: 3000,
        Stock: true
    }
    res.send(product)
})

app.listen(5050)
console.log("server started:http:127.0.0.1:5050")


we need to peform crud operation for that we need to understand how to connect with db
	
	
Mongo DB connection with api
	-install mongodb driver 
	-import :MongoClient" class from driver
	var mongoClient=require("mongodb").MongoClient //import
	connect to DB(mongodb) server using connection string
		-mongoClient.connect("connection string").then().catch().finally()
	

then() uses a function that returns client object which is responsible for communicating with db on server

	mongoClient.connect("connectionstring")
	.then(function(clientObject){
		var database=clientObject.db("databaseName")
})


we can access the db using the variable name

database refrence will allow us to communicate with collections in DB
	database.collection("name").find()
				   .insertOne() etc



TO DO Application
	-Usermodule
		-user can register
		-user can login
		-user can add appointments
		-user can view edit and delete appointments
	-Appointment module

we require database
usercollection

ex:
	User Id [pk]
	Username
	Password
	Email
	Mobile


appointment collection
	Appointment Id [pk]
	Title
	Description
	Date
	User ID [fk]

primary config in api.js file

var express = require("express");
var mongoClient = require("mongodb").MongoClient;
var cors = require("cors")
var app = express()
app.use(cors())

app.use(express.urlencoded({ extended: true }))
app.use(express.json())
var connectionString = "mongodb://127.0.0.1:27017"
	

in api.js to get data from table

app.get("/users", (req, resp) => {
    mongoClient.connect(connectionString).then(clientObject => {
        var database = clientObject.db("todo-react")
        database.collection("tblusers").find({}).toArray().then(documents => {
            resp.send(documents)
            resp.end()
        })
    })
})

app.listen(3200)
console.log("server started:http:127.0.0.1:3200")