Me 30 add mongoose

package.json

@@ -26,11 +26,13 @@
   },
   "dependencies": {
     "express": "^4.17.1",
+    "mongoose": "^6.0.7",
     "socket.io": "^4.1.2"
   },
   "devDependencies": {
     "@babel/preset-typescript": "^7.14.5",
     "@types/express": "^4.17.12",
+    "@types/mongoose": "^5.11.97",
     "@types/node": "^15.12.2",
     "@types/socket.io-client": "^3.0.0",
     "@typescript-eslint/eslint-plugin": "^4.26.1",

src/client/src/app/app.component.html

@@ -1 +1 @@
-{{title}}
+<app-user-list></app-user-list>

src/client/src/app/app.module.ts

@@ -3,10 +3,14 @@ import { BrowserModule } from '@angular/platform-browser';
 import { HttpClientModule } from '@angular/common/http';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
+import { UserListComponent } from './components/user-list/user-list.component';
+import { AddUserComponent } from './components/add-user/add-user.component';
 
 @NgModule({
   declarations: [
-    AppComponent
+    AppComponent,
+    UserListComponent,
+    AddUserComponent
   ],
   imports: [
     BrowserModule,

src/client/src/app/components/add-user/add-user.component.html

@@ -0,0 +1,3 @@
+<!-- <p>add-user works!</p>
+<input type="text" #userInput />
+<button (click)="addUsers(userInput)">Add User</button> -->

src/client/src/app/components/add-user/add-user.component.ts

@@ -0,0 +1,18 @@
+import { Component, OnInit } from '@angular/core';
+import { UsersService } from 'src/app/services/users.service';
+
+@Component({
+  selector: 'app-add-user',
+  templateUrl: './add-user.component.html',
+  styleUrls: ['./add-user.component.scss']
+})
+export class AddUserComponent implements OnInit {
+
+  constructor(private usersService:UsersService) { }
+
+  ngOnInit(): void {
+  }
+//   addUsers(input: HTMLInputElement) {
+//   this.usersService.addUsers(input.value).subscribe()
+// }
+}

src/client/src/app/components/user-list/user-list.component.html

@@ -0,0 +1,6 @@
+<p>user-list works!</p>
+<ul>
+  <li *ngFor="let user of users$ | async">
+    {{ user.name }}
+  </li>
+</ul>

src/client/src/app/components/user-list/user-list.component.ts

@@ -0,0 +1,19 @@
+import { Component, OnInit } from '@angular/core';
+import { UsersService } from 'src/app/services/users.service';
+
+@Component({
+  selector: 'app-user-list',
+  templateUrl: './user-list.component.html',
+  styleUrls: ['./user-list.component.scss']
+})
+export class UserListComponent implements OnInit {
+
+  constructor(private usersService: UsersService) { }
+
+  ngOnInit(): void {
+    this.usersService.getUsers();
+  }
+  get users$() {
+    return this.usersService.users$;
+  }
+}

src/client/src/app/models/user.ts

@@ -0,0 +1,26 @@
+export class User {
+    "id": 1;
+    "name": "Leanne Graham";
+    "username": string;
+    "email": "Sincere@april.biz";
+    "address": {
+        "street": "Kulas Light",
+        "suite": "Apt. 556",
+        "city": "Gwenborough",
+        "zipcode": "92998-3874",
+        "geo": {
+            "lat": "-37.3159",
+            "lng": "81.1496"
+        }
+    }
+
+    "phone": "1-770-736-8031 x56442";
+    "website": "hildegard.org";
+    "company": {
+        "name": "Romaguera-Crona",
+        "catchPhrase": "Multi-layered client-server neural-net",
+        "bs": "harness real-time e-markets"
+
+
+}
+}

src/client/src/app/services/api.service.ts

@@ -12,4 +12,9 @@ export class ApiService {
   get<T>(resourceName: string) {
     return this.http.get<T>(this.baseUrl + resourceName);
   }
+  post<T,D>(resourceName: string,data:D) {
+    return this.http.post<T>(this.baseUrl + '/' + resourceName,data)
+  }
 }
+
+

src/client/src/app/services/users.service.ts

@@ -0,0 +1,24 @@
+
+import { ApiService } from './api.service';
+import { Injectable } from '@angular/core';
+import { Observable, observable } from 'rxjs';
+import { User } from '../models/user';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UsersService {
+  users$: Observable<User[]> = new Observable((Observer) => {
+    Observer.next([])
+  });
+  constructor(private apiService: ApiService) {
+    this.getUsers();
+   }
+
+  getUsers() {
+   this.users$= this.apiService.get<User[]>('users')
+  }
+
+
+}
+

src/server/schemas/post.schema.ts

@@ -0,0 +1,16 @@
+import mongoose from 'mongoose';
+export interface Post {
+    title: string;
+    body: string;
+
+  }
+
+  // 2. Create a Schema corresponding to the document interface.
+  const postSchema = new mongoose.Schema<Post>({
+    title: { type: String, required: true },
+    body: { type: String, required: true },
+
+  });
+
+  // 3. Create a Model.
+  export const PostModel = mongoose.model<Post>('Post', postSchema);

src/server/schemas/user.schema.ts

@@ -0,0 +1,17 @@
+import mongoose from 'mongoose';
+const {Schema, model} = mongoose;
+export interface User {
+    name: string;
+    email: string;
+    avatar?: string;
+  }
+
+  // 2. Create a Schema corresponding to the document interface.
+  const userSchema = new Schema<User>({
+    name: { type: String, required: true },
+    email: { type: String, required: true },
+    avatar: String
+  });
+
+  // 3. Create a Model.
+  export const UserModel = model<User>('User', userSchema);

src/server/server.ts

@@ -1,24 +1,109 @@
 import express from 'express';
 import cors from 'cors';
-import fs from 'fs';
 import path from 'path';
-
-const app = express();
-const __dirname = path.resolve();
-const PORT = 3501;
 
-app.use(cors());
+import mongoose from 'mongoose';
+import { UserModel } from './schemas/user.schema.js';
+import { PostModel } from './schemas/post.schema.js';
 
+ mongoose.connect('mongodb://localhost:27017/test').then(() => {
+      console.log('connected to db');
+  }).catch(err => console.log(err, 'connecting to db'))
 
+
+  const app = express();
+  const __dirname = path.resolve();
+  const PORT = 3501;
+
+
+  app.use(cors());
+  app.use(express.json())
+
+  app.get('/create-user', function (req, res) {
+    const user = new UserModel({
+      name: 'mekdes',
+      email:'mekdes123@bitwise.com'
+    });
+      user.save().then(user => {
+        console.log(user, 'saved')
+        res.json({ data: user });
+      });
+  });
+
+  app.get('/create-post', function (req, res) {
+    const post = new PostModel({
+      title: 'first meanstack project',
+      body:'test',
+    });
+      post.save().then(post => {
+        console.log(post, 'saved')
+        res.json({ data: post });
+      });
+       });
+
 app.get('/', function(req, res) {
    res.json({message:'test'});
 });
 
+
+app.get('/posts', function (req, res) {
+  PostModel.find()
+    .then((posts) =>
+      res.json({ data: posts }))
+    .catch((err) => {
+      res.status(501);
+      res.json({ errors: err })
+    })
+})
+
 app.get('/users', function(req,res){
-    res.sendFile(path.join(__dirname, 'users.json'));
+    UserModel.find()
+    .then((users) => 
+      res.json({data:users}))
+    .catch((err) => {
+      res.status(404);
+      res.json({error: err})
+    })
 });
 
+app.post('/create-user',function(req,res){
+  const newUser = new UserModel({
+    email: req.body.email,
+    name: req.body.name,
+  });
 
-app.listen(PORT, function(){
-    console.log( `starting at localhost http://localhost: ${PORT}`);
-})
+  newUser.save()
+  .then(user => {
+    res.json({data: user});
+  })
+  .catch((err) => {
+   res.status(404);
+   res.json({error: err})
+ })
+
+});
+
+
+app.post('/create-post', function (req, res) {
+  const post = new PostModel({
+    title: req.body.title,
+    body: req.body.body,
+   });
+
+  post.save()
+  .then(post => {
+    res.json({data: post});
+  })
+  .catch((err) => {
+   res.status(404);
+   res.json({error: err})
+ })
+
+});
+
+
+
+
+  app.listen(PORT, function () {
+    console.log(`starting at localhost http://localhost: ${PORT}`);
+  })