You've already forked microservices
mirror of
https://github.com/ebosas/microservices.git
synced 2025-06-30 22:33:51 +02:00
updates to readme, frontend
This commit is contained in:
4
.env
4
.env
@ -2,10 +2,10 @@
|
||||
# Add this file to .gitignore when using secret data
|
||||
|
||||
# Docker Compose environment
|
||||
POSTGRES_PASSWORD = demopsw
|
||||
POSTGRES_PASSWORD = postgres
|
||||
|
||||
# Connection strings
|
||||
POSTGRES_URL = postgres://postgres:demopsw@postgres:5432/microservices
|
||||
POSTGRES_URL = postgres://postgres:postgres@postgres:5432/microservices
|
||||
RABBIT_URL = amqp://guest:guest@rabbitmq:5672
|
||||
SERVER_ADDR = 0.0.0.0:8080
|
||||
|
||||
|
@ -2,7 +2,7 @@
|
||||
|
||||
A basic example of microservice architecture which demonstrates communication between a few loosely coupled services. This includes messages between a server terminal and a web user interface with a database service in the middle.
|
||||
|
||||
Written in Go, this mainly showcases the exchange of information using RabbitMQ—between backend services—and WebSocket—between frontend and backend.
|
||||
Written in Go, this mainly showcases the exchange of information using RabbitMQ—between back end services—and WebSocket—between front end and back end.
|
||||
|
||||
The services are built using Docker which includes a multistage build example. The whole application is served with Docker Compose.
|
||||
|
||||
@ -28,7 +28,7 @@ docker attach microservices_backend
|
||||
|
||||
### Database
|
||||
|
||||
To inspect the database, launch a new container that will connect to our Postgres database. Then enter the password `demopsw` (see the `.env` file).
|
||||
To inspect the database, launch a new container that will connect to our Postgres database. Then enter the password `postgres` (see the `.env` file).
|
||||
|
||||
```bash
|
||||
docker run -it --rm --network microservices_network postgres:13-alpine psql -h postgres -U postgres
|
||||
@ -40,3 +40,7 @@ Select everything from the messages table:
|
||||
\c microservices
|
||||
select * from messages;
|
||||
```
|
||||
|
||||
### RabbitMQ management
|
||||
|
||||
The RabbitMQ management plugin is accessible by visiting `localhost:15672` with `guest` as both username and password.
|
||||
|
40
bootstrap/index.html
Normal file
40
bootstrap/index.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Microservices</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="build/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="root" class="vh-100">
|
||||
<div class="container position-relative h-75">
|
||||
<div class="position-absolute top-50 start-0 w-100 translate-middle-y">
|
||||
<div class="row">
|
||||
<div class="col col-md-8 col-lg-6 mx-auto">
|
||||
<form>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" placeholder="Enter message" aria-label="Enter message" aria-describedby="button-send" />
|
||||
<button class="btn btn-success" type="submit" id="button-send">Send</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="notifications" class="position-absolute top-0 start-0 w-100">
|
||||
<div class="row">
|
||||
<div class="col col-md-8 col-lg-6 mx-auto mt-5">
|
||||
<div class="alert alert-primary" role="alert">
|
||||
<em>Sent</em>: A message sent to the back end.
|
||||
</div>
|
||||
|
||||
<div class="alert alert-success" role="alert">
|
||||
<em>Received</em>: A message received from the back end.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
@ -5,9 +5,10 @@
|
||||
"scripts": {
|
||||
"css-compile": "sass --load-path node_modules --style compressed --no-source-map -q scss/style.scss:build/style.css",
|
||||
"css-prefix": "postcss --replace build/style.css --use autoprefixer --no-map",
|
||||
"css-purge": "purgecss --keyframes --css build/style.css --content ref/template.html ref/index.js --output css/",
|
||||
"css-purge": "purgecss --keyframes --css build/style.css --content ref/template.html ref/index.js index.html --output css/",
|
||||
"css": "npm run css-compile && npm run css-prefix && npm run css-purge",
|
||||
"css-server": "sass --load-path node_modules -q scss/style.scss:../server/static/style.css",
|
||||
"css-dev": "sass --load-path node_modules -q scss/style.scss:build/style.css",
|
||||
"css-server": "sass --load-path node_modules --no-source-map -q scss/style.scss:../server/static/style.css",
|
||||
"serve": "http-server ./"
|
||||
},
|
||||
"keywords": [],
|
||||
|
@ -17,7 +17,7 @@ type Config struct {
|
||||
func New() *Config {
|
||||
return &Config{
|
||||
ServerAddr: getEnv("SERVER_ADDR", "localhost:8080"),
|
||||
PostgresURL: getEnv("POSTGRES_URL", "postgres://postgres:demopsw@localhost:5432/microservices"),
|
||||
PostgresURL: getEnv("POSTGRES_URL", "postgres://postgres:postgres@localhost:5432/microservices"),
|
||||
RabbitURL: getEnv("RABBIT_URL", "amqp://guest:guest@localhost:5672"),
|
||||
Exchange: getEnv("EXCHANGE", "main_exchange"),
|
||||
QueueBack: getEnv("QUEUE_BACK", "backend_queue"),
|
||||
|
@ -4,7 +4,8 @@
|
||||
"description": "",
|
||||
"scripts": {
|
||||
"build": "node esbuild.js",
|
||||
"build-server": "esbuild src/index.jsx --bundle --sourcemap --outdir=../server/static"
|
||||
"build-server": "esbuild src/index.jsx --bundle --outdir=../server/static",
|
||||
"serve": "esbuild src/index.jsx --outfile=index.js --bundle --sourcemap --serve=8000"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
|
@ -68,7 +68,7 @@ function App(){
|
||||
React.useEffect(() => {
|
||||
clearTimeout(timeout.current);
|
||||
|
||||
timeout.current = setTimeout(() => {setAlerts([])}, 15000);
|
||||
timeout.current = setTimeout(() => {setAlerts([])}, 20000);
|
||||
|
||||
return () => {
|
||||
clearTimeout(timeout.current);
|
||||
|
@ -2,7 +2,7 @@ import * as React from 'react'
|
||||
import * as ReactDOM from 'react-dom'
|
||||
import App from './app';
|
||||
|
||||
ReactDOM.hydrate(
|
||||
ReactDOM.render(
|
||||
<App />,
|
||||
document.getElementById('root')
|
||||
);
|
||||
|
@ -23,19 +23,12 @@
|
||||
</div>
|
||||
<div id="notifications" class="position-absolute top-0 start-0 w-100">
|
||||
<div class="row">
|
||||
<div class="col col-md-8 col-lg-6 mx-auto mt-5">
|
||||
<div class="alert alert-primary" role="alert">
|
||||
A simple primary alert—check it out!
|
||||
</div>
|
||||
|
||||
<div class="alert alert-success" role="alert">
|
||||
A simple success alert—check it out!
|
||||
</div>
|
||||
</div>
|
||||
<div class="col col-md-8 col-lg-6 mx-auto mt-5"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <script src="http://127.0.0.1:8000/index.js"></script> -->
|
||||
<script src="static/index.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
Reference in New Issue
Block a user