D0man · mzastue · Jan 14, 2019 · Jan 17, 2019 · Jan 17, 2019 · Jan 17, 2019
diff --git a/.gitignore b/.gitignore
@@ -1 +1,2 @@
-.history
+.cache/
+.env
diff --git a/README.md b/README.md
@@ -1,31 +1,42 @@
 # Academy
 Projekty wykonywane przez społeczność discorda
-[helloroman](https://discordapp.com/invite/VTyJc9N)  
+[helloroman](https://discordapp.com/invite/VTyJc9N)
 Projekt jest we wczesnej fazie i obecne challenge sa testowe. Wszelkie sugestie propozycje pomocy mile widziane.
 
 ## Challenge #1 - Landing Page
-Celem wyzwania jest wykonanie warstwy frontendowej Landing Page, zbierającego adressy e-mail osób zainteresowanych udziałem w akademii.  
-Stack Technologiczny do wykonania zadania to html/css/js bez zadnych frameworkow, preprocesorow.  
-Rozwiązanie powinno dzialać na: 
+Celem wyzwania jest wykonanie warstwy frontendowej Landing Page, zbierającego adressy e-mail osób zainteresowanych udziałem w akademii.
+Stack Technologiczny do wykonania zadania to html/css/js bez zadnych frameworkow, preprocesorow.
+Rozwiązanie powinno dzialać na:
 * Chrome 58+
 * Edge  16+
 * Safari 10.1+
 * Firefox 54+
-Przycisk do wysyania formularza powinien mieć ID: LandingEmail  
-Wykonane zadanie należy przesylac jako pull request na branch develop.  
-Zwrocie uwagę na sematyke html i accessibility.  
+Przycisk do wysyania formularza powinien mieć ID: LandingEmail
+Wykonane zadanie należy przesylac jako pull request na branch develop.
+Zwrocie uwagę na sematyke html i accessibility.
 
 ### Grafiki
-[Project.pdf](/assets/Layout.pdf.pdf})  
-[Figma](https://www.figma.com/file/gCTf2Ux96ETR0DMxr6T2m039/LandingPage?node-id=1%3A13)  
-[Zeppelin](https://zpl.io/boKzeQv)  
+[Project.pdf](/assets/Layout.pdf.pdf})
+[Figma](https://www.figma.com/file/gCTf2Ux96ETR0DMxr6T2m039/LandingPage?node-id=1%3A13)
+[Zeppelin](https://zpl.io/boKzeQv)
 <sub> Marginesy mogą się trochę nie zgadzać dopiero się uczę figmy</sub>
-#### Bonus challenge 
+#### Bonus challenge
 * Wykonaj zadanie bez użycia javascriptu
 * Stwórz warstwe backendowa(dowolny język) lub podepnij się do firebase
-### Termin 
-Wstępny czas na wykonanie challenga 21.01.2019  
-  
-  
+### Termin
+Wstępny czas na wykonanie challenga 21.01.2019
+
+
 
 Jak ktoś ma ochotę zrobić lepszy readme, to niech to zrobi :D
+
+### Struktura
+Podzieliłem projekt na:
+* backend
+* frontend
+* server
+
+Dlaczego? Poniewaz, kazda z tych czesci projektu mozna reuzyc. Przykladowo warstwa frontendu. To jest tylko jedna strona z jakims formularzem i wyslaniem danych tego formularza w jakies miejsce.
+Dlatego doszedl <b>serwer</b>, ktory obsluguje dane przychodzace z tego formularza i gdzies je zapisuje.
+Dodatkowo jest <b>backend</b>, ktory ma byc panelem admina. On rowniez nie musi byc na tej samej domenie co frontend i serwer. Rownie dobrze nigdzie nie musi byc serwowany, bo admin moze miec to narzedzie po prostu lokalnie.
+
diff --git a/assets/Layout.pdf b/assets/Layout.pdf
diff --git a/assets/Thumbs.db b/assets/Thumbs.db
diff --git a/assets/coming-soon-ribbon.png b/assets/coming-soon-ribbon.png
diff --git a/backend/.env.example b/backend/.env.example
@@ -0,0 +1 @@
+API_URL=
diff --git a/backend/.firebaserc b/backend/.firebaserc
@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "EmailSubscriptionsBackend": "domanchallange1backend"
+  }
+}
diff --git a/backend/.gitignore b/backend/.gitignore
@@ -0,0 +1,5 @@
+node_modules/
+.env
+dist/
+.cache/
+.firebase/
diff --git a/backend/README.md b/backend/README.md
@@ -0,0 +1,11 @@
+# Subscribers - backend
+
+Strona panelu administratora.
+
+### Uzyte narzedzia
+* [VueJs](https://github.com/vuejs/vue) - w sumie moglby byc VanillaJs - ale to zadanie bylo potraktowane jako dodatkowe, wiec tak bylo szybciej.
+* [axios](https://github.com/axios/axios) - paczka do requestow HTTP
+
+
+### Demo
+https://domanchallange1backend.firebaseapp.com/
diff --git a/backend/firebase.json b/backend/firebase.json
@@ -0,0 +1,10 @@
+{
+  "hosting": {
+    "public": "dist",
+    "ignore": [
+      "firebase.json",
+      "**/.*",
+      "**/node_modules/**"
+    ]
+  }
+}
diff --git a/backend/index.html b/backend/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>Backend</title>
+</head>
+<body>
+  <div id="app"></div>
+  <script src="index.js"></script>
+</body>
+</html>
diff --git a/backend/index.js b/backend/index.js
@@ -0,0 +1,4 @@
+import dotenv from 'dotenv';
+dotenv.config();
+
+require('./src/index');
diff --git a/backend/package.json b/backend/package.json
@@ -0,0 +1,23 @@
+{
+  "name": "doman_challange_01_backend",
+  "version": "1.0.0",
+  "main": "index.js",
+  "author": "hello@mateuszlittwin.pl",
+  "license": "MIT",
+  "scripts": {
+    "parcel:dev": "parcel -p 1235 index.html",
+    "parcel:prod": "parcel build index.html --out-dir dist"
+  },
+  "dependencies": {
+    "axios": "^0.18.0",
+    "dotenv": "^6.2.0",
+    "vue": "^2.5.22",
+    "vue-hot-reload-api": "^2.3.1"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.2.2",
+    "@vue/component-compiler-utils": "^2.5.0",
+    "cssnano": "^4.1.8",
+    "vue-template-compiler": "^2.5.22"
+  }
+}
diff --git a/backend/src/components/App.vue b/backend/src/components/App.vue
@@ -0,0 +1,43 @@
+<template>
+  <div>
+    List of subscribers:
+    <WithLoading :isLoading="isLoading">
+      <ul>
+        <li v-for="email in emails" :key="email.id">
+          {{ email.data }}
+        </li>
+      </ul>
+    </WithLoading>
+  </div>
+</template>
+
+<script>
+import axios from "axios";
+import WithLoading from './WithLoading';
+
+export default {
+  name: "BackendApp",
+
+  components: {
+    WithLoading,
+  },
+
+  data () {
+    return {
+      emails: [],
+      isLoading: false,
+    };
+  },
+
+  mounted() {
+    this.isLoading = true;
+    axios
+      .get(`${process.env.API_URL}/getEmails`)
+      .then(response => {
+        this.emails = response.data.emails;
+        this.isLoading = false;
+      });
+  }
+};
+</script>
+
diff --git a/backend/src/components/WithLoading.vue b/backend/src/components/WithLoading.vue
@@ -0,0 +1,21 @@
+<template>
+  <div class="with-loading">
+    <slot v-if="!isLoading"></slot>
+    <div v-else>Loading..</div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    isLoading: {
+      type: Boolean,
+      default: false,
+    },
+  }
+}
+</script>
+
+<style>
+
+</style>
diff --git a/backend/src/index.js b/backend/src/index.js
@@ -0,0 +1,7 @@
+import Vue from 'vue';
+import App from './components/App.vue';
+
+new Vue({
+  el: '#app',
+  render: h => h(App),
+})