Skip to content

Commit 89b9ef4

Browse files
enricodeleoenricodeleo
committed
feature: new pages
1 parent adfe5cc commit 89b9ef4

File tree

11 files changed

+146
-20
lines changed

11 files changed

+146
-20
lines changed

‎blog/.babelrc‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
{
22
"presets": [
3-
"env"
4-
]
3+
[
4+
"env",
5+
{
6+
"targets": {
7+
"browsers": "last 1 chrome versions"
8+
}
9+
}
10+
]
11+
],
512
}

‎blog/.nvmrc‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎blog/credits.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# Credits
2+
3+
* Background Created by Quinky - Freepik.com https://www.freepik.com/free-photos-vectors/background
4+
* UI by Enrico Deleo https://enricodeleo.com

‎blog/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33

44
<head>
55
<meta charset="utf-8">
6-
<title>Parceljs Starter</title>
6+
<title>My Blog</title>
77
</head>
88

99
<body>

‎blog/package-lock.json‎

Lines changed: 6 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎blog/package.json‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
{
2-
"name": "blog",
2+
"name": "todo-list",
33
"version": "1.0.0",
4-
"description": "A simple blog powered by Vue",
4+
"description": "A simple todo list powered by Vue",
55
"main": "index.html",
66
"author": "Enrico Deleo <hello@enricodeleo.com>",
77
"license": "UNLICENSED",
88
"scripts": {
9-
"dev": "parcel watch index.html"
9+
"dev": "parcel index.html"
1010
},
1111
"devDependencies": {
1212
"@vue/component-compiler-utils": "^2.3.0",
@@ -19,6 +19,7 @@
1919
},
2020
"dependencies": {
2121
"milligram": "^1.3.0",
22-
"vue": "^2.5.17"
22+
"vue": "^2.5.17",
23+
"vue-router": "^3.0.2"
2324
}
2425
}

‎blog/src/App.vue‎

Lines changed: 64 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,81 @@
1+
// App.vue
12
<template>
2-
<div id="app-template">
3-
<h1>{{ message }}</h1>
3+
<div>
4+
<header class="header-main">
5+
<div class="row">
6+
<div class="column text-center">
7+
<h2 class="no-margin"><strong>My Blog</strong></h2>
8+
</div>
9+
</div>
10+
</header>
11+
<div class="container">
12+
<!-- component matched by the route will render here -->
13+
<router-view></router-view>
14+
</div>
15+
<footer class="footer-main">
16+
<div class="row">
17+
<div class="column text-center">
18+
<p class="no-margin">&copy; Copyleft {{ new Date().toLocaleString('it-IT', { year: 'numeric' }) }} Enrico Deleo</p>
19+
</div>
20+
</div>
21+
</footer>
422
</div>
523
</template>
624

725
<script>
826
export default {
927
name: 'app',
10-
data () {
11-
return {
12-
message: 'Hello World!'
13-
}
14-
}
1528
}
1629
</script>
1730

1831
<style lang="scss">
32+
$color-secondary: #9c9c9c;
1933
2034
@import '../node_modules/milligram/src/milligram.sass';
35+
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
2136
37+
html,
38+
body {
39+
width: 100%;
40+
height: 100%;
41+
min-height: 100%;
42+
padding: 0;
43+
margin: 0;
44+
background-color: #f8f9f9;
45+
}
2246
23-
#app-template {
24-
background-color: #ed68a1;
47+
body {
48+
font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2549
}
50+
51+
.text-left {
52+
text-align: left;
53+
}
54+
55+
.text-center {
56+
text-align: center;
57+
}
58+
59+
.text-right {
60+
text-align: right;
61+
}
62+
63+
.text-medium {
64+
font-weight: 500;
65+
}
66+
67+
.text-white {
68+
color: #ffffff;
69+
}
70+
71+
.no-margin {
72+
margin: 0;
73+
}
74+
75+
.footer-main,
76+
.header-main {
77+
background: white;
78+
padding: 1rem 0;
79+
}
80+
2681
</style>

‎blog/src/main.js‎

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,30 @@
1+
// main.js
12
import Vue from 'vue';
23
import App from './App.vue';
4+
import VueRouter from 'vue-router';
5+
6+
import IndexPage from './pages/Index';
7+
import SinglePage from './pages/Single';
8+
9+
const router = new VueRouter({
10+
routes: [
11+
{
12+
path: '/',
13+
name: 'index',
14+
component: IndexPage,
15+
},
16+
{
17+
path: '/article/:id',
18+
name: 'single',
19+
component: SinglePage,
20+
},
21+
]
22+
});
23+
24+
Vue.use(VueRouter);
325

426
new Vue({
527
el: '#app',
6-
render: h => h(App)
28+
render: h => h(App),
29+
router,
730
});

‎blog/src/pages/Index.vue‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<template>
2+
<div class="container">
3+
Index
4+
</div>
5+
</template>
6+
7+
<script>
8+
export default {
9+
name: 'IndexPage',
10+
11+
data() {
12+
return {
13+
posts: [],
14+
};
15+
},
16+
17+
async mounted() {
18+
const posts = await fetch('https://jsonplaceholder.typicode.com/posts');
19+
},
20+
}
21+
</script>

‎blog/src/pages/Single.vue‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<template>
2+
<div class="container">
3+
Single
4+
</div>
5+
</template>
6+
7+
<script>
8+
export default {
9+
name: 'SinglePage',
10+
}
11+
</script>

0 commit comments

Comments
 (0)