タグ

tutorialとwebに関するsbg3のブックマーク (11)

  • step by stepで始めるwebpack - Qiita

    webpack1系の記事です。 1→2への移行ガイドを見る限り破壊的な変更点はそんなにありませんが、preLoadersやpostLoadersがなくなっていたり、差が出ていますのでご注意ください。 https://webpack.js.org/guides/migrating/ webpackを手を動かしつつ学べる初学者向け資料を作成しました。 公式のチュートリアルもあるのですが、webpackが使用されているOSSのボイラープレートを見る限り、世の中の使われ方に沿ってないかも?と思い書きました。 これから始める人の手助けになれば幸いです。 また最終形のソースをupしてあるので詰まったら見てください。 webpackとは webpack で始めるイマドキのフロントエンド開発の説明が良かったので引用させていただきます。m(_ _)m webpack は WebApp に必要なリソースの依

    step by stepで始めるwebpack - Qiita
  • ひとりでWeb制作できた!「知識0から学ぶ」すごいスライドやサイト27

    作成:2013/07/22 更新:2014/11/01 Web制作 > 先日、お客さんのところへ提案にいったところ、「サイトを自分でも作りたいので定期的に講習会を開いて欲しい。Wordしか分からない。」と言われました。とはいっても、自分である程度、継続して勉強しておかないと、受講する人は2回目以降の受講内容を理解出来ないし、教える人も基知識をしっかり身につけておかないと、質問に答えることもできません。 今回はWeb製作をするなら必ず抑えるべきこと、知識「0」から学ぶ、基的な知識を習得できるスライド・サービス・サイトをまとめました。ディレクションにもOK。メジャーなもの中心です。とはいえ量が膨大になったので、必要な部分だけピックアップして学びましょう。※スライドがないものに関しては、お役立ちリンクをつけてます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ

    ひとりでWeb制作できた!「知識0から学ぶ」すごいスライドやサイト27
  • 配色、デザイン、文章、写真、センスがないとあきらめる前に勉強しよう!|Webpark

    自分が作ったウェブサイトを見て、「センスないな」とへこむことはありませんか? 私はよくあります。色使い、レイアウト、写真、文章などなど、どれをとってもセンスないなとへこんでいました。 けど、センスがないのではなく、単に基礎を勉強していないだけということに最近気づきました。センスはもっと高い次元の話でした。 ということで、センスを言い訳にしてしまいがちな分野の基礎を学べるすばらしい記事を集めました。この記事自体単なるまとめ記事ですが、できるだけ厳選し、読んでほしい順に並べました。皆さん、あきらめずに一緒に勉強しましょう。 配色 アクセントになる色を使うのが苦手で、同色系の色ばかり使ってしまうのですが、これらを読めば恐れずに使えそう。 色彩センスのいらない配色講座 ベースカラー、メインカラー、アクセントカラーに分類してどのような色を選ぶべきか分かりやすく解説してくれています。具体例もあって分か

    配色、デザイン、文章、写真、センスがないとあきらめる前に勉強しよう!|Webpark
  • [CSS]3ステップでマスターする、スマートフォンやデスクトップなど異なるサイズごとに最適なレイアウトを提供するResponsive Web Desingのチュートリアル

    Media Queries初心者でも分かりやすく解説された、スマートフォンやタブレットやデスクトップなど異なる表示サイズごとに最適なレイアウトを提供するResponsive Web Desingのチュートリアルを紹介します。 Responsive Design in 3 Steps [ad#ad-2] 下記は各ポイントを意訳したものです。 Step 1: METAタグ Step 2: HTMLの構造 Step 3: Media Queries さらに実践的な使い方を学びたい人に Step 1: METAタグ スマートフォンなどで採用されているモバイル用ブラウザは、表示するHTMLページの大きさをビューポートの幅に(主に)縮小してフィットさせます。 まずは、この設定をMETAタグを使用して等倍で表示するようにしましょう。 HTML <head>~</head>に下記を記述します。 <meta

  • 海外在住Web屋の私のまわりで最近話題の5つのWebサービス

    2013年3月23日 Web関連記事, 便利ツール Web業界では次々に新しいサービスが開発され、それをあーだこーだと言い合うのがWeb屋の楽しみってもんです。現在私が住んでいるバンクーバーでも同様、Webサービスの話に花が咲きます。その中でサービス自体は前々からありますが、最近よく話題にでるなーというものを中心に紹介していきます!日で何かWebサービスを作ろうとしている方のアイデアの種になるかも? ↑私が10年以上利用している会計ソフト! 1. Fiverr Fiverrは5ドルで誰かにサービスや商品を提供できるサイトです。誰でも簡単にアカウントを作成でき、5ドルで売りたいもの・5ドルで買いたい物を投稿できます。5ドルのうち1ドルがFiverrの収益になります。支払いはPaypalかクレジットカード英語のみですが、同じ英語圏でも通貨の価値に差のある国では5ドルでもいい収入になるようで

    海外在住Web屋の私のまわりで最近話題の5つのWebサービス
  • CSS3、HTML5、jQuery、デザインなどウェブ制作のテクニックが動画で学べるサイト

    CSS3、HTML5、jQuery、ウェブデザインなど、ウェブ制作のテクニックが動画で学べるサイトを紹介します。 Learn Web Design! HTML 5 & CSS3 Video Tutorials & Training Resource [ad#ad-2] 動画は有料会員向けのコンテンツですが、無料でも数多くの動画を見ることができます。無料で見るときに、登録などは必要ありません。 動画はすべて英語で、英語が苦手な人でもコードや成果物を見るだけでも勉強になると思います。下記にいくつか紹介します。

  • 初心者さんのためのWebサイト制作に役立つリンク集

    2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください!」との声が多いのですが、日のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください! ↑私が10年以上利用している会計ソフト! Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため?何のため?Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム(Webサイトのレイアウト)を作成 Webサイトの骨組み: ワイヤーフレームを素早く・

    初心者さんのためのWebサイト制作に役立つリンク集
  • ソースコード&チュートリアルが公開されている今風のToDo管理ツール『Colored List』 | 100SHIKI

    ソースコード&チュートリアルが公開されている今風のToDo管理ツール『Colored List』 December 7th, 2009 Posted in ライフハック・生産性 Write comment ウェブサービスを作ってみたい、という人に役立ちそうなサイトのご紹介。 Colored Listは今風の、Ajaxを使ったToDo管理ツールである。会員登録をしてログインすれば使い始めることができる。項目の並び替えもドラッグ&ドロップでできたりとなかなか快適に使うことができる。 こうしたツールはよくあるが、Colored Listがユニークなのは、ソースコードと作成するためのチュートリアルがあわせて公開されているという点だ。 ウェブサービスを作る際にはなるべく興味をもつようなアプリの方が良いのは間違いない。いまさらアドレス帳とかではテンションが下がるだろう。 ツールを使ってみて気に入ったら

    ソースコード&チュートリアルが公開されている今風のToDo管理ツール『Colored List』 | 100SHIKI
  • http://www.designwalker.com/2009/05/design-process.html

    http://www.designwalker.com/2009/05/design-process.html
  • Tumblr(タンブラー)のすすめ。初めてTumblrを利用する人へ、遊び方や使い方、おすすめtumblr紹介など。 | AppBank

    Tumblrの使い方、その1:会員登録 https://www.tumblr.com/ Tumblrへ行きましょう。 で、会員登録です。 希望するアカウント、パスワード、メールアドレスを入れて終わりです。 Tumblrの使い方、その2:ダッシュボード https://www.tumblr.com/dashboard ログインすると、Tumblrのダッシュボード(会員登録済みの人のみ)が開きます。ダッシュボードでは投稿やreblogなどができます。 とりあえず、一旦ここを放置して、他人のTumblrを見ることに進みましょう。 このダッシュボードで何ができるかを考え出すと、よくわからなくなり、ここでTumblrは終了・・・となりかねません。ここは一旦無視です。次へ進みます。 Tumblrの使い方、その3:他人のTumblrをフォロー Tumblrにログインした状態だと、他人のTumblrを見た

    Tumblr(タンブラー)のすすめ。初めてTumblrを利用する人へ、遊び方や使い方、おすすめtumblr紹介など。 | AppBank
  • チュートリアルでここまでやる?というプロレベルのWEBレイアウト作成チュートリアル:phpspot開発日誌

    チュートリアルでここまでやる?というプロレベルのWEBレイアウト作成チュートリアル 2009年03月17日- 150 Useful Adobe Photoshp Web Design Layout Tutorials and Techniques | 2experts Design - Web Design and Graphic Design Blog チュートリアルでここまでやる?というプロレベルのWEBレイアウト作成チュートリアル。 プロレベルといっても様々ですが、そのなかでも優れたといえるレイアウトとデザインのチュートリアルが公開されています。 真似することでそれなりのものを作るのは難しくなさそうです。 Create a Magic Night Themed Web Design from Scratch in Photoshop マジックをイメージした、少し怪しげなレイアウト。占

  • 1