自作キーボードはイイゾ！イイゾ！
これは何？
答えはキーボード！
道具
- パソコン(ファームウェアを書き込む環境)
- はんだ
- はんだこて
部品
- マイコン
- 抵抗
- 基盤
- スイッチ
- キーキャップ
道具と部品を集め、キーボードを自作しました。
いわゆる自作キーボードというものです。
どうしてキーボードを自作するの？
パソコン作業を快適にするため！
既製品は打撃感(キーの押し心地)や配列(キーの配置)、キーマップ(キーを押すと入力される文字)が限定され、不満を抱きながらキーボードを利用します。
しかし自作キーボードは100%満足し、パソコン作業ができます。なぜなら、スイッチや配列、キーマップを0から100まで自身で決めることができ、妥協がないからです。
筆者の愛用キーボード
私は、Crkbd3x5+3レイアウトを愛用しています。
このキーボードは@foostanさんが開発した左右分割式のキーボードです。
スイッチ(打撃感)
- スイッチ: OUTEMU サイレントフォレストキースイッチ
- タクタイル
- 押下圧: 68g
- 潤滑剤
- Tribosys 3204
- Krytox GPL 105
- フィルム
- DUROCK キースイッチ用フィルム
配列
ColumnStaggered配列(列方向にずらした配列)
他の配列に関しては、
salicylic-acid3.hatenablog.com こちらの記事を参考にしてください。
キーマップ
Layer0
- タップで` / 長押しでoption
- タップでBackspace / 長押しでLayer1に切り替える
- command
- タップでSpace / 長押しでShift
- タップでreturn / 長押しでLayer2に切り替える
- タップでTab / 長押しでcontrol
2と5を同時押しすることでLayer3に切り替わります
Layer1
- スクリーンショットのショートカット
- 1単語左にカーソルを移動する
- 1単語右にカーソルを移動する
- 半角全角変換
Layer2
- 左のタブに移動する
- MissionControlを開く
- 右のタブに移動する
- 左の仮想デスクトップに移動する
- アプリケーションウィンドウを開く
- 左のタブに移動する
- 半角全角変換
Layer3
どうやって作るの？
公式のビルドガイドやブログなどインターネットで調べると組み立て方が載っています。
どこで入手するの？
shop.yushakobo.jp 遊舎工房と呼ばれるECサイトは、日本人が運営しておりサービスが充実です。そのため、初心者の方はこちらのサイトで物色することをお勧めします。
執筆情報
- 執筆者: RyoNish
- キーボード: Crkbd 3x5 + 3 Layout
三角比、三角関数を学ぼう
そもそも三角比、三角関数って何だっけ？
恐らく多くの人が高校で学ぶであろうの三角比や、三角関数。これらをよく分からないまま高校を卒業しまい、習った内容が記憶の彼方に行ってしまった方や、「今から三角関数とか習うけど一体こいつらは何もの？」と思う中高生もいるでしょう。
今回は上記のような方々を対象にしています。「私はもうsin、cos、tanなんか完璧だ」と言う方々は、是非とも暖かい目でこの記事を読んでいただけると幸いです。
三角比や三角関数は我々の生活する場面の至る所に存在しています。GPSやゲーム、ノイズフィルター、CGなどなど。まだまだ三角比、三角関数を利用している場面はたくさんありますが、ここで一度割愛させていただきます。
今回の記事で少しでも三角比や三角関数に対する知識や、考え方が良い方向に向くことを願っています。
それでは三角比で最初に見る、サイン、コサイン、タンジェントについて学んでいきましょう。
サイン(sin)とは
三角比を学ぶ上で私も例に漏れず直角三角形1)を利用していきます。
上記の図でギリシャ文字の「θ」というものを利用しています。これは辺acのなす角度を一般化したものであり、角はギリシャ文字で表現することが多く、絶対にギリシャ文字を使わなくてはならないという決まりはありません。
さて、上記の直角三角形で角θと2辺bとcを見ていきます。
ここから角θと2辺の長さの関係を調べていきます。
角θの大きさを変えずに辺b、cの長さを変えていきます。その長さをb'とc'とおきます。
そうした場合の図形は以下のようになります。
このb'とc'の比率を2倍3倍にしていっても、θの値は変わりません。そしてb'とc'は比例関係にあり、bとcの比も一定関係なので、これを言い換えると角θの大きさが一定であるならばb / c の値は一定と言うことになります。
つまりこの事実を言い換えると、角θの大きさが決まれば、b / cの値も決まります。
そして、直角三角形の2辺の比でsinθを定義してみると(0 < θ < 90°)
sinθ = b / c
よって上記の式より、sinはθを用いてb / cを求める関数と言うことになります。
サイン(sin)の覚え方
コサイン(cos)とは
コサインも先程のサインと同じように角θの値を一定に2辺a、cの値を2倍してみましょう。
今度も角θの値が一定であれば辺a、cの比も一定になりますね。
これもsinと同様に分数a / cの値がcosθの値になります。(0 < θ < 90°)
先程見たサインと非常に形が似てますね。
cosθ = a / c
コサイン(cos)の覚え方
タンジェント(tan)とは
もうsinとcosの導出には慣れてきましたか？最後に紹介するのはタンジェント(tan)です。
結論から申し上げますとこのtanは直角三角形の鋭角とそれに対する底辺と対辺の比のことを言います。
tanθ = b / a
タンジェント(tan)の覚え方
円を用いた三角関数の表現
次に三角関数を円で表現していきます。「円で三角形を表現？」と疑問に持つ人もいるでしょう。しかしこの円で表現することにより三角関数の可能性がグッと広がります。
今までsinθとcosθを表現する時に(0 < θ < 90°)と書いていたと思います。これは直角三角形でsinやcosを定義していたからです。しかし、これでは角度θが0°〜90°までで制限されてしまい少し窮屈ですね。これを解決するために単位円2)を利用します。半径が1であるためcの値も1になります。これによりおのずとbの値も見えてきますね。
つまりsinθは点Pのy座標と言うことに定めることができます。また円内部で三角形を定義しているのでsinθ < 0を表現することができます。この部分は是非自分で試してみてください。(x軸の下に点Pがきます)
同様に単位円上の点Pのx座標もcosθを定義することにより表現できます。
最後に
いかがでしたか？本記事で三角関数などで用いるsin、cos、tanの意味などが少しわかりましたか？。今回学んだことを利用すれば、学校の勉強は言わずもがな、色々なところで利用することが出来ます。皆様も是非楽しい三角関数ライフを！！
おすすめ書籍
- 浜村渚の計算ノート
- 数学ガールの秘密のノート
補足
1)三角形の中にある角のうち1つの角が直角である三角形
2)半径が1の円
【Vue.js】.vueファイルの書き方
はじめに
この記事ではVue.jsやNuxt.jsで使用する.vueファイルの書き方について書いていきます！
Vue.jsを初めて勉強する際は、HTMLファイルにscriptタグで一行追加するだけで利用できるCDN版で書いてみる人が多いと思います。
しかし、プロジェクト方式で開発となるとページの内容を記述する際にはHTMLファイルではなく、.vueファイルを利用していきます。
その際に、HTMLファイルから.vueファイルでの記述の違いで躓かないよう、この記事が少しでも参考になったら幸いです。
.vueファイルとは
.vueファイルはVue.jsのコンポーネントを定義しているファイルです。HTMLファイルに実装する方式ではコンポーネントはVue.componentを使って作成しますが、プロジェクト方式ではこの.vueファイルでコンポーネントを定義します。この.vueファイルという一つのファイルにまとめたコンポーネントを単一ファイルコンポーネントと言います。
.vueファイルでは、HTML、JavaScript、CSSを1ファイルにまとめて書けることが利点として挙げられます。
まとめて書くことで管理がしやすく、大規模なアプリケーションを作る際に大きな恩恵が受けられます。
.vueファイルの構造
.vueファイルは主に <template>タグ、<script>タグ、<style>タグの3つの部分に分けられています。
<template>
<div>
<div class="example">{{ msg }}</div>
<App/>
</div>
</template>
<script>
import App from './App.vue'
export default {
data () {
return {
msg: 'Hello world!'
}
},
components:{
App
}
}
</script>
<style>
.example {
color: red;
}
</style>
<template>タグ
<template>
<div>
<div class="example">{{ msg }}</div>
<App/>
</div>
</template>
一番最初にある<template>タグの中は、HTMLで記述します。
この<template>タグの中に記述した内容が実際の画面に表示されます。
<script>タグ
<script>
import App from './App.vue'
export default {
data () {
return {
msg: 'Hello world!'
}
},
components:{
App
}
}
</script>
scriptタグではHTMLファイルで実装するときと同じように、JavaScriptで処理を記述します。 しかし、見たことがないのが、export default{ }の部分です。このexport default{ }で囲むと書いた中身が外部のファイルからも呼び出せるようになります。 .vueファイルは外部からも呼び出せることが前提の仕組みのため、export default{}が必要なわけです。とりあえず最初はexprot default{}を脳死で書いておきましょう！
そして、もう一つあまり見かけないのが import ~~ from ~~の部分です。
import 好きなコンポーネント名 from 'コンポーネントとして利用したい.vueファイルのパス'
上記のように記述することで他の.vueファイルを読み込んで、コンポーネントとしてそのまま使用することができます！
なお、他のvueファイルを読み込む必要がないのならば、この一文は必要ありません。
<style>タグ
<style>
.example {
color: red;
}
</style>
最後はHTMLファイルの時とほとんど変わりありません。
CSSで記述してページを装飾することができます！
また、<style scoped>という風にscoped属性を付けると、この.vueファイル内のみにスタイルの設定を適用することができます。
参考
npm yarn Gitのproxy（プロキシ）設定・解除方法
はじめに
この記事は、npm・yarn・Gitの３つのプロキシ設定によく引っかかるので、書き留めておこうと思う。
設定・解除・確認のカテゴリで書いていく。
各バージョン
本稿は以下のバージョンで実行している。
$ npm --version 7.11.2 $ yarn --version 1.22.10 $ git --version git version 2.30.0
proxyの設定・解除・確認
本稿はすべてID & Pass なしで記述する。
*以下、プロキシサーバーをhttp://wwwproxyserver:port
又はhttps://wwwproxyserver:port
と記述する
proxyの設定
// npm $ npm -g config set proxy http://wwwproxyserver:port $ npm -g config set https-proxy https://wwwproxyserver:port // yarn $ yarn config set proxy http://wwwproxyserver:port $ yarn config set https-proxy https://wwwproxyserver:port // git $ git config --global http.proxy http://wwwproxyserver:port $ git config --global https.proxy https://wwwproxyserver:port
proxyの解除
// npm $ npm -g config delete proxy $ npm -g config delete https-proxy // yarn $ yarn config delete proxy $ yarn config delete https-proxy // git $ git config --global --unset http.proxy $ git config --global --unset https.proxy
proxyの確認
実行結果を確認するには、以下のコマンドを実行しましょう。
// npm $ npm config list // yarn $ yarn config list // git $ git config --global --list
なぜ我々はコロナに打ち勝てたのか？
はじめに
このブログは ”活動紹介” と ”技術発信” のために作ったものです。
しかし、今回は毛色を変えて Tourism Project がなぜ生まれ、
どうしてコロナ禍を耐え忍んだかという記録をここに残そうと思います。
そのため、今回は 大学などのプロジェクトに関わる人、オンラインプロジェクトを存続させたい人 に向けた内容になることをご容赦いただきたいです。
プロジェクトの遍歴
ここからは、我々のプロジェクトが出来てから今まで、何があったのかを書きます。
※ 結論だけ知りたい場合は読み飛ばしてもらって構いません
2020年1月 誕生
我々は、我々のボスである袖准教授に呼び出され、ホワイトボードの前にいました。
Tourism Project(当時はTravel with us)は、この時に出来たというわけではなく、この一年前には存在していました。
だが、元のメンバーの多くが就職や進学ということで、新たなメンバー体制で心機一転やっていくことになりました。この時のメンバーは全員が全員ほぼ初対面でした。
2020年2月 引き継ぎ
この月は以前のプロジェクトの引き継ぎ作業を行っていました。
以前は、海外からの観光客に向けたWebアプリケーションの作成をしており、これに用いている技術についての勉強や、このサイトの運用方法などを引き継いでいました。
この時にSlackを導入し、チーム内での情報共有を円滑にしました。
2020年3月 心機一転
この時期からボスからの提案で、今までのプロジェクトの内容を終了して新しいプロジェクト内容に変更してみないか、という提案がなされました。
うまくいけば法人化もしてもいいとのことなので、張り切って新しいプロジェクトのアイデアだしを行いまいした。
2020年4月 オンライン
ここで、件の感染症が猛威を振るい始め、集まってプロジェクトを行えなくなりました。
我が校で開催された、情報処理学会第82回全国大会がZoomでの開催になったのを参考に、我々もオンラインでプロジェクトを始めることにしました。
当時のチームリーダーである 中山さん の提案で毎週２回決まった時間にミーティングをすることになりました。
2020年5月〜8月 苦悩の日々
この頃、週２回のミーティングの議題は「プロジェクトで今後何をするか」を決めることでした。
しかし、これを決めるのにかなり揉めたり、振り出しに戻ったりと、もともと１時間を想定していたミーティングも、時には３時間を超える日も出てきてしまいました。
最終的には、「チームメンバーがアニメ好きである」「地元の観光地を発信したい」などという思いから「湯涌で聖地巡礼アプリを作りたい」という意見で決まりました。
2020年9月〜2021年2月 アプリ開発
今年度中に、湯涌温泉観光協会様へアイデアを見せて、最終的にイベントを開催したいという目標が決りました。
そのために、必要なアプリやWebサイトなどを設計して、実装に移りました。
この頃のミーティングは、進捗報告が主な内容だったため、週一回に減っており、
日によっては、5分程度でミーティングが終わる日もありました。
ミーティングのほかに時間を作って ”朝活” と称してZoomに集まって開発をする会や、 ”もくもく会” という作業通話を行ったりしました。
2021年3月 プレゼンと卒業
実際にiOSアプリのモックが完成しました。
プレゼン資料とできたアプリを携えて、湯涌温泉観光協会様へプレゼンをしまして、結果、高評価でした。
もちろん、細部には問題のある箇所はあったが、面白いと言ってもらえました。
この月に前リーダーであった 中山さん が卒業し、Fくん に新たなリーダーに着任ししました。
2021年4月〜2021年9月(現在)
新たな体制になって最初に行ったのは、記録を取れるようにしたことでした。
今までは、口頭での進捗報告だった。しかし、これでは進捗の管理が困難であり、大学側などにプロジェクトをしっかり行なっていたことを示す事ができません。
そこで、進捗報告システムを作りこれを定期ミーティング前に行うことで、話の流れがスムーズになったり、しっかり進捗のログを取れるなど多くのメリットがありました。
また、これまでSwift(プログラミング言語)での開発を行ってきたのですが、これよりもFlutter(iOS, Android双方とも開発できるライブラリ)を用いた方がいいという話になり、こちらを用いた開発に移行しました。
そして現在も、湯涌温泉観光協会様と話し合いながらイベント開催を目標に活動を行っていました。
全リーダー 中山さん への取材からわかったこと
今回、全リーダー 中山さん への取材で分かったことをまとめてみました。
休憩や雑談などを意識して入れる
中山さんによると、Zoomでは常に誰かが喋っていたり、プロジェクトに関係のある話を話しがちなので、対面に比べ疲れてしまいます。
そこで会議の進行をする場合は、議題の合間などに雑談を挟んだり、長時間になる場合は休憩を挟んでいたそうです。
また、その雑談を通してチーム内の仲が良くなるような効果も狙っていたといいます。
他にも、「会議は必要な人のみで短時間で行う事」「定期ミーティングであっても議題がなければすぐに終わらせる」なども気をつけていたそうです。
プロジェクト内部活を作った
オンラインで、普段よりチームの文化が築きにくいです。
そこで中山さんは、Slack内のチャンネルで「アルゴリズムとデータ構造」という、競技プログラミングについて話すチャンネルを作りました。
チームの仲を良くするために作ったといいます。
後になって考えると、これが「好きなものを教え合う」「技術や情報を共有する」というチーム文化につながったと筆者は考えます。
ちなみに、中山さんがこのような考えは、以下の本を読んだのがきっかけだそうです。
リーダーの引き継ぎはみんなに相談した
中山さんが卒業する際に、次のリーダーを選ぶ必要がありました。
リーダーを選ぶにあたって、その人選が原因で蟠りができないように、チーム全員と1人づつ話し合って、決めたといいます。
そして、現在でもその決定によってスムーズなプロジェクト運営ができていると筆者は考えます。
みんなが技術やプロジェクトに興味ややる気があった
みんなの技術に対するモチベーションが高く、情報の共有などができたこと。
全員が同じ目標を持ってプロジェクトを進めていたこと。
これらの理由で、プロジェクトが纏まっていたと中山さんは考えていたようです。
コロナに打ち勝った理由
筆者の考えるコロナに打ち勝った理由を簡単にまとめると以下の通りです。
- オンライン環境づくり
- チーム文化づくり
- みんなの協力
1. オンライン環境づくり
オンラインでプロジェクトを運用するためには、環境づくりが必須です。
SlackやZoomなどのコミュニケーションツールを用いることが大前提となる。
その上で議題がなかったとしても、定期的なミーティングを行う事で、それが習慣化し、存続し続けるプロジェクトになります。（ただし、議題が無い場合はすぐに終わっても良いです）
また、Google フォームを用いた進捗管理システムや、特定の日時になると定期ミーティングのURLが発行・通知される機能を作り、システム面から参加率を上げるように努力しました。
2. チーム文化づくり
ただ、ミーティングを行うだけではチームの結束は弱いです。
そこで、チームに愛着を持ってもらえるようなチーム文化が必要です。
この部分は一般化できる話では無いかもしれないですが、Slackにプロジェクトに必要なチャンネル以外にも、娯楽や勉強会などのチャンネルを増やすことで、Slackが活発化して、自然と和気藹々として雰囲気を作れるのではないかと考えます。
3. みんなの協力
これが最も大切だと感じるのですが、ひとりが努力してもプロジェクトは成功もしなければ存続もしません。
ゆえに、全員がやる気を持ってプロジェクトに参加する必要があるります。
ただ、環境面が整っていない状況では、どうしたってやる気は出ないので、この部分の改善は、問題意識を持った誰かが率先して行う方がいいのではないかと考えています。
終わりに
大学のプロジェクト運営は大変難しいことです、
これは中山さんの言葉ですが
プロジェクトには強制力がなく、学生は自由、やるかやらないかは勝手
とのことです。
しかし、実際プロジェクトを運営するためには、学生の興味を引き出し、やる気を持たせ、プロジェクトに参加してもらう必要があります。
故に、会社でのプロジェクト運営と別の難しさがあります。
しかし、プロジェクトが成功した時の達成感は素晴らしいものなので、ぜひこの記事を参考にみなさんも大学のプロジェクトを存続させ成功させて欲しいです！
ここまで読んで下さり、ありがとうございます。
みなさんも良い、プロジェクトライフを！
初心者が使うMarkdown記法のメモ
こんにちは
今回はMarkdownで記事を書くことになったので、メモ程度に使うものなどを残していきたいと思います。
見出し
「#」を使うことで、見出しを設定することができます。「#」の数が増えるほど見出しの大きさは小さくなっていきます。
使用例
#hoge ##hoge ###hoge ####hoge
表示例
hoge
hoge
hoge
hoge
段落
段落は空行を文章の途中に入れるとできます。
我々TourismProjectは金沢工業大学にある プロジェクトの1つです
表示例
我々TourismProjectは金沢工業大学にある
プロジェクトの一つです
改行
改行は半角スペースを2つ入力し改行を行うことによりブラウザなどでの改行表示がされできます。
最近週1ペースでのブログ更新を はじめました
表示例
最近週1ペースでのブログ更新を
行っています。ぜひ見てください。
リスト
- リストは
- 「-」をつけることで実装できます。
- ちなみに半角スペースを4つつけるとこの様になります。
Todoリスト
- プログラムの修正
- ブログを書く
表示例
Todoリスト
- プログラムの修正
- ブログを書く
番号リスト
- 番号リストは
- 1を文章の前につけることでできます。
- 4つの半角スペースを開けることでこの様になります。
- イエーイ
メンバーリスト
1. 吉田
1. 山本
1. 山岡
1. 杉本
表示例
メンバーリスト
- 吉田
- 山本
- 山岡
- 杉本
リンク
リンクは[]に青文字を、()にリンクを貼ることで出来ます。
使用例 [はてなブログ](https://hatenablog.com/)
表示例
引用
引用しました。「>」をつけることで引用ができる。
使用例 >すごい本
表示例
すごい本
脚注
この様に脚注します。1
使用例 日本で一番高い山は富士山である。[^1] [^1]: ソースはwiki
表示例
日本で一番高い山は富士山である。2
打消
打消は本音のように~~を消したい文章の所に前後に入れるとできる。
~~言わなくてもいいこと~~
表示例
言わなくてもいいこと
Tourism Projectの活動概要
Torism Projectの活動概要
はじめまして。Tourism Projectの広報兼研究員Tです。今回は僕がこのプロジェクトの活動内容や雰囲気などをざっくりとお伝えしていきます。
Tourism Projectのはじまり
Tourism Projectはもともと、２年前にコロナ禍で何か自分たちで世の中を盛り上げるためにできることをしようってことで立ち上がったプロジェクトです。最初に何をするか決めるときに、レビュワー同士でおすすめの場所を紹介することで地域のお店のクーポンなどをもらう「わらしべ観光システム」、VRを使って擬似的に旅行をする「VR旅行」、旅行計画などを自動で行うアルゴリズムの開発だったり、より地域の良さを地域のお店や住人に寄り添った形で紹介する聖地巡礼アプリなどの案が出ました。そして最終的に、せきやん(@sekiyan372）の案の聖地巡礼アプリを作ることに決まりました。
Tourism Projectの活動
1. 湯涌デジタルスタンプラリー
Tourism Projectは、花咲くいろはの舞台でもある湯涌をベースにデジタルスタンプラリーをするアプリケーションを作っています。観光客が湯涌に来たときに、そのアプリを使って、各観光スポットで写真を撮ることで位置情報をもとにスタンプがマップに押され、その写真をアプリ内のフォトコンテストに投稿することで、湯涌の魅力を宣伝することが目的です。湯涌観光協会の方々の協力を得ながら、実際に温泉に入ったり、湯涌を観光して自分たちも湯涌の良さを、生で感じたことを発信できるように頑張ってます。他にも自分たちのプロジェクトのHPを作成して活動を発信しています。
2. 作業風景
僕たちは毎週土曜の20:00のzoomミーティングで進捗報告、今後の方針とタスクの確認をして、自分のタスクを各自進めています。定期的に勉強会を行ったり、焼肉に行ったり親睦会も行ってます！興味のある方は是非Tourism Projectへ！！
