Le support aux utilisateurs et les demandes de création de comptes externes doivent être faites depuis les issues du projet GitLab HEFR (https://gitlab.forge.hefr.ch/forge-hefr/gitlab-hefr)

Commit f4275c5e authored by acknowledge's avatar acknowledge
Browse files

Init practical work

parents
SI-II - TP Docker
=================
Container Flask
---------------
Build the image for the Flask API and run it.
cd api/
docker build -t flask-api .
docker run -p 5000:5000 flask-api
Then go to `http://localhost:5000` to see if the API works.
If you just want to run the Flask API locally:
cd api/
virtualenv -p /usr/bin/python3.x venv
source venv/bin/activate
pip install -r requirements.txt
python app.py
deactivate
Container Paper-Dashboard in VueJS
----------------------------------
Build and run the image.
cd interface/
docker build -t paper-dashboard .
docker run -p 8080:8080 paper-dashboard
Then go to `http://localhost:8080` to see if the website works.
If you want to run the interface locally:
cd interface/
npm install
npm run dev
NB: a HTTP request is made in file `src/pages/Dashboard.vue` to `http://localhost:5000/data` to load the data from the API.
Docker-compose
--------------
Run the two containers
docker-compose up
See the [documentation of docker-compose](https://docs.docker.com/compose) if needed.
\ No newline at end of file
venv/
.DS_Store
# Source image is a Linux with Python 3.7 installed
FROM python:3.7.1
# Set the working directory to /app
WORKDIR /app
# Copy the current directory contents into the container at /app
COPY . /app
# TODO: Install the dependencies specified in requirements.txt
HERE
# TODO: Make port 5000 available to the world outside this container
HERE
# TODO: Run app.py when the container launches
HERE
\ No newline at end of file
from flask import Flask, jsonify
from flask_cors import CORS
import sys
app = Flask(__name__)
cors = CORS(app)
@app.route('/')
def hello():
return "Hey mate!"
@app.route('/about')
def about():
data = {
"about": "Looks like it works",
"python version": sys.version
}
return jsonify(data)
@app.route('/data')
def get_data():
data = {
"people": [
{
"firstname": "Jacky",
"lastname": "Casas",
"number": 42,
"icon": "ti-crown",
"type": "info"
},
{
"firstname": "Nadine",
"lastname": "Grossrieder",
"number": 3342,
"icon": "ti-crown",
"type": "danger"
},
{
"firstname": "Leonardo",
"lastname": "Angelini",
"number": 9393,
"icon": "ti-crown",
"type": "success"
},
{
"firstname": "Omar",
"lastname": "Abou Khaled",
"number": 444,
"icon": "ti-crown",
"type": "warning"
}
]
}
return jsonify(data)
if __name__ == '__main__':
app.run(host='0.0.0.0', port=5000)
\ No newline at end of file
Click==7.0
Flask==1.0.2
Flask-Cors==3.0.7
itsdangerous==1.1.0
Jinja2==2.10
MarkupSafe==1.1.0
six==1.11.0
Werkzeug==0.14.1
version: '3'
services:
api:
# 1) utilise l'image 'flask-api' déjà buildée:
image: flask-api
# 2) build directemetn l'image dans le dossier 'api/'
#build:
# TODO
ports:
- "5000:5000"
interface:
image: paper-dashboard
# TODO
ports:
- "8080:8080"
links:
- api
\ No newline at end of file
{
"presets": [
"@vue/app"
]
}
\ No newline at end of file
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
{
"root": true,
"extends": [
"plugin:vue/essential",
"@vue/prettier"
]
}
\ No newline at end of file
# Auto detect text files and perform LF normalization
*.scss linguist-language=Vue
*.css linguist-language=Vue
# Standard to msysgit
*.doc diff=astextplain
*.DOC diff=astextplain
*.docx diff=astextplain
*.DOCX diff=astextplain
*.dot diff=astextplain
*.DOT diff=astextplain
*.pdf diff=astextplain
*.PDF diff=astextplain
*.rtf diff=astextplain
*.RTF diff=astextplain
.DS_Store
node_modules/
npm-debug.log
.idea/
dist/
# Image based on nodejs version 10
FROM node:10
# Install static http server
RUN npm install -g http-server
# Define the working directory as '/app'
WORKDIR /app
# Copy 'package.json' and 'package-lock.json' to the container
COPY package*.json ./
# TODO: Install the node dependencies
HERE
# TODO: Copy the files and folder to the working directory
HERE
# Build the app for production (will be in folder 'dist/')
RUN npm run build
# TODO: The port 8080 will be available outside from the container
HERE
# Run the server
CMD [ "http-server", "dist" ]
\ No newline at end of file
# [Vue Paper Dashboard](https://cristijora.github.io/vue-paper-dashboard/)
> Admin dashboard based on paper dashboard UI template + vue-router
This project is a vue version of [Paper-dashboard](https://www.creative-tim.com/product/paper-dashboard)
designed for vue js.The dashboard includes vue-router
Check the [Live Demo here](https://cristijora.github.io/vue-paper-dashboard).
[Nuxt Version (outdated Bootstrap 3)](https://github.com/cristijora/vue-paper-dashboard-nuxt)
![](http://i.imgur.com/3iC1hOs.gif)
## Documentation
Link to [Documentation](http://vuejs.creative-tim.com/vue-paper-dashboard/documentation/)
## Build Setup
### install dependencies
```
npm install
```
### serve with hot reload at localhost:8080
```
npm run dev
```
### build for production with minification
```
npm run build
```
### lint
```
npm run lint
```
## Contribution guide
* Fork the repository
* `npm install` or `yarn install`
* Make changes
* Open Pull Request
For detailed explanation on how things work, checkout the [guide](https://github.com/vuejs/vue-cli/blob/dev/docs/README.md)
- [CHANGELOG](./CHANGELOG.md)
- [version-badge](https://img.shields.io/badge/version-2.0.0-blue.svg)
- [license-badge](https://img.shields.io/badge/license-MIT-blue.svg)
## License
[MIT](https://github.com/cristijora/vue-paper-dashboard/blob/master/LICENSE.md)
This diff is collapsed.
{
"name": "vue-paper-dashboard",
"version": "1.0.0",
"private": true,
"scripts": {
"build": "vue-cli-service build",
"e2e": "node test/e2e/runner.js",
"lint": "vue-cli-service lint",
"lint-fix": "vue-cli-service lint --fix",
"dev": "vue-cli-service serve --open"
},
"dependencies": {
"bootstrap": "^4.0.0",
"chartist": "^0.11.0",
"es6-promise": "^4.2.4",
"vue": "^2.5.13",
"vue-clickaway": "^2.1.0",
"vue-notifyjs": "^0.3.0",
"vue-resource": "^1.5.1",
"vue-router": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.0.0-beta.9",
"@vue/cli-plugin-eslint": "^3.0.0-beta.9",
"@vue/cli-service": "^3.0.0-beta.9",
"@vue/eslint-config-prettier": "^3.0.0-beta.9",
"node-sass": "^4.8.3",
"sass-loader": "^6.0.7",
"vue-template-compiler": "^2.5.17"
},
"description": "A sample admin dashboard based on paper dashboard UI template",
"author": "cristian.jora <joracristi@gmail.com>",
"engines": {
"node": ">= 8.1.4",
"npm": ">= 5.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="icon" type="image/png" sizes="96x96" href="<%= webpackConfig.output.publicPath %>favicon.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Vue Paper Dashboard</title>
<!-- Bootstrap core CSS -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<!-- Fonts and icons -->
<link type="text/css" href="https://fonts.googleapis.com/css?family=Muli:400,300" rel="stylesheet">
<link type="text/css" href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
<body>
<div class="wrapper" id="app">
</div>
<!-- built files will be auto injected -->
<!-- Google Maps Plugin -->
<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzaSyAamVCoyQ4AuvBpxVRMs9P-HFkfPVQj0Kw" type="text/javascript"></script>
</body>
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment