Skip to content

Commit 1a9b3f1

Browse files
chimerastchimerast
committed
Nuxt.jsとTypeScriptで一から書き直し
1 parent 329b498 commit 1a9b3f1

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

69 files changed

+16934
-1260
lines changed

‎.dockerignore

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
.env
2+
data/
3+
dist/
4+
docs/
5+
node_modules/
6+
LICENSE
7+
README.md
8+
9+
.nuxt
10+
11+
.git
12+
.gitignore
13+
14+
.dockerignore
15+
Dockerfile

‎.editorconfig

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# editorconfig.org
2+
root = true
3+
4+
[*]
5+
indent_style = space
6+
indent_size = 2
7+
end_of_line = lf
8+
charset = utf-8
9+
trim_trailing_whitespace = true
10+
insert_final_newline = true
11+
12+
[*.md]
13+
trim_trailing_whitespace = false

‎.eslintrc.js

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
module.exports = {
2+
root: true,
3+
env: {
4+
browser: true,
5+
node: true
6+
},
7+
extends: [
8+
'@nuxtjs',
9+
'@nuxtjs/eslint-config-typescript',
10+
'prettier',
11+
'prettier/vue',
12+
'plugin:prettier/recommended',
13+
'plugin:nuxt/recommended'
14+
],
15+
plugins: [
16+
'prettier'
17+
],
18+
// add your custom rules here
19+
rules: {
20+
"semi": "off",
21+
"@typescript-eslint/semi": ["error"],
22+
"no-useless-constructor": "off",
23+
"@typescript-eslint/no-useless-constructor": "error",
24+
"no-return-await": "off"
25+
}
26+
}

‎.gitignore

+90-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,92 @@
1-
node_modules
1+
/data
2+
3+
# Created by .ignore support plugin (hsz.mobi)
4+
### Node template
5+
# Logs
6+
/logs
7+
*.log
8+
npm-debug.log*
9+
yarn-debug.log*
10+
yarn-error.log*
11+
12+
# Runtime data
13+
pids
14+
*.pid
15+
*.seed
16+
*.pid.lock
17+
18+
# Directory for instrumented libs generated by jscoverage/JSCover
19+
lib-cov
20+
21+
# Coverage directory used by tools like istanbul
22+
coverage
23+
24+
# nyc test coverage
25+
.nyc_output
26+
27+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
28+
.grunt
29+
30+
# Bower dependency directory (https://bower.io/)
231
bower_components
3-
.sass-cache
4-
.DS_Store
32+
33+
# node-waf configuration
34+
.lock-wscript
35+
36+
# Compiled binary addons (https://nodejs.org/api/addons.html)
37+
build/Release
38+
39+
# Dependency directories
40+
node_modules/
41+
jspm_packages/
42+
43+
# TypeScript v1 declaration files
44+
typings/
45+
46+
# Optional npm cache directory
47+
.npm
48+
49+
# Optional eslint cache
50+
.eslintcache
51+
52+
# Optional REPL history
53+
.node_repl_history
54+
55+
# Output of 'npm pack'
56+
*.tgz
57+
58+
# Yarn Integrity file
59+
.yarn-integrity
60+
61+
# dotenv environment variables file
62+
.env
63+
64+
# parcel-bundler cache (https://parceljs.org/)
65+
.cache
66+
67+
# next.js build output
68+
.next
69+
70+
# nuxt.js build output
71+
.nuxt
72+
73+
# Nuxt generate
574
dist
6-
*.log
7-
*.pem
75+
76+
# vuepress build output
77+
.vuepress/dist
78+
79+
# Serverless directories
80+
.serverless
81+
82+
# IDE / Editor
83+
.idea
84+
85+
# Service worker
86+
sw.*
87+
88+
# macOS
89+
.DS_Store
90+
91+
# Vim swap files
92+
*.swp

‎.prettierrc

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"semi": true,
3+
"arrowParens": "always",
4+
"printWidth": 140,
5+
"singleQuote": true,
6+
"trailingComma": "es5",
7+
"endOfLine": "lf"
8+
}

