-
Notifications
You must be signed in to change notification settings - Fork 1
/
hello.html
67 lines (36 loc) · 3.48 KB
/
hello.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
npm run cypress
sudo apt-get install docker-ce=5:19.03.8~3-0~ubuntu-bionic docker-ce-cli=5:19.03.8~3-0~ubuntu-bionic containerd.io5
psql -h ec2-174-129-33-230.compute-1.amazonaws.com -p 5432 -U odhaiescgyvsej -d d71d6dvvq99sm1
git subtree push --prefix express-back-end heroku master
sudo lsof -t -i:8080
sudo kill -9 <PID>
psql -h localhost -U development fixit_development
ngrok http 3000 -host-header="localhost:3000"
ngrok http 3002 -host-header="localhost:3002"
npx knex seed:run --specific=mechanic.js
npx knex migrate:run --specific=mechanic.js
npx knex migrate:rollback
npx knex migrate:latest
A boilerplate project for anyone interested in making a project that uses React and Express.
This repository is a bootleg of @NimaBoscarino's [React Rails Boilerplate](https://github.com/NimaBoscarino/react-rails-boilerplate). It uses the same React app, but replaces the Rails server with an Express server.
Note! This boilerplate has _no fluff_! That means that there's nothing set up for you to do authentication stuff, there's no Redux stuff, and there's no React Router stuff. On the Express end, there is no session storage or database connection.
The main important bit is that the React project has `proxy` set to `localhost:8080` in the `package.json` file, and that the Express app listens to port 8080 in `server.js`. Take a look!
You can (and perhaps should) rename the directories `express-back-end` and `react-front-end` if you want-- The name doesn't matter.
## Running the projects
You need **TWO** terminal windows/tabs for this (or some other plan for running two Node processes).
In one terminal, `cd` into `react-front-end`. Run `npm install` or `yarn` to install the dependencies. Then run `npm start` or `yarn start`, and go to `localhost:3000` in your browser.
In the other terminal, `cd` into `express-back-end`. Run `npm install` or `yarn` to install the dependencies, then `npm start` or `yarn start` to launch the server.
In the browser, you can click on the button and see the data get loaded.
If this doesn't work, please message me!
## Next steps
From here, you can start working on your project!
As soon as the dependencies are installed, your Express server can serve JSON and static assets (like images) in response to API calls from the React app. You can get started on developing your React app, routing plan, etc. right away! Any request that isn't handled by React is passed on to the Express server. That means that you can call a route like `/api/users` from React using `fetch`, `axios`, or something else, and Express will receive it as though they originated from the same app. For routing, best practice is to namespace all of your data routes to `/api`, so that they don't clash with other routing schemes, like React Router.
At some point, you'll likely want to install and configure a database driver for Postgres or MongoDB-- Refer to past projects for hints on how to do this.
And don't forget to update the README!
## Example Projects
You might want to look at examples of projects that have used this boilerplate for hints on how to extend it. Here are a few:
* [Later Cart](https://github.com/bonitac/later-cart)
* [Buddi.io](https://github.com/Danny-Tran/buddi.io)
If you'd like your project added to the list, please shoot me a message.
## Contact
Please contact me on Slack (@garrettgsb) or Nima at `[email protected]` if you have any questions, requests, or feedback, or post an issue to this repo. If you are using the boilerplate, I'd love to hear from you as well!