1
0
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:
ebosas
2021-06-02 12:38:11 +03:00
parent c44f98fac4
commit 75f6da97f5
9 changed files with 58 additions and 19 deletions

4
.env
View File

@ -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

View File

@ -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
View 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>

View File

@ -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": [],

View File

@ -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"),

View File

@ -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": "",

View File

@ -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);

View File

@ -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')
);

View File

@ -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>