‎.vscode/settings.json

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"editor.tabSize": 2,
3+
"eslint.alwaysShowStatus": true,
4+
"eslint.lintTask.enable": true,
5+
"eslint.validate": [ "javascript", "typescript", "vue" ],
6+
"files.trimFinalNewlines": true,
7+
"typescript.updateImportsOnFileMove.enabled": "always",
8+
"vetur.format.defaultFormatter.js": "none",
9+
"typescript.tsdk": "node_modules/typescript/lib",
10+
"editor.codeActionsOnSave": {
11+
"source.fixAll.eslint": true
12+
},
13+
}

‎.vscode/vetur/snippets/vue-class-component.vue

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<template lang="pug">
2+
${0}
3+
</template>
4+
5+
<script lang="ts">
6+
import { Component, Vue } from 'nuxt-property-decorator';
7+
8+
@Component
9+
export default class ${TM_FILENAME_BASE} extends Vue {
10+
}
11+
</script>
12+
13+
<style lang="scss" scoped>
14+
</style>

‎Dockerfile

+17-7
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,23 @@
1-
FROM node:6-alpine
1+
FROM node:12-alpine
22

3-
WORKDIR /nico
3+
RUN apk add --no-cache tini bash imagemagick zip
44

5-
ADD . .
5+
WORKDIR /app
66

7-
RUN yarn install
7+
COPY package.json package-lock.json ./
8+
RUN npm install
89

9-
ENV PORT 80
10+
ENV HOST 0.0.0.0
11+
ENV PORT 8080
12+
ENV SERVER_URL SERVER_URL_SHOLD_BE_REPLACED
1013

11-
EXPOSE 80
14+
COPY . .
15+
RUN npm run build
1216

13-
CMD npm start
17+
EXPOSE 8080
18+
19+
ENV NODE_ENV production
20+
ENV TS_NODE_PROJECT server/tsconfig.json
21+
22+
ENTRYPOINT ["tini", "--"]
23+
CMD ["npx", "ts-node", "/app/server/index.ts"]

‎LICENSE

+1-1
Original file line numberDiff line numberDiff line change
@@ -186,7 +186,7 @@
186186
same "printed page" as the copyright notice for easier
187187
identification within third-party archives.
188188

189-
Copyright 2015-2017 Hideyuki TAKEUCHI <chimerast@gmail.com>
189+
Copyright 2015-2020 Hideyuki TAKEUCHI <chimerast@gmail.com>
190190

191191
Licensed under the Apache License, Version 2.0 (the "License");
192192
you may not use this file except in compliance with the License.

‎README.md

+2-40
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,7 @@
1-
NicoNico SPEENYA
2-
====
1+
# NicoNico SPEENYA [WIP]
32

