rewrite with webpack
This commit is contained in:
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
/node_modules
|
||||||
|
/dist
|
||||||
29
index.html
29
index.html
@@ -1,29 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<title>Vlad Faust</title>
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1" />
|
|
||||||
<link rel="stylesheet" href="stylesheets/style.css">
|
|
||||||
<!-- Yandex.Metrika counter -->
|
|
||||||
<script type="text/javascript"> (function (d, w, c) { (w[c] = w[c] || []).push(function() { try { w.yaCounter33155678 = new Ya.Metrika({ id:33155678, clickmap:true, trackLinks:true, accurateTrackBounce:true, webvisor:true }); } catch(e) { } }); var n = d.getElementsByTagName("script")[0], s = d.createElement("script"), f = function () { n.parentNode.insertBefore(s, n); }; s.type = "text/javascript"; s.async = true; s.src = "https://mc.yandex.ru/metrika/watch.js"; if (w.opera == "[object Opera]") { d.addEventListener("DOMContentLoaded", f, false); } else { f(); } })(document, window, "yandex_metrika_callbacks"); </script> <noscript><div><img src="https://mc.yandex.ru/watch/33155678" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
|
|
||||||
<!-- /Yandex.Metrika counter -->
|
|
||||||
</head>
|
|
||||||
<body class="flex-container">
|
|
||||||
<div class="flex-item">
|
|
||||||
<h1>Hello, my name is Vlad Faust.</h1>
|
|
||||||
<p>I love beautiful code. I have 2 years of <a href="https://www.ruby-lang.org">Ruby</a> experience. I'm a huge fan of <a href="https://crystal-lang.org">Crystal</a>.</p>
|
|
||||||
<h2>My projects:</h2>
|
|
||||||
<div id="projects">
|
|
||||||
<ul>
|
|
||||||
<li><a class="li-title" href="https://cashbackbot.io/48b7a1">Cashback Bot</a> - Save cash on purchases (Ruby);</li>
|
|
||||||
<li><a class="li-title" href="https://t.me/soundmemesbot">Soundmemes Bot</a> - Rickroll your friends (Crystal, <a href="https://github.com/vladfaust/soundmemes.cr">opensource</a>);</li>
|
|
||||||
<li><a class="li-title" href="https://github.com/vladfaust/tele.cr">Tele.cr</a> - Convenient Telegram Bot framework (Crystal, <a href="https://github.com/vladfaust/tele.cr">opensource</a>);</li>
|
|
||||||
<li class="old-project"><a class="li-title" href="https://play.google.com/store/apps/details?id=com.vladislavfaust.jumpinsweeties.android">Jumpin Sweeties</a> - Sweet Android game (Java / libGDX, <a href="https://bitbucket.org/vladfaust/jumpinsweeties">opensource</a>);</li>
|
|
||||||
<li class="old-project"><a class="li-title" href="http://xgm.guru/p/ufs">UFS Arena</a> - Warcraft III custom map (<a href="https://ru.wikipedia.org/wiki/Jass">JASS</a>).</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<p>You can find me in <a href="https://vk.com/vladfaust">VK</a>, <a href="https://t.me/vladfaust">Telegram</a> and <a href="https://github.com/vladfaust">GitHub</a>.<br>I rarely check my inbox: <a href="mailto:mail@vladfaust.com">mail@vladfaust.com</a>.</p>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
31
package.json
Normal file
31
package.json
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
{
|
||||||
|
"name": "vladfaust.github.io",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Vlad Faust's personal page",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"build": "webpack"
|
||||||
|
},
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "git+https://github.com/vladfaust/vladfaust.github.io.git"
|
||||||
|
},
|
||||||
|
"author": "Vlad Faust <mail@vladfaust.com>",
|
||||||
|
"license": "UNLICENSED",
|
||||||
|
"bugs": {
|
||||||
|
"url": "https://github.com/vladfaust/vladfaust.github.io/issues"
|
||||||
|
},
|
||||||
|
"homepage": "https://github.com/vladfaust/vladfaust.github.io#readme",
|
||||||
|
"devDependencies": {
|
||||||
|
"copy-webpack-plugin": "^4.5.1",
|
||||||
|
"css-loader": "^0.28.11",
|
||||||
|
"html-webpack-plugin": "^3.2.0",
|
||||||
|
"node-sass": "^4.9.0",
|
||||||
|
"pug": "^2.0.3",
|
||||||
|
"pug-loader": "^2.4.0",
|
||||||
|
"sass-loader": "^7.0.1",
|
||||||
|
"style-loader": "^0.21.0",
|
||||||
|
"webpack": "^4.8.3",
|
||||||
|
"webpack-cli": "^2.1.3"
|
||||||
|
}
|
||||||
|
}
|
||||||
1
src/index.js
Normal file
1
src/index.js
Normal file
@@ -0,0 +1 @@
|
|||||||
|
import './style.sass'
|
||||||
88
src/index.pug
Normal file
88
src/index.pug
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
doctype html
|
||||||
|
html
|
||||||
|
head
|
||||||
|
title Hello, my name is Vlad Faust.
|
||||||
|
meta(http-equiv="X-UA-Compatible" content="IE=edge")
|
||||||
|
meta(name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0")
|
||||||
|
meta(property="og:type" content="website")
|
||||||
|
meta(property="og:title" content="Vlad Faust")
|
||||||
|
meta(property="og:description" content="An experienced developer creating fast and beautiful applications in Crystal")
|
||||||
|
meta(property="og:image" content="https://vladfaust.com/img/me.jpg")
|
||||||
|
meta(property="og:url" content="https://vladfaust.com")
|
||||||
|
script(src="bundle.js")
|
||||||
|
body
|
||||||
|
div.bar
|
||||||
|
h1.top Hello, my name is Vlad Faust
|
||||||
|
p I love beautiful code.
|
||||||
|
p
|
||||||
|
| I have a whole year of
|
||||||
|
a(href="https://crystal-lang.org") Crystal
|
||||||
|
| experience. I truly believe it will become the most popular language in the near future because of its beauty, expressiveness and efficiency.
|
||||||
|
p
|
||||||
|
| You can contact me via
|
||||||
|
a(href="mailto:mail@vladfaust.com") mail@vladfaust.com
|
||||||
|
| ,
|
||||||
|
a(href="https://github.com/vladfaust") GitHub
|
||||||
|
| ,
|
||||||
|
a(href="https://vk.com/vladfaust") VK
|
||||||
|
| , or
|
||||||
|
a(href="https://t.me/vladfaust") Telegram
|
||||||
|
| .
|
||||||
|
h2 My Crystal projects:
|
||||||
|
ul.projects
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/prism")
|
||||||
|
span.title Prism
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/prism.svg?style=flat-square&label=Star")
|
||||||
|
| an expressive web framework with typed params
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/core.cr")
|
||||||
|
span.title Core
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/core.cr.svg?style=flat-square&label=Star")
|
||||||
|
| an expressive modular ORM
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/migrate.cr")
|
||||||
|
span.title Migrate
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/migrate.cr.svg?style=flat-square&label=Star")
|
||||||
|
| a database migration solution
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/cake-bake.cr")
|
||||||
|
span.title Cake-Bake
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/cake-bake.cr.svg?style=flat-square&label=Star")
|
||||||
|
| an utility shard to bake Cakefile (just like Rake tasks) into binaries
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/tarantool-crystal")
|
||||||
|
span.title Tarantool
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/tarantool-crystal.svg?style=flat-square&label=Star")
|
||||||
|
| the Tarantool driver
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/http-multiserver.cr")
|
||||||
|
span.title HTTP::Multiserver
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/http-multiserver.cr.svg?style=flat-square&label=Star")
|
||||||
|
| an utility shard to map web applications
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/i18n.cr")
|
||||||
|
span.title I18n
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/i18n.cr.svg?style=flat-square&label=Star")
|
||||||
|
| an internationalization shard
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/time_format.cr")
|
||||||
|
span.title TimeFormat
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/time_format.cr.svg?style=flat-square&label=Star")
|
||||||
|
| an utility shard to humanize time spans
|
||||||
|
li
|
||||||
|
a(href="https://t.me/soundmemesbot") Soundmemes Bot
|
||||||
|
| a Telegram bot with 2.5m+ usages
|
||||||
|
h2 Other:
|
||||||
|
ul.projects
|
||||||
|
li
|
||||||
|
a(href="https://github.com/vladfaust/unity-wakatime")
|
||||||
|
span.title Unity Wakatime
|
||||||
|
img(src="https://img.shields.io/github/stars/vladfaust/unity-wakatime.svg?style=flat-square&label=Star")
|
||||||
|
| a Unity Wakatime integration (C#)
|
||||||
|
li
|
||||||
|
a(href="https://play.google.com/store/apps/details?id=com.vladislavfaust.jumpinsweeties.android") Jumpin Sweeties
|
||||||
|
| a beautiful Android game (Java, LibGDX)
|
||||||
|
li
|
||||||
|
a(href="http://xgm.guru/p/ufs") UFS Arena
|
||||||
|
| a Warcraft 3 custom map (cJASS)
|
||||||
58
src/style.sass
Normal file
58
src/style.sass
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
@import url('https://fonts.googleapis.com/css?family=Roboto')
|
||||||
|
|
||||||
|
body
|
||||||
|
align-items: center
|
||||||
|
display: flex
|
||||||
|
flex-direction: column
|
||||||
|
font-family: 'Roboto', sans-serif
|
||||||
|
font-size: 18px
|
||||||
|
padding: 2rem
|
||||||
|
|
||||||
|
> *
|
||||||
|
width: 100%
|
||||||
|
max-width: 600px
|
||||||
|
|
||||||
|
p
|
||||||
|
margin: 0
|
||||||
|
|
||||||
|
& + p
|
||||||
|
margin-top: 1rem
|
||||||
|
|
||||||
|
body, html
|
||||||
|
margin: 0
|
||||||
|
|
||||||
|
.bar
|
||||||
|
position: absolute
|
||||||
|
top: 0
|
||||||
|
left: 0
|
||||||
|
max-width: 100%
|
||||||
|
height: 5px
|
||||||
|
background-color: #0a83d8
|
||||||
|
|
||||||
|
h1, h2
|
||||||
|
margin: 0 0 1rem
|
||||||
|
|
||||||
|
&:not(.top)
|
||||||
|
margin: 1rem 0
|
||||||
|
|
||||||
|
a
|
||||||
|
text-decoration: none
|
||||||
|
color: #0a83d8
|
||||||
|
|
||||||
|
ul.projects
|
||||||
|
padding: 0
|
||||||
|
margin: 0
|
||||||
|
list-style: none
|
||||||
|
|
||||||
|
li
|
||||||
|
&:not(:first-of-type)
|
||||||
|
margin-top: 0.75rem
|
||||||
|
|
||||||
|
a
|
||||||
|
display: table-cell
|
||||||
|
font-size: 1.2rem
|
||||||
|
|
||||||
|
img
|
||||||
|
display: inline-block
|
||||||
|
margin-left: 0.25rem
|
||||||
|
margin-bottom: -0.25rem
|
||||||
BIN
static/img/me.jpg
Normal file
BIN
static/img/me.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 352 KiB |
@@ -1,45 +0,0 @@
|
|||||||
body {
|
|
||||||
padding: 10px;
|
|
||||||
font-family: sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-container {
|
|
||||||
display: -webkit-box;
|
|
||||||
display: -moz-box;
|
|
||||||
display: -ms-flexbox;
|
|
||||||
display: -webkit-flex;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-item {
|
|
||||||
max-width: 600px;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: black;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
#projects {
|
|
||||||
max-width: 100%;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
#projects ul {
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
#projects li {
|
|
||||||
text-align: left;
|
|
||||||
list-style-type: square;
|
|
||||||
}
|
|
||||||
|
|
||||||
#projects li .li-title {
|
|
||||||
font-size: bigger;
|
|
||||||
}
|
|
||||||
|
|
||||||
#projects li.old-project {
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
29
webpack.config.js
Normal file
29
webpack.config.js
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
var path = require('path');
|
||||||
|
var HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||||
|
var CopyWebpackPlugin = require('copy-webpack-plugin');
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
mode: 'production',
|
||||||
|
entry: path.resolve(__dirname, 'src/index.js'),
|
||||||
|
output: {
|
||||||
|
path: path.resolve(__dirname, 'dist'),
|
||||||
|
filename: 'bundle.js'
|
||||||
|
},
|
||||||
|
module: {
|
||||||
|
rules: [{
|
||||||
|
test: /\.s[ac]ss$/,
|
||||||
|
use: [
|
||||||
|
"style-loader",
|
||||||
|
"css-loader",
|
||||||
|
"sass-loader"
|
||||||
|
]
|
||||||
|
}, {
|
||||||
|
test: /\.pug$/,
|
||||||
|
use: ["pug-loader"]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new HtmlWebpackPlugin({ template: './src/index.pug'} ),
|
||||||
|
new CopyWebpackPlugin([{ from: 'static' }])
|
||||||
|
]
|
||||||
|
};
|
||||||
Reference in New Issue
Block a user