ID生成大全 - Qiita
セッションIDやアクセストークン、はたまた業務上で使う一意の識別子など、いろんなところで一意のIDを生成しなきゃいけないケースが存在します。 そこで世間で使われているIDの生成方法について調べてみました。 選択基準 ID生成における要求として、以下の観点が上げられるかと思います。 生成の速度 大量にデータを短期間で処理し、それらにIDを付与する場合、ID生成そのものがボトルネックとなることがあります。 推測困難性 IDを機密情報と結びつける場合、IDを改ざんされても、機密データが見れないようにできている必要があります。 順序性 採番した順にデータをソートする必要がある場合は、IDがソートキーとして使えないといけません。 それぞれについて各生成手段を評価します。 ID生成の手段 データベースの採番テーブル 採番用のテーブルを作り、そこで番号をUPDATEしながら取得していくやりかたです。古い
そこそこセキュアなlinuxサーバーを作る - Qiita
先日「サーバーのセキュリティ設定がなにすればいいかわからない」と相談をうけまして。 自分も初心者の時どこまでやればいいかわからず手当たりしだいにやって沼に入っていたのを思い出しながら自鯖構築したときのメモを元にまとめてみました。 注意 セキュリティ対策は用途や場合などによって違います。 自分で理解したうえで自己責任でおねがいします。 対象読者 Linuxのサーバーを建て慣れていない人 Linuxはある程度さわれる人(自分でパッケージを入れたり、サービスを止めたりできる) ラインナップ ☆は導入の重要度と導入の容易さから個人的偏見からつけた値です。 4つ以上が"最低限やること"だと思ってください。 sshd
syslog監視を利用して、sshアクセス元を可視化する - Qiita
VyOSを運用していく中で、/var/log/messageをしばしば確認すると、SSHブルートフォースを被害を受けていることがわかった。よって、今回は対象のVyOSからSyslogを監視サーバ(Fluent,Elasticsearch,Kibana)に送信し、サーバ上で可視化することを目指したい。 なお、前回のGeoIPを利用するので、そちらの構築がまだの人は記事を参照してください。 以下のサイトを参考に作成しました。(ありがとうございます。) fluentdとKibanaでSSHアクセス元マップ はじめに 今回はVyOSの以下のようなsyslogはparseして詳細に可視化し、その他のsyslogに関しては表示するだけみたいな感じです。 Aug 27 14:52:15 vyos sshd[20938]: pam_unix(sshd:auth): authentication failu
fluentdとKibanaでSSHアクセス元マップ - Qiita
大学外にポートが空いている研究室のサーバに対して，不正なSSHのアクセスが結構来ています． 今回は以下のステップで，不正アクセス元の国をKibana mapで可視化してみました． fluentdでSSHのログから不正アクセスのIPアドレスを解析 GeoIPを使ってIPアドレスから国を特定 Elasticsearchにログを収集 Kibanaのmap panelを使って可視化 GeoIPとは サイトアクセス者の位置情報を取得するGeoIP | SourceForge.JP Magazineより引用． GeoIPとは、IPアドレスを国、都市、インターネットサービスプロバイダ(ISP)にマッピングしたデータベース群である。 そうしたデータとともにC、PHP、Javaその他いくつかの言語を使ってデータベースにアクセスするためのLGPLライセンスのAPIも用意されている。 fluentdでSSHログ
AWS料金早見表
サーバレスアーキテクチャ構成にしたときに 実際のところ、どれくらいの料金になるのか気になったので算出してみようと思います。 (あくまでシミュレーションしたものでAWS側で値段や計算方法が変わったりするため、責任は負いかねますので導入する際は自己責任でお願いします。) AWSのどこにどれくらいの料金がかかっているのか知ることは大事だと思ったのですが、トータルだとなかなかまとまってなかったのでまとめてみました。 間違ってたらご指摘いただけると助かります。 サーバレスアーキテクチャって何？って方はこちら参照してください 世界に先駆けてAWSサーバレスアーキテクチャでユーザ認証とAPI認可の実装をしてみた AWSサーバレスアーキテクチャでCloudFrontからWAFをかけてAPI Gatewayを呼ぶ Lambda+RDSはアンチパターン 全部教えます！ サーバレスアプリのアンチパターン とチュ
Reactを使うとなぜjQueryが要らなくなるのか - Qiita
はじめに React（通称 React.js1）を全く知らない、あるいは幾つか記事を見たけどなんなのかピンと来ていない、という人のために書いています。 「jQuery くらいしか知らない」くらいの人に具体的に雰囲気を知ってもらうのが目的であり、すでにやる気がある人向けのチュートリアルではありません。やる気が出れば日本語版ドキュメントを読んで手を動かせばあっという間なので、そこまでの興味が出ることを目標にしています。 以降では ES2015 (ES6) の文法（アロー関数とか）を使っています。この部分が怪しい人は先にアロー関数と const 文だけでも知ってから先に進んでください。 以下の説明中、このアイコンで表すのは（2023 年現在から見た）『昔話』です。新しく自分のコードを書く際には本来知らなくていいことですが、古い記事を見たときに混同しないための参考情報として書いてあります。この記事
今時のフロントエンド開発2017 (1. 愚痴編) - Qiita
良いものを書きたいので指摘などは大歓迎です。 その際はコメントや編集リクエストをいただければ修正します。 大きな変更が加わるときは通知すると思います。 はじめに これまでのフロントエンドの開発には多くの問題や面倒ごとを抱えています。 その解決手段としてよくビルドツールやaltJSといったワードを目にしますが，これらがどういった目的で利用されているのかについて触れながら進めていきます。 主にパッケージ管理やビルドツールを初めて見る人向けになっているので全編通すとそれなりに長いです。 動かすまでが長めになっていますが理解してしまえば本当に必要な手順はさほど多くありません。 実際に開発を始めるために必要な準備はせいぜい1~2つのファイルを記述してコマンドを数回叩く程度なので，過度な抵抗感を持たずに読んでいただけたらなと思います。 登場するツールや技術は多くの問題を解決してくれますが，これらは飽く
最高のモックアップツールかもしれないBootstrap Studio - Qiita
1. モックアップツールって何使ってる？？ 2017年の11月くらいから、毎日コツコツと作っていたWebアプリケーションをなんとか完成しました （色々あってリリースはまだしていません...）。Webアプリケーションを作り始めるときに、はじめに「設計」と「モック」を作りました。 世の中に出ているモックツールのまとめ https://navi.dropbox.jp/mockup-tool https://www.mockplus.com/blog/post/webux-10 色々と調べた結果「Bootstrap Studio」が良さそうだったので、有料版を購入してみましたが、とても良く、Qiitaにもあまり情報共有されていなかったので、使ってみた感想などを、まとめようと思います。 2. Bootstrap Studioについて Bootstrap Studio https://bootstra
独りでWebサービスを開発・リリースするまでのTips - Qiita
これは2017年の11月から独りでWebサービスを作りはじめて、独りでリリースをして、独りで打ち上げをした、独身男性の備忘録です。 開発からリリースまでの4ヶ月間、自分が開発中に心がけていたことなどを忘れないように、次のサービスに活かせるように、Qiitaに投稿しておきます。 また『Webサービス作るぞ！』と、独りで考えている方の参考になればと思います。 作ったもの OFFICECLOCK - クラウド型の勤怠管理サービス トップ画面 登録画面 勤務表画面 打刻画面 OFFICECLOCKは何ができるのか？ ざっくり説明すると... Webブラウザで勤怠管理ができる 登録した勤務時間をエクセルで出力ができる HATARACLOCKとも連携しているため、LINEでの打刻、勤務表の確認もできる 【連携しているLINEアプリ】 ※このLINEbotとWebのサービスが連動している。 こだわり こ
JavaScript の仕組み：メモリ管理+ 4つの共通のメモリリーク処理方法 - Qiita
この記事は sessionstack blog に投稿されている、How JavaScript works シリーズの一記事 "How JavaScript works: memory management + how to handle 4 common memory leaks" の和訳です。投稿されたのは Alexander Zlatkov, 原文はこちらです。翻訳については許諾いただいています。 メモリ管理もしくはC言語におけるメモリ解説他、用語なども怪しい箇所は多分にありますので、間違いがありましたら修正のご指摘・編集リクエスト等ください。 日本語の参考 URL 先に日本語の参考URLを記載しておきます。 JavaScriptで起こるメモリリークのパターン - EagleLand Browser Computing Structure // Speaker Deck Unders
Google Homeを使って4歳児とSlackで会話する方法 - Qiita
わたあめに捧ぐ(私信) 私の家では、家族の連絡にSlackを利用しています。 Slackはとても便利なのですが、基本的にテキストベースのコミュニケーションとなるため、 文字入力ができない幼児には使うことができません。 そこで、Google Homeを活用して、文字入力をせずにSlackで会話するシステムを構築してみました。 イメージは以下のとおりです。 このシステムは、大まかに以下の2つで構成されています。 Slackへの投稿をGoogle Homeがしゃべってくれる仕組み Google Homeに話しかけるとSlackに投稿してくれる仕組み 順を追って説明していきます。 1. Slackへの投稿をGoogle Homeで喋らせるBotの作成 以下のソフトウェアを書きました。 https://github.com/ikasamah/go-slack-google-home Google H
Google HomeとSalesforceをAccount Linkingで連携した（動画あり） - Qiita
Quip Live Appsの何かを書くと予告していたのですが、すみません。予告詐欺です。 Google Homeから音声でSalesforceを操作するGoogle Homeアクションを作ってみることになりました。 今回作るアクションのシナリオ Salesforceのアカウントと紐付ける ユーザ「Salesforceアプリにつないで」 ボット「こんにちは。Salesforceアプリです。」 ユーザ「今日の予定は？」 ボット「今日の予定はXXXです。」 みたいなのを作ろうと思います。 内容はとりあえず連携を試すためのものではあります。 しかし、実はGoogle Homeは個人用Gmailアカウントとリンクしており、Googleカレンダー連携機能が役に立たないため、Salesforceで予定が確認できると個人的に便利なのではないかと期待もしています。 動くものをすぐに見てみたい方は下の方に動
2018年のフロントエンドエンジニアならこの程度は知ってて当然だよな？ - Qiita
可及的速やかにReactが絶滅しますように。 以下はFront-End Developer Handbook 2018の第三部、Front-end Developer Toolsからリンクされているツールと、その簡単な紹介です。 ドキュメントツール 開発者向けドキュメント、APIリファレンス Dash 200以上のAPIリファレンス、100以上のチートシートを一括ダウンロードできる。有料、Mac用。 DevDocs 200以上のライブラリをオンラインで検索できる。無料。 Velocity 中身はDashと同じ。有料、Windows用。 Zeal Windows、Linux、MacOS用各種揃っている無料のオフラインドキュメント。 チートシート devhints.io JavaScript、CSS、Go、vim等のショートカット、書式などチートシート。字が薄くて見辛い。 SEOツール Key
Node.js, Express, sequelize, React で始めるモダン WEB アプリケーション入門（Express/sequelize編） - Qiita
Node.js, Express, sequelize, React で始めるモダン WEB アプリケーション入門（Express/sequelize編）Node.jsExpresssequelizepug 目的 WEB アプリケーションの入門として下記を学ぶことが目的です。 Express スタートアップ (Node.js 初期化含む) O/R マッパー sequelize を使った DB 処理入門 React スタートアップ 今回は Express スタートアップと sequelize の利用方法について記載してます。 尚、自分の理解を整理する目的で記載するため、チュートリアル形式で記載してませんので、かいつまんで読んで頂けると幸いです。 おまけとして、記事の最後に VSCode 開発者向けデバッグ方法を記載しました。 尚、Windows において動作確認してますがコマンドは Linu
Pug で checked / selected / disabled属性などを動的付与する - Qiita
背景 Pug（旧称Jade）で checked などの真偽型属性を条件に応じて付与したりしなかったりしたい場合、どうすれば良いのか。従業員に質問されて、たしかにちょっとわかりにくいかなと思ったので、今後同じところで迷う人のために書いておく。 前提 HTML5では checked 属性のような真偽型の属性に対して許容されている値は空文字から属性値と同じ値（大文字小文字は区別しない）のいずれかのみである（W3C）。またそれ以外の文字列（"false"など）が指定された場合は不正値として空文字と同じように処理される。 したがって実際のブラウザの挙動では以下はいずれもチェック状態となる。 <!-- 以下は正しい --> <input type="checkbox" value="1" checked> <input type="checkbox" value="1" checked=""> <in
VSCodeで、Electronをデバックする - Qiita
デバックツールの起動 ChromeブラウザのF12を押して起動するデバックツールを使えるようにします。 IDEのリモートデバック機能で、ステップ実行できるのは、メインプロセスのみとなります。 レンダリングプロセスをデバックするのは、Webページをデバックするのと同じ要領となります。 "use strict"; const electron = require("electron"); const app = electron.app; const BrowserWindow = electron.BrowserWindow; let mainWindow; // 全てのウィンドウが閉じたら終了 app.on('window-all-closed', function() { if (process.platform != 'darwin') { app.quit(); } }); // E
フロントエンド開発初心者がelectron-vueでアプリをつくってみた その２～実装編～
はじめに SC（非公式） Advent Calendar 2017 24日目！クリスマスイブですね♪ その１ は概念編でしたが、今回は実装編ということで、 ログインからのページ遷移→座席表表示→検索→検索結果表示まで実装してみたいと思います(｀･ω･´)！ electron-vueと銘打っておきながら、ほぼVue.jsのお話です。 開発時に躓いたところを中心に、参考資料をあげながらまとめています。 Main Process ひとまずはウィンドウが立ち上がればよいので、electron-vueインストール時に自動生成されたまま変更しません。 'use strict' import { app, BrowserWindow } from 'electron' if (process.env.NODE_ENV !== 'development') { global.__static = requ
オブジェクト指向がn%理解できる記事まとめ
全部読めばきっと理解できる…はず。 話題編 オブジェクト指向が5000%理解できる記事 理論編 オブジェクト指向を5000%理解できたら、次に5000兆%理解できように実社会の例でオブジェクト指向を考えてみる。 オブジェクト指向が5％くらい理解できればいいなという記事 魔法のように理解しようとするオブジェクト指向 オブジェクト指向プログラミング（OOP）がちょっとわかるようになるための記事 C#のオブジェクト指向が全く理解できないのでまとめる記事 Listもどきでほんわか理解するオブジェクト指向 カプセル化編 オブジェクト指向設計とは? オブジェクトの「クラス」とかいう言葉の自分なりの理解 分かりそうで分からない少し分かるオブジェクト指向プログラミング vs 関数型 オブジェクト指向と関数型についての自分の考え オブジェクト指向と関数型プログラミングを100‰説明する記事 実践編 オブジェ
AWS認定9冠制覇したのでオススメの勉強法などをまとめてみる
まず11位の「クラウドプラクティショナー」ですが、2018年に新設されたAWSのエントリーレベルの認定です。AWSの基本的な概念や、AWSのベーシックなサービスの特長、請求・アカウントマネジメント・料金モデルなどに関する理解が問われます。エンジニアだけでなくマネージャーや営業など様々なポジションを対象とした認定であるため、問われる知識の範囲は意外に広いです。ただ、知っていれば解ける問題が多いため、この順位にしています。 10位の「Alexaスキルビルダー - 専門知識」は、文字通りAlexaのスキル開発に関する知識が問われます。専門知識と銘打たれていますが、内容自体はそこまで難しくなく、Alexaスキル開発に関して知っていれば解ける問題が多かった印象です。これまでにAlexaスキルを開発したことがあり、クラウドプラクティショナーレベル以上のAWS知識があれば、問題なく合格できると思います。
React Nativeで楽に作るスマホアプリ開発入門（基本編） - Qiita
サンプルコード：GitHub React Nativeを使って楽にスマホアプリを作ろうぜってことでまとめてみようと思います。 ReactJSで作る今時のSPA入門（基本編）の続編です。 ReactJSの基本がわかっている前提で説明します。 ちなみに楽と書いたのはネイティブコードでアプリを作るよりは楽という意味です。 （後は開発サイクルが早く回せるという意味で） React Nativeのアーキテクチャ 参考：React Native Architecture : Explained! React Nativeの構成はざっくり次の図のようになっています。 JavaScriptCoreと言われるWebkitにも使われているJavaScriptエンジンでJavaScript Runtime Environmentが作成されています。React NativeのJavaScriptコードはJavaS
Web API: The Good Partsを読んだので「レスポンスデータの設計」についてまとめた - Qiita
はじめに APIの勉強のために、Web API: The Good Partsを読みました。平易な日本語で書いてあるので、読みやすかったです。 とはいえ、何度も本を読み返すのは大変なので、自分用まとめも兼ねて書こうと思った次第です。 1個1個まとめていくと結構な量があるので今回は「レスポンスデータの設計」についてまとめました。 本でいうと3章に書いてあります。 この記事も参考に Web API: The Good Partsの他のまとめ記事もここに載せておきます。 2.2: Web API: The Good Partsを読んだので「良いURI」についてまとめた 2.6: Web API: The Good Partsを読んだので「OAuthの仕組み」についてまとめた 4章: Web API: The Good Partsを読んだので「HTTPの仕様」についてまとめた 5章: Web AP
出来る限り短く説明するReactJS入門 - Qiita
VTeacher 所属の Masaki Suzuki です。 ※各項目をできるだけ3行以内にまとめています デザイナーさんやフロントのエンジニアさん向けのReact.js（リアクトジェーエス）入門です。 「最近、『リアクト』と聞くけど、つまり何？」ってひとが対象です。 React.jsとは React.jsはUIのパーツ（構成部品）を作るためのライブラリです。 FacebookがOSSとして公開しています。 初回投稿日：2015年06月21日 この投稿はReactが話題になり始めた頃（6年前のv0.1の頃）、整理した記事です。 最新情報はこちら React Server Components 2021年からReactを始めるなら React Server Components 一択ではないか？ https://zenn.dev/rgbkids/articles/e58ef9b947b199
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【Windows】nodistでnodeをインストール - Qiita