43
[![license](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](LICENSE)
54

6-
ブラウザに、ニコニコ動画のように右から左に流れるコメントを表示する、Chrome機能拡張とサーバプログラムです。Likeボタンを押すといいね画像が浮き上がったりします。
5+
## ライセンス
76

8-
主にブラウザを使ったプレゼンテーションで使用すると(いわゆるニコニコメソッド)、視聴者とコミュニケーションがとれて良い感じです。
9-
10-
Google Slidesやネット上のPDFをChromeで開いた上にも表示出来ます(**ただし、SSLで公開されたサーバが必要**)。
11-
12-
**注意**: 細かいこと考えてないので、このソースコードのまま一般公開サーバとか作ると大変なことになる気がします。
13-
14-
<img src="docs/niconico.gif" width="300">
15-
16-
### 開発動機
17-
18-
社内の会議の所帯が大きくなり一人一人が発言しづらくなってきたので、コミュニケーションを促進するために作りました。
19-
20-
### 参考
21-
22-
[ニコニコメソッドプレゼンを全社会議に取り入れてみたら会議が面白くなった](http://tech.uzabase.com/entry/2015/06/01/143202)
23-
24-
### 中身
25-
26-
* **server.js** - node.jsで書かれたサーバプログラム
27-
* **extension** - クライアントとしてのChrome機能拡張
28-
29-
### 動かし方
30-
31-
```bash
32-
$ npm install
33-
$ npm start
34-
```
35-
36-
を実行してサーバプログラムを立ち上げ、extensionフォルダの中身をChrome機能拡張として登録してください。
37-
38-
[http://localhost:2525/](http://localhost:2525/) にアクセスするとコメント入力画面が表示されます。
39-
40-
外部サーバで動かす場合は、 [extension/scripts/content-script.js](extension/scripts/content-script.js) の一番上の方にある接続先URL(`SERVER_URL`)を変更してビルドしてください。
41-
42-
Google Apps for Workとかで、社内向け限定公開でChromeウェブストアに登録する場合は、`make-package.sh`を実行してできたzipファイル(dist/extension.zip)を登録すれば大丈夫なはずです。
43-
44-
### ライセンス
457
[Apache License 2.0](LICENSE)

‎assets/README.md

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# ASSETS
2+
3+
**This directory is not required, you can delete it if you don't want to use it.**
4+
5+
This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
6+
7+
More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).

‎assets/buefy.png

10.7 KB
Loading

‎assets/scss/_variables.scss

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
@import "~bulma/sass/utilities/initial-variables";
2+
@import "~bulma/sass/utilities/functions";
3+
4+
// 1. Set your own initial variables and derived
5+
// variables in _variables.scss
6+
7+
$family-sans-serif: "Gill Sans", sans-serif;
8+
$primary: $grey-dark;
9+
10+
// 2. Setup your Custom Colors
11+
@import "~bulma/sass/utilities/derived-variables";
12+
13+
$section-padding: 1.5rem 1.5rem;
14+
$footer-padding: 0.5rem 1.5rem;
15+
16+
// 3. Add new color variables to the color map.
17+
@import "~bulma/sass/utilities/animations";
18+
@import "~bulma/sass/utilities/mixins";
19+
@import "~bulma/sass/utilities/controls";

‎assets/scss/app.scss

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@import "variables";
2+
3+
@import "~bulma";
4+
@import "~buefy/src/scss/buefy";
5+
6+
// 4. Provide custom buefy overrides and site styles here
7+
8+
html {
9+
touch-action: manipulation;
10+
}

‎components/Comment.vue

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<template lang="pug">
2+
.comment
3+
form(@submit.prevent="postComment")
4+
b-field(label="Comment" horizontal)
5+
b-field
6+
b-input(v-model="comment" placeholder="Please input your comment" expanded)
7+
.control
8+
b-button(type="is-primary" icon-left="comment" native-type="submit")
9+
comment-parameter(v-model="size" label="Size" :values="{ big: 15, medium: 10, small: 8 }")
10+
comment-parameter(v-model="speed" label="Speed" :values="{ fast: 1500, medium: 2000, slow: 3000 }")
11+
comment-parameter(v-model="color" label="Color" :values="{ black: 'black', red: 'red', blue: 'blue', green: 'green' }")
12+
</template>
13+
14+
<script lang="ts">
15+
import { Component, Vue } from 'nuxt-property-decorator';
16+
import CommentParameter from './CommentParameter.vue';
17+
18+
@Component({
19+
components: {
20+
CommentParameter,
21+
},
22+
})
23+
export default class Comment extends Vue {
24+
private comment: string = '';
25+
private size: number = 10;
26+
private speed: number = 2000;
27+
private color: string = 'black';
28+
29+
private async postComment(): Promise<void> {
30+
if (this.comment !== '') {
31+
const body = this.comment;
32+
this.comment = '';
33+
await this.$axios.$post('/messages/comment', {
34+
body,
35+
size: this.size,
36+
duration: this.speed,
37+
color: this.color,
38+
});
39+
}
40+
}
41+
}
42+
</script>

0 commit comments

Comments
 (0)