diff --git a/README.md b/README.md
index 418c488..24f3986 100644
--- a/README.md
+++ b/README.md
@@ -1,59 +1,30 @@
-# A Passion Project
-by Jianming Tu
+# Paws Lost and Found
+by Jianming Tu https://eloquent-archimedes-c44224.netlify.app
+## Description
+This is a web app for finding the lost pets or the owner who lost pets. The app provides the user authentication and authorization for creating a post of lost or find; provides a searching engine for easily narrowing down the need.
-## Overview
-The goal of the Passion Project module is to provide each student with an opportunity to individually explore and expand their abilities within a hands-on project-based setting.
+## Tech Stack
+ use react, express and mongodb, deploying on netlify(front end app), Heroku(Node express) and mongoDB altas and save the images on AWS s3 bucket, using React, Bootstrap, Material-ui, font-awesome
-The student will perform all roles including:
-* Product Owner
-* Product Designer/Planner
-* Project Manager
-* Designer
-* Dev Ops
-* Developer
+## Deployed on Netlify
+ https://eloquent-archimedes-c44224.netlify.app/
-Students are encouraged to work independantly (or in small groups of 2 or 3 if there is a shared passion).
+## Deployed on Heroku
+ https://fathomless-lake-61399.herokuapp.com/api
-Students are able to use the tech stack of their choice.
-
-## Outcomes
-Leading up to this point in our program you were asked to plan, design, and start to develop a product of your choosing. Given your increased experience with web and mobile technologies, you will be provided with class time to perform the tasks necessary to result in the following:
-
-* A deployed main branch of any web based project assets.
-* A clearly defined document with installation instructions as well as links and descriptions for all project assets.
-* A project board that shows all of your build activitites (GitHub Project, Trello, etc.)
-* A 5 minute presentation of the primary use cases for your application.
-
-## Process
-* Review your original product plan and design.
-* Make changes to your plan/design where necessary to ensure that you can have a completed product for the Passion project demo day.
-* Set specific milestones for your project, this will help to ensure that primary use cases are built in priority sequence and functional to a required minimum. (Not all milestones need to be completed...)
-* All commits are to be done on a branch other than main and connected to a GitHub "issue". If working alone you can review and merge your own pull requests.
-
-## Essential Features
-These are really based on the design of your application and up to you...The only requirements are that each application has:
-* some form persistant data that requires a database
-* an implementation of a user interface that appropriately ties the app to the persisted data.
-
-All other features should be included on an as needed basis for your application.
-
-## Due Date and Grading
-Presentations will take place 1pm-4pm PST April 16th, 2021.
-
-The due date for graded code to be on GitHub is 11:59pm April 18th, 2021.
-
-The passion project accounts for 20% of your SSDP5001 mark.
+## App Layers
+client - React (Netlify)
+server - Express (Heroku)
+database -MongoDB
-**SSDP5001 Weighting**
-* Career Success Series (13.33%)
-* Passion Project (20%)
-* Industry Project (66.67%)
+## Server Installation
+https://github.com/BCIT-SSD-2020-21/passion-project-jianmingtu/tree/main/client
+## Server Installattion
+https://github.com/BCIT-SSD-2020-21/passion-project-jianmingtu/tree/main/server
-## App Layer
-client - React (Netlify)
+## User Experience
+![](https://i.imgur.com/sW2ter8.png)
+![](https://i.imgur.com/88agZx5.png)
-server - Express (Heroku)
-
-database -MongoDB
diff --git a/client/README.md b/client/README.md
index 02aac3f..b819cab 100644
--- a/client/README.md
+++ b/client/README.md
@@ -1,4 +1,4 @@
-# Getting Started with Create React App
+# Client Side Install, Debug and Deployment
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
@@ -68,3 +68,7 @@ This section has moved here: [https://facebook.github.io/create-react-app/docs/d
### `yarn build` fails to minify
This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)
+
+## Debug
+ NPM start -> Copy URL
+ CTRL+SHIFT+D -> Select Debug URL -> Paste the copied URL -> it will run to debugging breakpoints
diff --git a/client/public/favicon.ico b/client/public/favicon.ico
index a11777c..8aabd6a 100644
Binary files a/client/public/favicon.ico and b/client/public/favicon.ico differ
diff --git a/client/src/assets/logo.png b/client/src/assets/logo.png
index 06a14d7..1425b6e 100644
Binary files a/client/src/assets/logo.png and b/client/src/assets/logo.png differ
diff --git a/client/src/components/navbar/Navbar.js b/client/src/components/navbar/Navbar.js
index ee2b2a4..a417fbc 100644
--- a/client/src/components/navbar/Navbar.js
+++ b/client/src/components/navbar/Navbar.js
@@ -8,20 +8,22 @@ const Navbar = ({ sidebarOpen, openSidebar, user }) => {
Search Paws
diff --git a/client/src/index.css b/client/src/index.css
index 3400051..d6b494d 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -64,7 +64,7 @@ body {
background-color: #E5E5E5;
display: grid;
min-height: 100vh;
- grid-template-columns: 0.7fr 1fr 1fr 1fr;
+ grid-template-columns: 0.6fr 1fr 1fr 1fr;
grid-template-rows: 0.2fr 3fr;
grid-template-areas:
"sidebar nav nav nav"
diff --git a/client/src/network.js b/client/src/network.js
index 7c16458..c025bd5 100644
--- a/client/src/network.js
+++ b/client/src/network.js
@@ -9,8 +9,8 @@ import { upload } from './s3'
// export async function getPost({postId})
// export async function savePost({type, imageUrl, description})
-// const BASE_API = "https://fathomless-lake-61399.herokuapp.com/api"
-const BASE_API = "http://localhost:5000/api"
+const BASE_API = "https://fathomless-lake-61399.herokuapp.com/api"
+// const BASE_API = "http://localhost:5000/api"
// Create an object to send it as a bearer token
const authHeader = () => { return { Authorization: `Bearer ${localStorage.getItem('token')}` }}
diff --git a/server/README.md b/server/README.md
index 946f914..2e8ad77 100644
--- a/server/README.md
+++ b/server/README.md
@@ -1,62 +1,13 @@
-# server
-
-## Overview
-The goal of the Passion Project module is to provide each student with an opportunity to individually explore and expand their abilities within a hands-on project-based setting.
-
-The student will perform all roles including:
-* Product Owner
-* Product Designer/Planner
-* Project Manager
-* Designer
-* Dev Ops
-* Developer
-
-Students are encouraged to work independantly (or in small groups of 2 or 3 if there is a shared passion).
-
-Students are able to use the tech stack of their choice.
-
-## Outcomes
-Leading up to this point in our program you were asked to plan, design, and start to develop a product of your choosing. Given your increased experience with web and mobile technologies, you will be provided with class time to perform the tasks necessary to result in the following:
-
-* A deployed main branch of any web based project assets.
-* A clearly defined document with installation instructions as well as links and descriptions for all project assets.
-* A project board that shows all of your build activitites (GitHub Project, Trello, etc.)
-* A 5 minute presentation of the primary use cases for your application.
-
-## Process
-* Review your original product plan and design.
-* Make changes to your plan/design where necessary to ensure that you can have a completed product for the Passion project demo day.
-* Set specific milestones for your project, this will help to ensure that primary use cases are built in priority sequence and functional to a required minimum. (Not all milestones need to be completed...)
-* All commits are to be done on a branch other than main and connected to a GitHub "issue". If working alone you can review and merge your own pull requests.
-
-## Essential Features
-These are really based on the design of your application and up to you...The only requirements are that each application has:
-* some form persistant data that requires a database
-* an implementation of a user interface that appropriately ties the app to the persisted data.
-
-All other features should be included on an as needed basis for your application.
-
-## Due Date and Grading
-Presentations will take place 1pm-4pm PST April 16th, 2021.
-
-The due date for graded code to be on GitHub is 11:59pm April 18th, 2021.
-
-The passion project accounts for 20% of your SSDP5001 mark.
-
-**SSDP5001 Weighting**
-* Career Success Series (13.33%)
-* Passion Project (20%)
-* Industry Project (66.67%)
-
+# Server Side Install, Debug and Deployment
## Server Layer
-server - Express (Heroku)
+server - Express (Heroku)
database -MongoDB
- Install
npm init
npm install -g nodemon
npm i pstree.remy@1.1.0 -D
- npm i express morgan body-parser dotenv mongodb bcryptjs jsonwebtoken
+ npm i express morgan body-parser dotenv mongodb bcryptjs jsonwebtoken
- create server.js, etc.
- deploy
heroku login
@@ -79,17 +30,19 @@ database -MongoDB
add "start": "node server.js" to package.json
git add .
git commit -m "change xxx"
- git subtree push --prefix server heroku master (build https://fathomless-lake-61399.herokuapp.com)
+ git subtree push --prefix server heroku master (build https://fathomless-lake-61399.herokuapp.com) => push to Heroku Github
git branch --show-current
- git push origin 1ServerSetup
+ git push origin 1ServerSetup => My Personal GitHub
https://blog.logrocket.com/5-ways-to-make-http-requests-in-node-js/
-- 5 ways of http requests and I choose the most popular axios
-## debug on the express
+## Debug on the local Express
run code . the server folder
- click on the `run and debug`
- select Node from the list
- go to the breakpoint and will get the debug interrupt
+ CTRL+SHIFT+D -> Select 'Run and Debug' -> Choose Node.js -> It will run into breakpoints
+
+## Debug on Heroku (the CLI will keep an alive logging)
+ heroku login
+ heroku logs --app=fathomless-lake-61399 --tail
diff --git a/server/server.js b/server/server.js
index f482453..2aa534f 100644
--- a/server/server.js
+++ b/server/server.js
@@ -28,7 +28,7 @@ mongoDatabase().then(database => {
})
-const port = process.env.PORT | 5000
+const port = process.env.PORT
app.listen(port, () => {
console.log(`listening on port ${port}`)
})
\ No newline at end of file