Repository: bradtraversy/microposts_fullstack_vue
Branch: master
Commit: 7754dd535eeb
Files: 5
Total size: 3.1 KB
Directory structure:
gitextract_iraell4x/
├── .gitignore
├── README.md
├── package.json
└── server/
├── index.js
└── routes/
└── api/
└── posts.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .gitignore
================================================
node_modules
/server/public
================================================
FILE: README.md
================================================
# Microposts
> Example of a fullstack app using Vue.js, Express and MongoDB. You will need to edit the MongoDB connection string in server/routes/api/posts.js to your own.
## Quick Start
```bash
# Install dependencies
npm install
# Start Express Server: http://localhost:5000
npm start
# Start Vue DevServer: http://localhost:8080
cd client
npm run serve
# Build for production (Will build into server/public, ready for deployment)
cd client
npm run build
```
## App Info
### Author
Brad Traversy
[Traversy Media](http://www.traversymedia.com)
### Version
1.0.0
### License
This project is licensed under the MIT License
#the css used in the video
div.container {
max-width: 800px;
margin: 0 auto;
}
p.error {
border: 1px solid #ff5b5f;
background-color: #ffc5c1;
padding: 10px;
margin-bottom: 15px;
}
div.post {
position: relative;
border: 1px solid #5bd658;
background-color: 3bcffb8;
padding: 10px 10px 30px 10px;
margin-bottom: 15px;
}
div.created-at {
position: absolute;
top: 0;
left: 0;
padding: 5px 15px 5px 15px;
background-color: darkgreen;
}
p.text {
font-size: 22px;
font-weight: 700;
margin-bottom: 0;
}
================================================
FILE: package.json
================================================
{
"name": "fullstack_vue_express",
"version": "1.0.0",
"description": "Full stack vue and express app",
"main": "index.js",
"scripts": {
"start": "node server/index.js",
"dev": "nodemon server/index.js"
},
"author": "Brad Traversy",
"license": "MIT",
"dependencies": {
"body-parser": "^1.18.3",
"cors": "^2.8.4",
"express": "^4.16.3",
"mongodb": "^3.1.13"
},
"devDependencies": {
"nodemon": "^1.18.4"
}
}
================================================
FILE: server/index.js
================================================
const express = require('express');
const bodyParser = require('body-parser');
const cors = require('cors');
const app = express();
// Middleware
app.use(bodyParser.json());
app.use(cors());
const posts = require('./routes/api/posts');
app.use('/api/posts', posts);
// Handle production
if (process.env.NODE_ENV === 'production') {
// Static folder
app.use(express.static(__dirname + '/public/'));
// Handle SPA
app.get(/.*/, (req, res) => res.sendFile(__dirname + '/public/index.html'));
}
const port = process.env.PORT || 5000;
app.listen(port, () => console.log(`Server started on port ${port}`));
================================================
FILE: server/routes/api/posts.js
================================================
const express = require('express');
const mongodb = require('mongodb');
const router = express.Router();
// Get Posts
router.get('/', async (req, res) => {
const posts = await loadPostsCollection();
res.send(await posts.find({}).toArray());
});
// Add Post
router.post('/', async (req, res) => {
const posts = await loadPostsCollection();
await posts.insertOne({
text: req.body.text,
createdAt: new Date()
});
res.status(201).send();
});
// Delete Post
router.delete('/:id', async (req, res) => {
const posts = await loadPostsCollection();
await posts.deleteOne({ _id: new mongodb.ObjectID(req.params.id) });
res.status(200).send({});
});
async function loadPostsCollection() {
const client = await mongodb.MongoClient.connect(
'mongodb://YOUR_OWN_MONGODB',
{
useNewUrlParser: true
}
);
return client.db('vue_express').collection('posts');
}
module.exports = router;
gitextract_iraell4x/
├── .gitignore
├── README.md
├── package.json
└── server/
├── index.js
└── routes/
└── api/
└── posts.js
SYMBOL INDEX (1 symbols across 1 files)
FILE: server/routes/api/posts.js
function loadPostsCollection (line 29) | async function loadPostsCollection() {
Condensed preview — 5 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (4K chars).
[
{
"path": ".gitignore",
"chars": 27,
"preview": "node_modules\n/server/public"
},
{
"path": "README.md",
"chars": 1173,
"preview": "# Microposts\n\n> Example of a fullstack app using Vue.js, Express and MongoDB. You will need to edit the MongoDB connecti"
},
{
"path": "package.json",
"chars": 457,
"preview": "{\n \"name\": \"fullstack_vue_express\",\n \"version\": \"1.0.0\",\n \"description\": \"Full stack vue and express app\",\n \"main\": "
},
{
"path": "server/index.js",
"chars": 617,
"preview": "const express = require('express');\nconst bodyParser = require('body-parser');\nconst cors = require('cors');\n\nconst app "
},
{
"path": "server/routes/api/posts.js",
"chars": 924,
"preview": "const express = require('express');\nconst mongodb = require('mongodb');\n\nconst router = express.Router();\n\n// Get Posts\n"
}
]
About this extraction
This page contains the full source code of the bradtraversy/microposts_fullstack_vue GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 5 files (3.1 KB), approximately 1.0k tokens, and a symbol index with 1 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.