【サボりたいエンジニア向け】コーディングに役立つチートシートまとめ - Qiita
はじめに こんな人が役に立つ記事 コーディング業務の効率を上げたい。 コーディングに関するチートシートを知りたい。 打つのもめんどいからコピペでなんとかしたい（笑） 今回は、コーディングに役立つチートシートをまとめました。 VSCODEチートシート エンジニアなら必ず使うであろうVsCodeのショートカットチートシート。これはよく使ってます！ HTML系のチートシート集 HTMLに関するチートシートをまとめてみました。 HTML5 タグチートシート HTML5 のタグチートシート。サイトには 5 から廃止になった避けるべきタグなどもまとめてられており、 PDFでダウンロードできます。 HTML5 入れ子チートシート HTML の入れ子の可否を視覚的に分かりやすく、色づけしてくれます。対象要素の親、子を選ぶだけで、簡単に調べることが出来ますので便利なチートシート 特殊文字一覧：HTMLで使え
「全ての住所フォームがこうなってほしい」 SIerが公開した“使いやすい入力欄”の作り方が話題 ソースコードも掲載
「郵便番号を入れる枠はひとまとまりに」「郵便番号を基にした住所の自動入力を搭載する」といった、使いやすい住所入力フォームを作る知見をまとめたブログ記事が話題だ。「はてなブックマーク」で1000ユーザー以上がブックマークした他、Twitterでも「参考になる」「全ての住所フォームがこうなってほしい」などの反応を集めている。 ブログでは、入力の煩雑さから離脱してしまうユーザーを減らすためにすべきことを大きく4つに分ける。 「郵便番号の枠はひとまとまりに」「郵便番号を入れたら即座に、もしくはユーザーがボタンを押したら住所を自動入力する」に加え「Webブラウザが備える住所の自動入力機能に対応・最適化する」「入力欄は『都道府県』『市区町村』『町名以下』の3欄を基本とし、『建物』欄はオプションとする」といった機能が必要と紹介。それぞれの実装に当たっての注意点などを説明している。 これらの機能を搭載した
キーボード操作を意識したHTML/CSSコーディング
この記事は 「Webアクセシビリティ Advent Calendar 2020」 5日目の記事です。 アクセシビリティ Advent Calenderの記事を寄稿するにあたり、少しの工夫であらゆるユーザーに対して優しいWebサイトを作れるようなHTML/CSSコーディングの方法についてまとめました。より多くの人にとって優しい・使いやすいWebサイトを作ることは訪れてくださるユーザーの方々だけでなく、クライアントにとってもユーザーの機会損失を防ぐことができるので多大なるメリットがあります。（よくコードが適当でもデザインが見えていれば良いって意見を聞くけれどそんなことはない） ただ、アクセシビリティを意識したHTML/CSSコーディングについてのまとめだと内容量が非常に多くなりZennなら記事より本で出したほうがベターになってしまうので、今回は数あるアクセシビリティの視点から「キーボード操作で
AWSによるクラウド入門
真野 智之 (Tomoyuki Mano) <tomoyukimano@gmail.com> version 1.0, 2020-06-19
この時期、業務で低パフォーマンスを出し続ける覚悟 - たごもりすメモ
今この時期、もちろん弊社もCOVID-19関連の事情を鑑みてテレワーク……とはあんまり自分の回りでは言わない、リモートワーク(もっと言うとWFH: Work From Home)してる。自分が完全WFHに切り替えたのは1月半ばくらいだったかなー。もう3ヶ月ですね。 で、どうかというと、業務のパフォーマンスで見ると、自分のいまのパフォーマンスは明らかに悪い。少なくとも良くはない。それは自分でもわかってる。 でももう、これはしょうがない、と思うので、覚悟している。高パフォーマンス出せたらいいとは思うけど、同時にどう考えても無理して仕事で高パフォーマンス出すような時期でもないと思う。 だからこのエントリは、まあしょうがないよね、というのを受け入れよう、という話です。*1 なおこのエントリは業種柄、リモートワークに移行しやすい自分の話しかしていません。生活必需品や医療品関連の小売店舗や病院、窓口が
拝啓、お客様。Webサイト制作のコストはここにかかります。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
令和ですね。こんにちは。バックエンドエンジニアのまさくにです。ゴールデンウィークで休んでいたら、シュワシュワと筋組織が融解し、「自然に帰ろう……自然に帰ろう……」と遺伝子に刻み込まれた内なる声が僕を光射す方へ誘いました。もはや社会復帰は難しいかもしれない。 さて。さてさて。 皆さま、いかがお過ごしですか。新しい期に入り、心機一転したい気持ちでしょうか。何ならアレですか。お持ちのWebサイトをリニューアルしたい、そんな気持ちをそろそろお持ちでしょうか。 失礼ながら、そのお気持ち、 たぶん5ヶ月、遅いです！ 仕事としてWebサイトの制作に携わってから、5年くらいが過ぎました。現在はバックエンドの作業を行いながら、TD（テクニカルディレクション）やPM（プロジェクトマネージャー）として、プロジェクトに関わることも増えてきています。その観点から言って、お客様と我々の間には「Web制作」の考え方にお
Web制作フリーランス13年目の経験から
補足しました 2019/1/17 4:05 AMhttps://anond.hatelabo.jp/20190117033500 ブコメやトラバに一部お答えしています ※本文ここから↓ https://anond.hatelabo.jp/20190113133500 元増田へのブコメでも指摘されていたが、ひとくちに「フリーランス」といっても業種、業態、経験、実力、性格などによってその態様は異なる。 そこでひとつのケースとして俺がWeb制作業界でフリーランスとして約１３年間やってきた経験と、そこから得られた知見などを書いてみたい。Webデザイナー、Web系プログラマーには参考になるのではないかと思う。 どういう人間か満員電車やだ遅刻癖あるので会社員向いてない 朝に弱い、生活不規則自分に甘い。問題先送りタイプ。眼の前の楽しそうなことに飛びついて（増田執筆とか）やらなければならないことを後回しに
「GoogleAnalytics見てアクセス解析して」って言われた時にまずしていること - Qiita
はじめに 僕はウェブサイト制作会社でサイトの運用・アクセス解析担当をしている者です。 ウェブサイトの制作・リニューアルを受注した際にプロジェクトに参加し、クライアントの現状サイトのアクセス解析とレポート作成、リニューアル提案が主な仕事です。 クライアントと直接相対するディレクターから「GoogleAnalyticsの権限もらったからアクセス解析して」とオーダーを受け、アクセス解析を行うことになります。 そもそも、初めて見るサイトを構造から理解し、リニューアルに資する提案ができるようなインサイトを得るまで分析するのは本当に骨が折れます。 さらに（全くの主観ですが）、多くのクライアントはGoogleAnalyticsを「タグ貼っただけ」状態で放置しています。 そのため、計測したデータが整理されていない・そもそも正しく計測できていないということはよく起こります。 そして、そのような計測エラーがノ
【全訳】JSだけじゃない！AirbnbのCSS/SCSSスタイルガイド - リクルート住まいカンパニー Tech Blog
こんにちは！2016年に新卒で入社した、SUUMOのフロント開発グループでエンジニアをしているやなぎさわです。 入社早々SUUMOのCSSを再設計をする機会があり、CSS/SASSのスタイルガイドを研究していたのですが、JavaScriptのスタイルガイドで有名なAirbnbがCSSのスタイルガイドを公開しているのを見つけました。 一人で開発していたり、CSS/SASSを書く人が少人数である場合は意外とその重要性に気付きにくいのがこのCSS/SASSのコーディング規約です。CSSは単純な言語であり単にスタイリングを当てるだけであればわりと簡単にできてしまうのですが、大規模開発や修正が頻繁に必要となる運用フェーズになるとその単純さがゆえにバグを作り出しやすくなってしまいます。 特にCSSでは全てのセレクタのスコープがグローバルであり、気を抜くとすぐにクラス名などが被ってしまいます。BEMとO
【7年かかった】19歳から7年、1人で30個のWebサービスを作り一発当ててもう働く必要がなくなったので振り返ってみる - 考えすぎてしまう人のブログ
どうもせせりです:) 19歳の頃からほぼ1人でRailsでWebサービスを作り始めて早7年 紆余曲折ありなんだかんだで作ったサービスは30個ほどになりました 7年ほど前に一番最初に作ったTwitterアカウントで「僕の夢は25歳までに3億円を稼いで残りの人生を楽しむ事です」などと言っていました あれから7年がたち26歳になり、3億円は無理でしたが残りの人生贅沢しなければ働かずに生きていけるくらいにはなりました Rails勉強会、ハッカソン、未踏、などなど色々参加していましたし、狭いRails界隈なのでもしかしたら勉強会などでお会いした方は覚えている方もいるかもしれません 色々お話を聞いてくださりアドバイス下さった先輩方ありがとうございます あの頃の初心者は無事に夢にたどり着きました！ 振り返ってみれば訴訟起こすぞって怒られたり、警察から電話がきたり、サーバー会社にサービス止められたり、サー
HTMLのheadの書き方、head内に記述する要素の総まとめ
HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「<head> cheatsheet」を紹介します。 <head> cheatsheet 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 去年紹介した以前の版からいろいろと変更されています。 head内に記述する最小限の構成 head内の要素 meta要素 link要素 ソーシャル関連のhead内の要素 ブラウザ・プラットフォーム関連のhead内の要素 メモ head内に記述する最小限の構成 下記はシンプルなWebサイトで必須となるhead内に記述する最小限のタグです。 <meta charset="utf-8"> <meta http-equiv="x-ua-c
Webデザインのスタイルガイドの作り方
Webサイトの制作はどんどん複雑化しており、１人で行う仕事ではなくなってきています。サイト制作では、ビジネスの目的に合わせた一貫性のあるデザインによって、快適なユーザー体験を作り出すことが重要です。 Webサイトを分割してチームでデザインをするときにチームメンバーが共通認識を持つには、デザインドキュメントまたはWebデザインのスタイルガイドを作成することが有効です。これは、エンジニアがデザインを変更してしまうことを防ぐのにも役立ちます。 異なるページの間に一貫した体験を作り出すために、スタイルガイドを用意するのはとても有効です。また、今後の開発やサードパーティ製品が生まれた際も、ブランドのガイドラインに沿い、ブランドの一部として知覚されるようにやすくなるでしょう。 Luke Clum氏は、Webデザインの第一歩としてスタイルガイドを利用することについて、昨年簡単に紹介をしました。この記事で
これから先10年、フロントエンドに関する予言 - mizchi's blog
これは怪文書です ここから10年はWASMがDOMのGCインテグレーションを果たしてJSを置き換えるか、JSがWASMに追いつかれる前にまともな言語として進化しきれるかのチキンレースになる ES Modules のブラウザ実装が枯れた頃に先鋭化したフロントエンドツールセット群は一旦そこで破棄され、シンプル化への揺り戻しが起こる 仮想DOMはブラウザエンジンの何らかの処理で更新が隠蔽されるか専用のDOM更新APIができ、Reactのような実装の手を離れる WASMで git, vim, bashなどが porting されるにつれ、再びWebOSのようなものが試みられる TC39でJSの型アノテーションの構文だけだけ決めよう => V8 が型アノテーションを元にランタイムを最適化したぜ！ => 気づいたら標準化みたいな流れがある IE11のサポートは延長されず、MSがなんらかの強攻策に出る
7つの実例で学ぶ「ワイヤーフレーム通り」のデザインから脱却する具体的な方法
「ちょっと〇〇君！これワイヤーフレームそのままじゃない！」 Webデザイナーなら、できることなら聞きたくないセリフですよね。私自身ももれなく、こう言われた経験はありますし、逆に後輩に対して同じく「これだとワイヤーフレームのまんますぎるね。。」と伝えたこともあります。 この「ワイヤーフレーム通り問題」は、Webデザイナーなら誰しも一度は経験するあるあるの一つと言えますが、なぜ「ワイヤーフレーム通り」と言われてしまうのでしょうか。また具体的に何をすれば、ワイヤーフレーム通りではなくなるのでしょうか。今回はそのあたりの原因と対処方法を考えてみたいと思います。 「ビジュアルを作る力」と「情報を理解・提案する力」 ズバリ結論を言いますが、ワイヤーフレーム通りじゃん…と言われてしまう人は「ビジュアルを作る力」と「情報を理解・提案する力」が弱いと言えます。 ビジュアルを作る力は幅広い表現の中から適切な手
ituore.com - ituore リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
3割の力で作って、新聞やテレビで紹介され、生活費くらいのお金が入るネタサイトの作り方【連載:村上福之】 - エンジニアtype | 転職type
DB設計のメモ。ネタサイトのレベルであれば、これくらいで問題がないと思う ネタサイトの作り方その2: コードをもりもり書く。なるべくPHPで ある程度設計が固まったら、ブラウザでCloud9を起動して、いきなりコードをもりもり書きます。 サーバの言語はPHPが多いです。運良くヒットした時、日本の大きな会社にサービスを売却するのに便利なのはPHPだからです。 Cloud9は素晴らしいです。感動します。無料でいきなりクラウド上のオンラインIDEとサーバを用意してくれます。ApacheとMySQLとRubyとPHPとGitくらいは普通に入っています。 昔は、オンラインIDEは遅くてダメなものが多かったのですが、Cloud9だけは別格です。テキストエディタすら立ち上げません。3割くらいの力でネタサービスを作るには最強の環境です。 オンラインIDEでは珍しく、ターミナルも叩けますので、普通にGitも
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WordPressの任意のループ（サブループ）を作る方法と覚えておきたい指定方法 | HPcode（えいちぴーこーど）
jQueryのoffset()を使う際の注意 - Qiita
まるで辞書!探したいWordPressおすすめプラグインがすぐに見つかるページ【厳選39個】
CodeZine：プログラミングに役立つソースコードが満載な開発者のための実装系Webマガジン
