突然だが、みなさんは「会社に殺されかけた」ことはあるだろうか?
某居酒屋チェーン店の女性社員、某コンビニエンスストアの店長、某広告代理店の新卒女性社員をはじめ、多くの尊い命が失われたことも記憶に新しいだろう。
そんな私も新氷河期を乗り越え新卒で入社した中堅SI会社で、長期間におよぶ過重労働を強いられ、文字どおりブラック企業に殺されかけた。
当記事では、ブラック企業の実態を知ってもらうため、入社2年目から退職までの4年分のタイムカードを公開しようと思う。当時どんな思いで働いていたのか、体調を崩したのはいつか、精神を病んだのはいつか、などタイムカードをもとに暴露する。今ブラック企業で働いている人や会社を辞めようか悩んでいる人の参考になり、1人でも多くの命が救われることを願っている。
※ 文中に登場する社名やプロジェクト名、人名のイニシャルには、とくに意味はありません。
※ 長文なので時間がない方は、「で、結局どうすればよかったのか?」まで飛ばしてください
2016/12/26
2016/12/22
【JavaScript】Safariでファイルを強制ダウンロードさせようとしてハマった
Labels:
JavaScript
フロントエンドを生業としていると、クロスブラウザ対応という悪魔の作業がまっている。現在主に使われているブラウザは、Internet Explorer、MS Edge、Chrome、Firefox、Safariが挙げられる。(Opera? そんなブラウザは知らない)
これらのブラウザでファイルのダウンロードをさせようとすると、Safariでつまずく。IEですらできるのに、Safariだとできない。新しいタブにダウンロードするファイルの内容を表示して、ユーザにコピペさせるという最悪の動作しかできない。そのようにクライアントサイド(JavaScript)だけでファイルをダウンロードさせる方法を試しているうちにSafari沼にハマってしまった。
ということで、試した内容をまとめようと思う。
検証環境は以下のとおり。
これらのブラウザでファイルのダウンロードをさせようとすると、Safariでつまずく。IEですらできるのに、Safariだとできない。新しいタブにダウンロードするファイルの内容を表示して、ユーザにコピペさせるという最悪の動作しかできない。そのようにクライアントサイド(JavaScript)だけでファイルをダウンロードさせる方法を試しているうちにSafari沼にハマってしまった。
ということで、試した内容をまとめようと思う。
- aタグにdownload属性を追加する
- Content-Typeにapplication/octet-streamを指定する
- Content-Dispositionを指定する(サーバサイドの実装が必要)
検証環境は以下のとおり。
- macOS Yosemite
- Safari 10.0.2
2016/12/13
ソシャゲのガチャみたいなキラキラ星エフェクトをjsとcssで表現する
クリスマスも近いし、雰囲気だけでもとりあえずキラキラさせとけと思い、JavaScriptとCSSだけで星の煌めきみたいなエフェクトを実装した。ライブラリは何も使っておらず、IE11、MS Edge、Fireox、Chrome、Safariで動作確認済みだ。
タイトルにはソシャゲだのガチャだの書いてあるが、実際ソシャゲをやったこともないし、どんなものなのか見たこともない。ガチャなんて幼少期に100円のカードダスをやったくらいしか経験がない。
なので、自分が思うキラキラエフェクトをつくった。
イメージはこんな感じ。
タイトルにはソシャゲだのガチャだの書いてあるが、実際ソシャゲをやったこともないし、どんなものなのか見たこともない。ガチャなんて幼少期に100円のカードダスをやったくらいしか経験がない。
なので、自分が思うキラキラエフェクトをつくった。
イメージはこんな感じ。
Labels:
HTML/CSS
,
JavaScript
2016/12/08
vuex-router-syncを使ってgettersやactions,mutations内からroute情報を取得する
Vuexとvue-routerを共存させて、gettersやactions、mutations内でrouterの情報(パスやクエリパラメータなど)を使いたい場合がある。しかし、実現するにはViewModelからdispatchやcommitの引数にthis.$routeを渡さないとできない。gettersの場合は、そもそもパラメータを受け取ることができないので、route情報を使うことはできない。(グローバル変数でrouteを持つというバッドプラクティスもあるけど…。)
そんなときに便利なのが「vuex-router-sync」というライブラリ。
これを使うとstore.state.routeでroute情報にアクセスすることができる。
ということで、vuex-router-syncを使ったサンプルコードを書いてみた。
記事の最後に、vuex-router-syncの詳細仕様をまとめておく。
そんなときに便利なのが「vuex-router-sync」というライブラリ。
これを使うとstore.state.routeでroute情報にアクセスすることができる。
ということで、vuex-router-syncを使ったサンプルコードを書いてみた。
記事の最後に、vuex-router-syncの詳細仕様をまとめておく。
Labels:
JavaScript
,
Vue.js
2016/12/06
Vue.js+Vuex、Express4、Dockerなどを使ってさくらのクラウドのAPIクライアントを作った
この記事は「さくらインターネット Advent Calendar 2016」の6日目の記事です。
さくらのクラウドのAPIドキュメントはご存知だろうか?
ドキュメントにはAPIの一覧やパラメータの詳細などが載っている。curlコマンドのサンプルも載っているので、APIを実行することはできるのだが......。
なんかイケてない。
macOSやLinuxを使っている人は問題ないが、Windowsユーザに優しくない。curl?なにそれ?
もっとインタラクティブでダイナミックに動かせるドキュメントだったらいいのに…。
ということで、さくらのクラウドのAPIをブラウザから実行できる「sacloud-api-tester」をつくった。
APIキーを入力し、左のAPIリストから試したいリクエストを選択、実行するだけでリソース操作やレスポンスを確認できる。
※「SwaggerやPostmanを使え」はNGワード
さくらのクラウドのAPIドキュメントはご存知だろうか?
ドキュメントにはAPIの一覧やパラメータの詳細などが載っている。curlコマンドのサンプルも載っているので、APIを実行することはできるのだが......。
なんかイケてない。
macOSやLinuxを使っている人は問題ないが、Windowsユーザに優しくない。curl?なにそれ?
もっとインタラクティブでダイナミックに動かせるドキュメントだったらいいのに…。
ということで、さくらのクラウドのAPIをブラウザから実行できる「sacloud-api-tester」をつくった。
APIキーを入力し、左のAPIリストから試したいリクエストを選択、実行するだけでリソース操作やレスポンスを確認できる。
※
Labels:
Docker
,
JavaScript
,
Nginx
,
Server
,
Vue.js
登録:
投稿
(
Atom
)






