Edited at

2018年【1-6月】使用中のおすすめWebサービス(プログラミング系)リスト

More than 1 year has passed since last update.

2018年【1-6月】使用中のおすすめWebサービス(プログラミング系)リストです。ごちゃついてうまく整理できてない気もしますが、それは追々精査していきます。

※画像は全てリンク先ページより転載しています。


おすすめシリーズ


  1. 2018年【1-6月】使用中のTrelloのおすすめエクステンションリスト - Qiita

  2. 2018年【1-6月】使用中のChromeのおすすめエクステンションリスト - Qiita

  3. 2018年【1-6月】使用中のMacのおすすめインストールアプリリスト - Qiita

  4. 2018年【1-6月】使用中のおすすめWebサービス(Web解析系)リスト - Qiita

  5. 2018年【1-6月】使用中のおすすめWebサービス(デザイン系)リスト - Qiita

  6. 2018年【1-6月】使用中のおすすめWebサービス(プログラミング系)リスト - Qiita


リスト


セキュリティ


Kaspersky Cyberthreat real-time map

サイバー脅威リアルタイム可視化ツール。世界のサイバー脅威をリアルタイムで可視化して地球儀上に表現します、Kasperskyのが一番綺麗。セキリュティ意識向上のため。

list-web-service-programming_01.png


Norse Attack Map

サイバー脅威リアルタイム可視化ツール。世界のサイバー脅威をリアルタイムで可視化して地図上に表現します。気分転換に眺めていたりします。でも、セキリュティ意識向上のため。

list-web-service-programming_02.png


リアルタイム・インターネット・モニター

インターネットの状況をリアルタイムで監視し、世界中の攻撃トラフィック、ウェブ接続速度、ウェブトラフィックの輻輳を表示。インターネットが好きなので、今どういう状況なのか知るために眺めたりしています。

list-web-service-programming_03.png


AWS構成図作成ツール


Cloudcraft

AWS構成図作成ツール。[ Cloudcraft Live ] 機能を使ってアカウントに紐づくAWS構成をスキャンして構成図を作成してくれるのはかなり便利な機能だと思う。

list-web-service-programming_04.png


AWS シンプルアイコン

AWS製品およびリソースの公式アイコンセット。PPTX、EPS、PNG、SVG等のアイコンセットをダウンロードできます。

list-web-service-programming_06.png


SSL設定


Generate Mozilla Security Recommended Web Server Configuration Files

各種WebサーバSSL設定生成ツール。Mozillaが開発しているサービスでconfigファイルを作成する際に使用します。

list-web-service-programming_07.png


Certbot

