Readme

.env.example

@@ -0,0 +1,3 @@
+IMGUR_CLIENT_ID=
+DEFAULT_AVATAR=
+DEFAULT_BACKGROUND=

.gitignore

@@ -84,4 +84,7 @@ typings/
 .fusebox/
 
 # DynamoDB Local files
-.dynamodb/
+.dynamodb/
+
+test.js
+default-img.json

Procfile

@@ -0,0 +1 @@
+web: NODE_ENV=production node app.js

README.md

@@ -0,0 +1,67 @@
+# Simple Twitter
+使用 Node.js 搭配後端框架 Express 打造一個社群網站，可進行貼文﹑回覆其他使用者貼文﹑喜歡貼文﹑追蹤使用者…等功能。
+# Features:功能
+- 註冊/登入/登出
+  - 使用者要登入才能使用網站
+  - 使用者註冊重複/登入/登出失敗時，會看到對應的系統訊
+- 使用者
+  - 使用者能在首頁瀏覽所有的推文
+  - 使用者點擊貼文方塊時，能查看該則貼文的詳情與回覆串
+  - 點擊貼文中使用者頭像時，能瀏覽該使用者的個人資料及推文
+  - 使用者能回覆別人的推文
+  - 使用者可以追蹤/取消追蹤其他使用者
+  - 使用者能編輯自己的名稱、介紹、大頭照和個人背景
+  - 使用者能在首頁的側邊欄，看見跟隨者數量排列前 8 的使用者推薦名單
+- 後台管理
+  - 管理者可以瀏覽站內所有的使用者清單
+  - 管理者可以瀏覽全站的推文清單 & 刪除
+
+  # Environment Setup：環境安裝
+- Node.js:v14.16.0
+- Express.js:4.16.4
+- Express-handlebars:^3.0.0
+
+# Installing Procedure：安裝流程
+1.開啟終端機將專案存至本機:
+```
+git clone https://github.com/EasonLu0425/twitter-fullstack-2020.git
+```
+2.進入存放此專案的資料夾
+```
+3.環境變數設定
+將根目錄.env.example檔案中輸入imgur金鑰﹑預設頭貼網路位置﹑預設背景網路位置,再把.env.example檔案名稱修改為.env
+4.建立資料庫
+開啟 MySQL workbench，再連線至本地資料庫，輸入以下建立資料庫 
+
+```
+drop database if exists ac_twitter_workspace;
+create database ac_twitter_workspace;
+use ac_twitter_workspace;
+
+drop database if exists ac_twitter_workspace_test;
+create database ac_twitter_workspace_test;
+use ac_twitter_workspace_test;
+```
+5.安裝 npm 套件
+```
+npm install
+```
+6.db:migrate 設定
+```
+npx sequelize db:migrate 
+```
+7.加入種子資料
+```
+npx sequelize db:seed:all 
+```
+8.啟動專案
+```
+npm run dev
+```
+9.使用
+終端機出現下列訊息" "Example app listening on port 3000!"
+可開啟瀏覽器輸入 http://localhost:3000 使用
+
+10.預設使用者 Seed User
+- 一般使用者帳號有20組 (帳號:user1﹑user2﹑user3…etc，密碼皆為12345678)
+- 管理者帳號僅有1組 (帳號:root ，密碼:12345678)

app.js

@@ -1,13 +1,68 @@
-const express = require('express')
-const helpers = require('./_helpers');
-
-const app = express()
-const port = 3000
+if (process.env.NODE_ENV !== "production") {
+  require("dotenv").config();
+}
+const express = require("express");
+const handlebarsHelpers = require("./helpers/handlebars-helpers");
+const handlebars = require("express-handlebars");
+const flash = require("connect-flash");
+const session = require("express-session");
+const passport = require("./config/passport");
+const routes = require("./routes");
+const helpers = require("./_helpers");
+const path = require("path");
+const methodOverride = require("method-override");
+const app = express();
+const port = process.env.PORT || 3000;
+const SESSION_SECRET = "secret";
 
 // use helpers.getUser(req) to replace req.user
 // use helpers.ensureAuthenticated(req) to replace req.isAuthenticated()
 
-app.get('/', (req, res) => res.send('Hello World!'))
-app.listen(port, () => console.log(`Example app listening on port ${port}!`))
+app.set("view engine", "hbs");
+app.engine("hbs", handlebars({ extname: ".hbs", helpers: handlebarsHelpers }));
+app.use(express.urlencoded({ extended: true }));
+app.use(
+  session({ secret: SESSION_SECRET, resave: false, saveUninitialized: false })
+);
+app.use(passport.initialize());
+app.use(passport.session());
+app.use(methodOverride("_method"));
+app.use(flash());
+app.use("/upload", express.static(path.join(__dirname, "upload"))); //上傳圖片
+app.use("/", express.static("public"));
+app.use((req, res, next) => {
+  const { user } = req;
+  const {
+    success_messages,
+    error_messages,
+    warning_messages,
+    info_messages,
+    account_messages,
+  } = req.flash();
+
+   res.locals = {
+     currentUser: user,
+     success_messages,
+     error_messages,
+     warning_messages,
+     info_messages,
+     account_messages,
+     user: helpers.getUser(req),
+     paramsUser: req.params.user,
+   };
+
+  // res.locals.currentUser = req.user;
+  // res.locals.success_messages = req.flash("success_messages");
+  // res.locals.error_messages = req.flash("error_messages");
+  // res.locals.warning_messages = req.flash("warning_messages");
+  // res.locals.info_messages = req.flash("info_messages");
+  // res.locals.account_messages = req.flash("account_messages");
+  res.locals.user = helpers.getUser(req);
+  res.locals.paramsUser = req.params.user;
+  next();
+});
+
+app.use(routes);
+app.listen(port, () => console.log(`Example app listening on port ${port}!`));
 
-module.exports = app
+module.exports = app;

config/config.json

@@ -15,11 +15,7 @@
     "logging": false
   },
   "production": {
-    "username": "root",
-    "password": null,
-    "database": "database_production",
-    "host": "127.0.0.1",
-    "dialect": "mysql"
+    "use_env_variable": "MYSQL_DATABASE_URL"
   },
   "travis": {
     "username": "travis",

config/passport.js

@@ -0,0 +1,35 @@
+const passport = require('passport')
+const LocalStrategy = require('passport-local')
+const bcrypt = require('bcryptjs')
+
+const { User } = require('../models')
+
+passport.use(new LocalStrategy(
+  {
+    usernameField: 'account',
+    passwordField: 'password',
+    passReqToCallback: true
+  },
+  (req, account, password, cb) => {
+    User.findOne({ where: { account } })
+      .then(user => {
+        if (!user) return cb(null, false, req.flash('account_messages', '帳號不存在！'))
+        bcrypt.compare(password, user.password).then(res => {
+          if (!res) return cb(null, false, req.flash('account_messages', '帳號或密碼輸入錯誤！'))
+          return cb(null, user)
+        })
+      })
+  }
+))
+
+passport.serializeUser((user, cb) => {
+  cb(null, user.id)
+})
+
+passport.deserializeUser((id, cb) => {
+  User.findByPk(id)
+    .then(user => cb(null, user.toJSON()))
+    .catch(err => cb(err))
+})
+
+module.exports = passport

controllers/admin-controller.js

@@ -0,0 +1,75 @@
+const { sequelize, Tweet, User, Like, Reply } = require('../models')
+
+const adminController = {
+  signinPage: (req, res) => {
+    res.render('admin/signin')
+  },
+  signin: (req, res) => {
+    if (req.user.role === 'user') {
+      req.flash('account_messages', '帳號不存在！')
+      res.redirect('/admin/signin')
+    }
+    req.flash('success_messages', '登入成功')
+    res.redirect('/admin/tweets')
+  },
+  getTweets: (req, res) => {
+    Tweet.findAll({
+      include: [
+        User,
+        Like,
+        Reply
+      ]
+    })
+      .then(Tweets => {
+        const data = Tweets.map(tweet => {
+          const newItem = tweet.toJSON();
+          newItem.description = newItem.description.substring(0, 50)
+          newItem.LikeCount = newItem.Likes.length;
+          newItem.ReplyCount = newItem.Replies.length;
+          return newItem;
+        });
+        res.render('admin/tweets', { tweets: data })
+      })
+  },
+  deleteTweet: (req, res) => {
+    const { tweetId } = req.params
+    Tweet.findByPk(tweetId)
+      .then(tweet => {
+        if (!tweet) {
+          console.log('tweet不存在')
+          res.redirect('back')
+        }
+        req.flash("success_messages", "刪除成功！");
+        return tweet.destroy()
+      })
+      .then(() => res.redirect('/admin/tweets'))
+  },
+  getUsers: (req, res) => {
+    User.findAll({
+      include: [
+        { model: Tweet, include: Like },
+        { model: User, as: 'Followers' },
+        { model: User, as: 'Followings' }
+      ],
+      order: [
+        [sequelize.literal('(SELECT COUNT(*) FROM Tweets WHERE Tweets.UserId = User.id)'), 'DESC']
+      ],
+      where: { role: 'user' }
+    })
+      .then(users => {
+        const data = users.map(user => {
+          const newUser = user.toJSON()
+          newUser.likeCount = newUser.Tweets.reduce((totalLikes, tweet) => {
+            return totalLikes + tweet.Likes.length;
+          }, 0)
+          newUser.tweetCount = newUser.Tweets.length
+          newUser.followingCount = newUser.Followings.length
+          newUser.followerCount = newUser.Followers.length
+          return newUser
+        })
+        res.render('admin/users', { users: data })
+      })
+  }
+}
+
+module.exports = adminController

controllers/api-controller.js

@@ -0,0 +1,70 @@
+const { User } = require('../models')
+const helpers = require('../_helpers')
+const { imgurFileHandler } = require('../helpers/file-helpers')
+
+  const apiController = {
+    getUser: async (req, res, next) => {
+      try {
+        const currentUser = helpers.getUser(req)
+        const UserId = req.params.id
+        const user = await User.findOne({
+          where: { id: UserId }
+        })
+        if (currentUser.id !== user.id) throw new Error('無法觀看編輯其他使用者資料！')
+
+        res.json(user.toJSON())
+      } catch (err) {
+        req.flash('error_messages', err.message)
+        res.json({ status: 'error', message: err.message });
+        next(err)
+      }
+    },
+    putUser: async (req, res, next) => {
+      try {
+        const logInUserId = helpers.getUser(req).id
+        const UserId = req.params.id
+        const { name } = req.body
+        const introduction = req.body.introduction || ''
+        const avatar = req.files ? req.files.avatar : ''
+        const background = req.files ? req.files.background : ''
+
+        let uploadAvatar = ''
+        let uploadBackground = ''
+        if (avatar) {
+          uploadAvatar = await imgurFileHandler(avatar[0])
+        }
+        if (background) {
+          uploadBackground = await imgurFileHandler(background[0])
+        }
+        const user = await User.findByPk(UserId)
+        if (!name) throw new Error('name不可空白')
+        if (name?.length > 50) throw new Error('name字數超出上限')
+        if (introduction?.length > 160) throw new Error('introduction字數超出上限')
+        if (user.id !== logInUserId) throw new Error('無法編輯別人的頁面')
+
+        const data = await user.update({
+          name,
+          introduction,
+          avatar: uploadAvatar || user.avatar,
+          background: uploadBackground || user.background
+        })
+        res.json({ status: 'success', message: '已成功更新!', data })
+      } catch (err) {
+        req.flash('error_messages', err.message)
+        res.json({ status: 'error', message: err.message });
+        next(err)
+      }
+    },
+    uploadImage: async (req, res) => {
+      const { files } = req
+      const uploadBackground = await imgurFileHandler(files?.background?.[0])
+      const uploadAvatar = await imgurFileHandler(files?.avatar?.[0])
+      res.json({ uploadBackground, uploadAvatar })
+    },
+    deleteImage: async (req, res) => {
+      const uploadBackground = helpers.getUser(req).background || DEFAULT_BACKGROUND
+      res.json({ uploadBackground })
+    }
+}
+
+module.exports = apiController