タグ

webに関するnaoto408のブックマーク (10)

  • Webサイトを作る際に超参考になったデザインのサイトまとめ - Qiita

    はじめに 仕事でWebサイトを作った際に、 デザイン案で非常に参考にさせて頂いたサイト様をまとめました。 Parts. SaaSのサービスサイトやLPを中心としたデザインの参考サイトです。 部分ごとにパーツやセクションごとのデザインが載っているので、 探しやすくとても参考になりました。 動くWebデザインアイディア帳 「動かしたいパーツ」ごとの逆引きリストを扱っているサイトです。 機能的 or 印象的で有効なデザインが多数載っており参考になりました。 ※注意として 動くWebデザインアイデア帳のサイトは、書籍に明記している通り「3年間の期限付き」です。 (※書籍の売れ行き次第で変わります。) ちなみに実践編の方ですが、私も書籍を購入させて頂きました。 Web Design Trends(ウェブデザイントレンド) Webに関わる全ての人のためのメディアです。ウェブサイトの制作やデザインに役立

    Webサイトを作る際に超参考になったデザインのサイトまとめ - Qiita
  • 【Python】フレームワークFlaskの基本をマスター | 侍エンジニアブログ

    まずは、簡単にFlaskとは何か、その特徴について説明しようと思います。 FlaskはWebフレームワークで軽量で機能がそこまで備わっていないということが最大の特徴です。Webフレームワークというと、RubyRailsPythonではDjangoなどが有名ですね。 しかし、Djangoなどは機能などがありすぎて逆に使いにくい上にFlaskに比べるとかなり重いというデメリットがあり、個人的にはFlaskの方が好きです。機能が多く備わっていないということは、逆に自由がきくということでかつ余分な機能がないので簡単に習得することができ学習コストは低いと言えるでしょう。 Flaskをインストールしよう ではまずは、インストールしないことには始まりませんのでFlaskをインストールしておきましょう。 ターミナルを起動して、以下のpipコマンドを実行します。 pip3 install Flask と

    【Python】フレームワークFlaskの基本をマスター | 侍エンジニアブログ
    naoto408
    naoto408 2018/09/26
    “PythonのwebフレームワークであるFlask”
  • ngrokが便利すぎる - Qiita

    はじめに 先日利用したngrokというサービスが便利過ぎたので紹介します。 ngrokとは 簡単にいうと、ローカルPC上で稼働しているネットワーク(TCP)サービスを外部公開できるサービスです。例えば、ローカルPCのWebサーバを外部公開することができます。 ngrokの導入 ngrokにユーザ登録 ngrok公式サイトからユーザ登録します。Githubアカウント、Googleアカウントでも登録できるのでお好みで登録します。 ngrokコマンドをインストール ngrokのサービスを利用するには、公開されているngrokコマンドを使用します。ダウンロードサイトからOSに合ったファイルを取得します。ツールはzip圧縮されているだけなので、ファイルをダウンロードしたら任意の場所に解凍します。 ngrokコマンドをインストール ツールのインストールが完了したら、アカウント登録後に表示される「Wel

    ngrokが便利すぎる - Qiita
    naoto408
    naoto408 2018/08/19
    これは待ち望んでいたものかも???後で見てみよう。
  • Webブラウザの作り方 - Qiita

    この記事は何? ほとんどタイトル通りです。 順番に読み進めていけば簡単なWebページが表示できるレベルのWebブラウザを作ることができるように執筆していく予定です。 またアルゴリズムだけをなるべくわかり易く解説していきたいので、記事内で紹介するコードは誰でも読める程度の擬似コードです。 自分で実装したい方は、面倒かもしれませんがそれぞれの言語に翻訳してください。 必要な知識としては: HTML/CSSが困らない程度に読める やる気 これだけです。 (あとこれはただの宣伝ですが、個人的にWeb ブラウザを作ってるので(http://github.com/maekawatoshiki/naglfar) スターをつけてもらえると喜びます) いろいろとパースする Webページは基的にHTMLで書かれていますね。あとCSSも。 HTMLCSSもそのままではただの文字列であって扱いづらいので、パー

    Webブラウザの作り方 - Qiita
  • Web制作者のためのおすすめChrome拡張15

    2018年1月16日 Webサイト制作, 便利ツール 普段使っているChromeをより便利にしてくれる拡張機能。私も様々なものを入れていますが、その中でもWeb制作時に使える便利拡張をいくつか紹介します。Firefoxに対応しているものもありますよ! ↑私が10年以上利用している会計ソフト! Web Developer Chrome拡張|Firefox Add-on|GitHub|公式サイト Webに携わる人は入れておいて損はない拡張のひとつ!長年利用させていただいてます。1クリックでCSSJavaScriptを無効化したり、画像の非表示、様々なデバイスサイズでの表示、クラスやID名の表示、定規やカラーピッカーまで揃っています!カラーピッカーはCSSで定義されたものだけでなく、画像からも抽出できるのがすごい。日語版もあるので試してみてくださいね。 CSS Peeper Chrome拡張

    Web制作者のためのおすすめChrome拡張15
  • ShellScriptで作るウェブサーバー - Qiita

    これだけで今いるディレクトリのファイルを http://localhost:3000 にアクセスするだけで見ることができます! 知らない人もいると思うので書きました! ぜひ役立ててください! で終わると思ったか この世界では……shellscriptだけで動くか動かないかなんだよ! なので、標準で入っているコマンドだけでウェブサーバーを立ててみようと思います。 Netcatというコマンド Netcat(nc)とは、Unix系のOSには大体標準で入っている、TCPやUDPのパケットを読み書きすることができるツールです。 例えば。tcpの通信を待ち受けることができます。 次のコマンドでcurlからのリクエストを読み取ってみましょう。

    ShellScriptで作るウェブサーバー - Qiita
  • Registered & Protected by MarkMonitor

    This domain is registered and protected by Markmonitor More than half the Fortune 100 trust Markmonitor to protect their brands online.

    naoto408
    naoto408 2018/01/01
    WEBサイトがどのような仕組みで出来ているかレポートを出力してくれるサイト。
  • ウェブページを1秒台で表示させる原理と方法 | Philosophy Guides

    可能な限り最新の情報を反映していますが、追いつけていないこともあります。サイトに採用していても、記事に反映できていない設定もあります。ページのソースを読んでいただくと、参考になる箇所があるかもしれません。 ウェブページの高速化に関するテクニックは、ネットで検索すれば簡単に見つけることができます。優れた情報も数多くありますが、「CSSJavaScriptはminify(ミニファイ)しておけばOK!」のような都市伝説も少なくありません。 そこで、ここではサイトのデザインリニューアル時に施した対策をもとに、一歩進んだウェブページの高速化の方法と、それを支える原理について、できる限り分かりやすく説明したいと思います。フロントエンジニアやデザイナーの方からすれば「んなもん知っとるわ!」な情報なのかもしれませんが、都市伝説を駆逐すべく、私なりの仕方で解説(≒加勢)したいと思います。 初めに結果を

    ウェブページを1秒台で表示させる原理と方法 | Philosophy Guides
  • 大規模運用で見えるWebプロトコルの理想と現実、そして今後 #html5j #html5j_b

    ↓↓↓↓訂正あります。↓↓↓↓ 2018/07/02に株式会社エフコード社内で行われた勉強会のスライドです。 訂正版(随時更新中): https://docs.google.com/presentation/d/15HOMfAbtdWwO48njcB8IdkN3kVAMu3wsmZo0O3S-f_4/edit?usp=sharing 専門家による資料・専門家向けの資料ではありません。自分自身で学習し、論文・文献等を読解してまとめた内容となります。間違い等あるかもしれませんが、あれば是非コメント頂ければと思います。 【訂正事項】 スライド16: 誤:たった一つのプロセスが故障しただけでも有限時間で合意できない 正:たった一つのプロセスが故障しうるだけでも有限時間で合意できない スライド20: 誤: 重要: あるschedule σ1, σ2 がdisjoint (nodeが被ってない) なら

    大規模運用で見えるWebプロトコルの理想と現実、そして今後 #html5j #html5j_b
  • ブラウザレンダリングを理解するため簡単にまとめてみた - Qiita

    初投稿です。よろしくお願いします(/・ω・)/ 新卒入社してフロントエンドエンジニアとして働き始めて早半年。 最近は、自分の書いたコードが世の中にリリースされて嬉しさを噛み締めながら楽しく社会人生活を送っています。 こんなを読み始めました Webフロントエンド ハイパフォーマンス チューニング -久保田 光則 (著) webパフォーマンスについて...要はサイトの 速度改善 について学べるです。 冒頭に「ウェブパフォーマンスとは何か」が書かれてます。 ウェブパフォーマンスを改善することは、ユーザが目的の達成の為に費やす時間やリソースを節約させることであり、その節約した分ユーザを豊かにしているわけです。 ウェブページ遷移時の初期ロード時のパフォーマンスだけでなく ウェブページ内でのインタラクション(ユーザが起こした操作に対しての応答)の描画のパフォーマンスが重要になってきます。 読み込み

    ブラウザレンダリングを理解するため簡単にまとめてみた - Qiita
  • 1