無料SSL/TLSサーバ証明書[ Let's Encrypt ]クライアントソフトウェア。「Certbot」を使用することで、SSL/TLSサーバ証明書の取得・更新作業を簡単に自動化できます。

list-web-service-programming_08.png

Qualys SSL Labs

SSL Server Test(SSL脆弱性診断)サービス。URLを入力して、SSLサーバ証明書の設定状況の確認や安全性診断などが無料で行えます。

list-web-service-programming_09.png


ローカル環境公開


ngrok

ローカル環境公開ネットワーク共有サービス。最近知ったサービス、ローカル環境をちょっと確認してもらいたかったり、スマホやIE上での動作確認をしてもらいたい時に、生成したリンクを送って確認してもらえます。SSL通信やBasic認証にも対応しています。

list-web-service-programming_10.png


Linuxコマンド


美女Linux | Linuxコマンドをもっと素敵で身近に

Linuxコマンドリファレンス。美女がLinuxコマンドのボードを持っています。

list-web-service-programming_11.png


HTML


HTML5リファレンス

HTML5のリファレンス。タグの参考に使用しています。

list-web-service-programming_12.png


HTMLHint

HTML構文チェックツール。設定を元に[ htmlhintrc ]ファイルを生成できます。

list-web-service-programming_13.png


CSS


stylelint

CSS構文チェックツール。CSSだけでなくSassやLessにも対応し、また不要なプレフィックスを制限することができます。

list-web-service-programming_14.png


Specificity Calculator

CSSセレクタのポイントビジュアル化サービス。CSSの優先順位が簡単に計測できます。

list-web-service-programming_15.png


Can I use

HTML・CSSのブラウザ対応確認サービス。HTMLやCSSが各種ブラウザに対応しているかチェックできます。

list-web-service-programming_16.png


I want to use

要素シェア確認サービス。使おうと検討している要素がどれくらいのシェアに対応できそうかチェックできます。

list-web-service-programming_17.png


Free Css generator

Media Queriesコード生成サービス。設定したブラウザやデバイスに対応したメディアクエリ設定のCSSコードを生成します。

list-web-service-programming_18.png


Unused CSS finder

未使用CSSチェックサービス。スタイルが当たってないCSSをチェックします。

list-web-service-programming_19.png


何番目系の便利なCSSデモ

CSS適応箇所チェックサービス。スタイルが当たる箇所をチェックします。

list-web-service-programming_21.png


Browserling

クロスブラウザチェックサービス。IEの簡易確認などで使用しています。

list-web-service-programming_22.png


css2sass

SASSコンバートサービス。CSSをSASSに変換できます。さっと確認したい時などに便利。

list-web-service-programming_23.png


Responsive Checker

レスポンシブイメージ確認サービス。さっと確認したい時などに便利。

list-web-service-programming_24.png


CSScomb

CSS記述順設定出力サービス。CSSプロパティの記述順を設定することができます。

list-web-service-programming_27.png


JS


ESLint

JS構文チェックツール。使用可能にしたら設定は公式の推奨を利用。

list-web-service-programming_25.png


JSBEN.CH

コードパフォーマンスチェックサービス。ブロック上の二つのコードのどちらがパフォーマンス的に優れているか比較できます。

list-web-service-programming_26.png


HTML/CSS/JSその他


The Ultimate Website Code Generator

HTML・CSSコード生成サービス。OGPやmeta要素にも対応しています。

list-web-service-programming_33.png


Href Tools

各種変換・圧縮まとめサービス。HTML/CSS/JSの圧縮、ファイル変換などを行うことができます。

list-web-service-programming_51.png


自作のWebツール集

各種Webツールサービス。チェッカーなど希望用途のものがあるかさっと確認する用に便利。

list-web-service-programming_34.png


copypet.jp

Webパーツリファレンスサービス。希望用途のものがあるかさっと確認する用に便利。

list-web-service-programming_35.png


The W3C Markup Validation Service

コードチェックサービス。W3C基準でコードが対応しているかチェックできます。

list-web-service-programming_36.png


CodePen

HTML/CSS/JSオンラインコードエディタ。動作をさっと確認したい時に便利。

list-web-service-programming_37.png


SNS対応


HEY META

OGP・meta要素用コード生成サービス。TwitterカードやFacebookのコード、Googleなどの検索エンジン用のコードを確認・生成できます。

list-web-service-programming_28.png


OGP画像シミュレータ

OGP画像シミュレータ。作成した画像をタイムライン上に載せた時の実際の見た目を検証することができます。

list-web-service-programming_29.png


デバッガー

シェアデバックサービス。ウェブサイトのコンテンツがFacebookやMessengerなどでシェアされたときに使用された情報を見ることができます。

list-web-service-programming_30.png


ページプラグイン

ウェブサイト埋め込み用Facebookページコード生成サービス。公式のサービスなのでなるべくこちらを使用するようにしています。

list-web-service-programming_31.png


Card Validator

Twitter Cards検証サービス。公式のサービスなのでなるべくこちらを使用するようにしています。

list-web-service-programming_32.png


その他


パスワード生成(パスワード作成)

パスワード生成サービス。シンプルなので結構頻繁に使っています。

list-web-service-programming_38.png


ご利用環境チェックツール

利用環境チェックサービス。同僚に便利だと思うと行ったら不思議に思われたけど、お客さんや非ITなど慣れてない人の現状をさっと調べたい時には便利だと思うんだけどな。

list-web-service-programming_39.png


全角半角 変換ツール

全角半角変換サービス。文章校正時の確認用。半角全角、あと空白は人間の目で確認しないように心がけています。

list-web-service-programming_40.png


疑似個人情報データ生成サービス

疑似個人情報データ生成サービス。検証用ダミーデータ作成の際に使用しています。結構細かく設定できます。

list-web-service-programming_41.png


ダミーテキストジェネレータ

ダミーテキスト生成サービス。サンプルを作成する際になるべくイメージに近づけるために使用しています。

list-web-service-programming_42.png


Gzipチェッカー

Gzipチェックサービス。サイトがGzipに対応しているか確認するために使用しています。

list-web-service-programming_43.png


リダイレクトチェッカーツール

リダイレクトチェックサービス。301やhttpからの遷移を確認するために使用しています。

list-web-service-programming_44.png


ファイル権限変換ツール

ファイル権限確認サービス。chmodコマンドを使用する時など、ぶっちゃけターミナルでオプションつけて整形してファイル権限の数値を確認することもできるけど、めんどくさい。

list-web-service-programming_45.png


Mergely

テキスト差分確認サービス。difff《デュフフ》も便利だと思うけど、コード差分の結合などをしたい時はこちら。

list-web-service-programming_46.png


HackMD

オンラインMarkdownエディタ。俺自身はローカルでさっと書いてファイルのエクスポートだけしたいのでLiveMdを使っているけど、エクスポートできない(はず)けどチームでリアルタイム編集したいならこれはとても使いやすいと思う。

list-web-service-programming_47.png


paiza.IO

オンラインIDEサービス。写経などの学習の際にさっとコードの動作確認したい時に便利です。

list-web-service-programming_48.png


codic

コードネームング生成サービス。ネーミングで迷った時に使います。

list-web-service-programming_49.png


文字エンコード判別

文字エンコード判別ツール。そのテキストの文字エンコードが何か知りたい時に使用します。

list-web-service-programming_50.png


その他情報