npm - mongodb241 - Versions diffs - 1.0.0 - Mend

mongodb241 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (42) hide show

package/library-frontend/package.json ADDED Viewed

@@ -0,0 +1,28 @@
+{
+  "name": "library-frontend",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-scripts": "5.0.1",
+    "web-vitals": "^2.1.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build"
+  },
+  "proxy": "http://localhost:5000",
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

package/library-frontend/public/index.html ADDED Viewed

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>📚 MERN Library</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

package/library-frontend/src/App.js ADDED Viewed

@@ -0,0 +1,50 @@
+import { useState, useEffect } from 'react';
+export default function App() {
+  const [books, setBooks] = useState([]);
+  const [title, setTitle] = useState('');
+  // fetch books
+  useEffect(() => {
+    fetch('/api/books')
+      .then(res => res.json())
+      .then(setBooks);
+  }, []);
+  // add
+  const add = async () => {
+    await fetch('/api/books', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ title })
+    });
+    setTitle('');
+    const res = await fetch('/api/books');
+    setBooks(await res.json());
+  };
+  // delete
+  const del = async (id) => {
+    await fetch('/api/books/' + id, { method: 'DELETE' });
+    setBooks(books.filter(b => b._id !== id));
+  };
+  return (
+    <div>
+      <h2>Library</h2>
+      <input value={title} onChange={e => setTitle(e.target.value)} />
+      <button onClick={add}>Add</button>
+      <ul>
+        {books.map(b => (
+          <li key={b._id}>
+            {b.title}
+            <button onClick={() => del(b._id)}>X</button>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}

package/library-frontend/src/index.js ADDED Viewed

@@ -0,0 +1,6 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App';
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(<App />);

package/package.json ADDED Viewed

@@ -0,0 +1,18 @@
+{
+  "name": "mongodb241",
+  "version": "1.0.0",
+  "private": false,
+  "scripts": {
+    "install-all": "cd library-backend && npm install && cd ../library-frontend && npm install",
+    "start": "concurrently \"cd library-backend && node server.js\" \"cd library-frontend && npm start\""
+  },
+  "dependencies": {
+    "concurrently": "^8.0.0"
+  },
+  "description": "",
+  "main": "index.js",
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "commonjs"
+}