コーディングテストに打ち勝つ - Qiita
ITエンジニアが転職活動をする中で、コーディングテストに出会うことがあると思います。 私もちょうどコーディングテストに出会い色々と対策を行いました。 これからコーディング試験に臨む人の力になればと思い、簡単にまとめておきます。 エンジニアとしての最低限持っていてほしい実装力、アルゴリズムの構築力が問われる試験だと思います。 私の知る限り、下記の３種類があります。 - オンラインサイトでの試験 - 電話で画面を共有しながら問題を解いていく試験 - オンサイトでホワイトボードに問題を解いていく試験（Googleなどで実施されるやつ） 筆者は一番上に３回ほど出会いました。今回は、このオンライン試験形式についてまとめようと思います。 オンライン試験 出題範囲 間違いなくアルゴリズムの問題は出ます。範囲は幅広く、基本的な動的計画法などはおさえておく必要があります。 後は職種や技術領域に応じて、知識問
【使い方まで徹底解説】おすすめJavascriptライブラリ厳選10選！ | 侍エンジニアブログ
どうも！インストラクターの佐野です！ 突然ですが、あなたは100%、いや120%「JavaScriptライブラリ（フレームワーク）」を使いこなせていますか？ ただでさえ使い勝手のいいJavaScriptですが、ライブラリを巧みに使えることで、開発効率やスピードは飛躍的に向上します。ひとくちにライブラリといってもたくさんあります。それぞれのライブラリがどんな使い方ができてどんな用途でどんな特徴があるかイマイチはっきりしない。 そこで今回は、JavaScriptをこよなく愛する私が、おすすめのJavaScriptライブラリ（フレームワーク）を厳選して徹底解説していきます。ライブラリを活用できれば、JavaScriptでの開発が効率的になること間違いなしなのでぜひ参考にしてみてください！ ライブラリとは？フレームワークとは？ JavaScriptは、WEBページやWEBアプリケーションを作る時に
UIとは？UXとは？違いを理解しよう！
成果が出るホームページを構築するうえで欠かせない概念の1つに「UI（ユーザーインターフェース）/ UX（ユーザーエクスペリエンス）」があります。一緒に語られることの多いUIとUXのそれぞれの単語の意味の違いについて、しっかり理解していますか？ デザイナーの方は理解されている方が多いと思いますが、デザイナー以外の方も、UI/UXについてしっかり理解しておかないと、デザイナーとのコミュニケーションに齟齬が生じてしまう可能性があります。 今回は、意味を混同してしまいがちなUIとUXの違いや改善事例を紹介します。 UI（ユーザーインターフェース）とは？＝ユーザーとサービスとの接触面 UIは「ユーザーインターフェース（User Interface）」の略です。Interfaceとは「接点、接触面」という意味で、UIはユーザーと製品・サービスの接触面を指すので、「ユーザーの目に触れる部分使用する部分」
cookie(クッキー)とは？有効・削除の方法や危険性を解説
HOME制作cookie(クッキー)とは？有効・削除の方法や危険性を解説 cookie(クッキー)とは？有効・削除の方法や危険性を解説 ikedakodai DXコンサルタント これまで30社以上のマーケティングオートメーションの運用・構築支援に携わる。 単なるシステム実装だけではなく、LINEやアプリと連動したマーケティングソリューションの構築や広告連動施策など複数製品を組み合わせる大型プロジェクトを得意とする。 Salesforce認定Marketing Cloudコンサルタント、Salesforce認定PadotコンサルタントなどSalesforce製品に関連する資格を多数保有。関連コミュニティにも参画し、Salesforceからの表彰歴あり。 「cookie（クッキー）の受け入れを許可しますか？」 普段PCやスマホを使っている中で、このようなアラートを目にしたことはありませんか？
git mergeでブランチをマージしよう!いろんな疑問を徹底解説 | 侍エンジニアブログ
まずは基本的な使い方を一通り勉強しましょう。次にmergeの一番の難所である、コンフリクトの解消方法も見ていきましょうか。 続けて「ここを理解していないとうまく扱えない」とも言える、マージの2つの種類について学びましょう。それでは宜しくお願いします。 mergeとは? まず早速ですが、マージを一言で説明すると… 「現在のブランチ(HEADの指している場所)へ、他のブランチの更新を取り込む処理」と言えるでしょう。言葉だけではわからないと思うので図にして見てみましょうか。現在の開発状況が、以下の図のようだったとしましょう。 開始地点や丸はコミットです。Aさんの使っているブランチがブランチA。Bさんの使っているブランチがブランチBだったとしましょう。この状況で、AさんがBさんの更新を取り込みたくなったとしましょう。そこで登場するのがマージです。 マージを使用すると… Bさんの更新を取り込み、取り
【CSS】displayの使い方を総まとめ！inlineやblockの違いは？
今回はCSSのdisplayプロパティをマスターしましょう。少し分かりづらい内容ではありますが、Webサイトを作るためには必ず理解しておく必要があります。
新人コーダーに知っておいて欲しいリダイレクトの基本｜クロノドライブ
サイトを運営していると、サイト内のページの移動や削除、またはサイト自体の移転をすることがあります。その場合、リダイレクトという処理を用いて新たなページに転送を行いますが、正しい知識と手順を以って対応しなければ、検索順位の下降、ページランクやドメインエイジの喪失といったSEO的なペナルティを招いてしまいます。 そこで、そのようなペナルティを受けないために、ページ移動・サイト移転時の正しいリダイレクトの設定方法と、代表的なリダイレクトの種類やその実装方法をご紹介します。 リダイレクトの種類 リダイレクトには、HTMLやJavaScriptといったクライアントサイドプログラム、PHPやPerlといったサーバサイドプログラム、あるいは.htaccessの設定変更を行う等、様々な対応方法があります。そのうちのいくつかを、実際のサンプルソースとともに解説します。 metaタグによるリダイレクト hea
【10分でマスター】onChangeでフォームの項目をコントロールしよう | 侍エンジニアブログ
onChangeイベントについて では、まずはonChangeイベントそのものについて学んでいきましょう！ onChangeとは？ そもそもonChangeイベントって何か知っていますか？イベントというのは、簡単にいうと、ドキュメント内で起こる出来事のことです。私たちの日常にも「イベント」や「出来事」が起きますよね。 ドキュメント内でも同じで、様々な事が起こりうる環境なのです。onChangeとは、フォーム内のエレメント（要素）の内容が変更された時に起こるイベント処理の事です。 ユーザーがテキストボックスに書き込んだり、セレクトボックスでオプションを選択したりなどの行動によって、発動するイベントを処理する事ができます。 「onChange」３通りの書き方 onChangeはその用途や目的に応じて3通りの書き方があるので、ここでその概要を確認しておきましょう！ ① フォーム要素のonchan
見やすいサイトを作るときに最低限チェックしたい６項目
いくらコンテンツが良くても、見やすいサイトでないとユーザーはすぐに離脱してしまうでしょう。「見やすい」というのは、コンテキストやユーザーに依存する部分も多いのですが、そこには最低限守るべきルールがいくつかあります。 この記事では、見やすいサイトを作るときに最低限チェックしておきたい項目をご紹介します。 フォントサイズ フォントサイズや行間などは文章の視認性を大きく左右します。 WCAG 2.0では英語などの場合は18ptまたは14ptの太字、日本語の場合はそれと同等の文字サイズが望ましいとされています。1pxは0.75ptと同等とされているので、18ptは24pxとほぼ同等です。さらに、行の高さ（line-height）は150%〜200%、段落の間隔は行送りの1.5倍以上が推奨されています。 ＊18ptは1.5emと同等、14ptは1.2emと同等 そのほか、Googleも読みやすいフォ
HTMLタグ/イメージタグ/画像のサイズを指定する - TAG index Webサイト
この属性を指定することで、画像の表示サイズを変更することができます。 しかし、データ量そのものは変化しないので、巨大な画像を扱う際（サムネイルとして縮小する場合など）には注意が必要です。また、この属性で表示サイズを変更すると、画質が悪くなってしまう場合があります。（画像サイズの変更には、画像編集ソフトを使用した方がいいでしょう） 大きさを変更しない場合でもサイズ指定を行う 画像の大きさを変更しない場合でも、サイズの指定を行っておくことをお勧めします。 （193×130） 例えば、幅193ピクセル×高さ130ピクセルの画像を読み込む場合は、そのサイズをそのまま次のように指定しておきます。 <img src="rainbow.jpg" alt="写真" width="193" height="130"> 画像のサイズを指定しておくと、画像の読み込みを待たずに文書全体が表示されるようになります。
怠惰なエンジニアのためのポートフォリオサイト構築術
DMMグループ Advent Calendar 2019 8日目の記事です。 こんにちは、@kentarom です。普段はDMM GAMESでゲームプラットフォーム開発プロジェクトのフロントエンドエンジニアとして働いています。本記事では個人のポートフォリオサイト (kentarom.com) のリニューアルに取り組んだ話を紹介したいと思います。 ポートフォリオサイトをリニューアルしたい欲 昨年10月にNext.jsとFirebaseを使用して、外部活動 (QiitaやOSS開発、外部発表スライドなど) を集約するポートフォリオサイトを作りました。これは当時、バックエンドエンジニアとしての外部活動の成果物が様々な場所に分散している課題の解決策として実施しました。 Next.jsとFirebaseで更新の手間がかからないポートフォリオサイトを作ってみた - Qiita ポートフォリオサイトでは
イケてるWebデザインで作られたポートフォリオサイト20選まとめ | マイナビクリエイター
ポートフォリオサイトは、ただ作品を掲載するだけにとどまらず、それ自体で、自分の個性やセンス、スキルをアピールできるアイテム。したがって、こだわればこだわるほど、その作成者のデザイン性を色濃く表現することができるでしょう。 自分らしいポートフォリオサイトを作成するために、世のクリエイターたちは、さまざまなアイデア、Webデザイン、構成の仕方を熟慮しています。これまでにポートフォリオサイトを作ったことがない人でも、一流のクリエイターが作ったポートフォリオサイトを参考にすることで、新しい切り口やWebデザインを勉強することができるかもしれません。 それでは、早速参考にしたい20のポートフォリオサイトをご紹介できればと思います。 フリーランスとしてディレクション、デザイン、コーディングを手がけている徳田優一さんのポートフォリオサイト。そのトップページは、アイコンや画像を効果的に配置することによって
あると差がつく！プログラマーのポートフォリオを作ってみよう！ | ポテパンスタイル
ポートフォリオは実績をアピールするための成果集 過去の実績だけでなくポートフォリオ自体の完成度も大切 未経験から就職するためには特に有効 自己紹介・成果物・将来の展望を分かりやすい構成で作成しよう 作ったポートフォリオはこまめに更新して拡散すべき ポートフォリオとは 元々デザイナー職が転職の際に自身の作品をまとめ企業に提出したものを「ポートフォリオ」と呼んでいました。ポートフォリオ(Portfolio)とは「書類入れ」という意味です。ポートフォリオは業界業種によって意味が若干変わりますがIT業界では、自分のこれまでの実績をアピールするための成果集のことを指します。 ポートフォリオは自分のスキルや実績を対外的にアピールするもので、いわば履歴書の自己PRの拡大版です。最近ではWeb上でポートフォリオを公開するWEBポートフォリオがよく使われます。ポートフォリオはプログラマーの場合自分のスキルを
【無料】ポートフォリオHTMLテンプレート（ベーシック） | 未経験からWebデザイナーへ！【2024年版】
シンプルでベーシックなポートフォリオサイト用のHTMLテンプレートです。挙動はデモをご確認ください。 デモ ダウンロード テンプレートをご利用の際は、自分なりにカスタマイズをしてみてください。そのまま利用してしまうと採用担当の方は「あ、この人、手抜きしてるなぁ…」と思ってしまいます。 配色やレイアウト、フォントなどを変えて「自分のポートフォリオ」を作り込みましょう！ Webデザイナー向けポートフォリオチェックリスト84項目。ここを直せば一気に良くなる！ ポートフォリオのチェックリストをnoteで販売中です！激安のワンコイン500円です。ポートフォリオが完成したらぜひチェックしてみてください。ポートフォリオの質が低いと、選べる会社の選択肢が減ってブラック企業に入ってしまう可能性が高まります。今まで何人もそんな人を見てきました…。このチェックリストで改善点を見つけて少しでもポートフォリオを質を
headerとfooterの使い方とデザイン例まとめ【HTML初心者必見】 - WEBCAMP MEDIA
「header」と「footer」っていつ使うの？ 「header」と「footer」は名前の通り、サイトのヘッダー部分とフッター部分を作るときに使います。 では、ヘッダーとフッターが何のためにあるのかからみていくことにしましょう。 ヘッダーを作るためのheaderタグ headerタグは、その名前の通りサイトのヘッダー部分を作るために使われるタグです。 ヘッダー部分はサイトの一番上にくる、大切な部分です。 ヘッダー部分が大切な理由は、２つあります。 １つは、「サイトのイメージを作る」ということです。 どのページを開いてもヘッダーが一番上にくるので、ユーザーにどのサイトをみているのか？を意識してもらうことができます。 もう１つの理由は、「目次をおくことができる」ということです。 サイトの一番上にくる部分に目次を置くことで、ユーザーの使いやすさをあげることができます。 この「DMM WEBC
独学で始める！初心者におすすめのLaravel学習サイト12選
独学で始める！初心者におすすめのLaravel学習サイト12選 初心者向けにPHPのフレームワークであるLaravelの学習サイトをまとめています。独学でも進められる学習サイトで、動画やテキストなど様々な学習スタイルに対応しています。海外のサイトも載せているので、英語も一緒に習得できるでしょう。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 PHPフレームワーク「Laravel」のインストール方法や基本操作、応用の使い方などが学習できるサ
【初心者必見】最強エディタVimの使い方/コマンド30種まとめ | 侍エンジニアブログ
こんにちは！インストラクターの井上です。 ViおよびVimというテキストエディタ、聞いたことはあっても と手を出さなかった人も多いのでは無いでしょうか？ 実際、かなり特殊なテキストエディタなので、色々な事を覚えないといけませんし、使い慣れるまでとても時間がかかります。しかし、高速にテキスト編集が出来るため、もう慣れれば他のテキストエディタを使うことが考えられなくなるでしょう。 今回はそんなVi/Vimの導入方法や、コマンドの使い方を、Vim歴5年の自分が徹底的に紹介していきます。是非この機会に導入して、高速に編集が行えるVim、使えるようになってみてください。 【こんな方に向けて書きました】 Vimとは/Viとは Vim（ビム）とはVi（ブイアイ）という世界でも広く使われているテキストエディタの拡張版です。 そしてViとは、多くのWEBサーバとして広く使われている多くのLinuxOSに標準
フロントエンドエンジニアの年収は？収入UPのコツや1000万円の達成方法 - ITプロマガジン
こんにちは、ITプロマガジンです。 この記事では、フロントエンドエンジニアの平均年収を雇用形態や経験年数など条件別で詳しく紹介していきます。その他フロントエンジニアとして年収1,000万稼ぐ方法やフリーランスの年収、今後の将来性も解説しています。 これからフロントエンドエンジニアを目指そうと考えている方、年収アップの為に転職を検討している方はぜひ参考にしてください。 「案件はたくさんあるはずなのに、なかなか自分の望む案件が見つからない…」 エンジニア市場は売り手市場であるものの、いまだに正しいマッチングノウハウが確立されておらず、多くの方が案件探しに苦労されています。 ですが、現在の市場感や企業側に刺さる経験・スキルを理解し正しく案件探しをすれば、誰でも自身のバリューを活かし単価を伸ばすことができる、というのも事実です。 ITプロパートナーズでは、 ・9割がエンド直案件のため、高単価 ・約
全て無料！パワーポイントのテンプレート27選｜ferret [フェレット]
パワーポイント（PowerPoint）のテンプレートを無料ダウンロードできるサイト19選 ここでは、パワーポイントのテンプレートを無料配布しているWebサイトを紹介します。それぞれ利用規約が異なりますので、必ず確認してから使用するようにしましょう。 1.canva https://www.canva.com/ja_jp/presentations/templates/ canvaのテンプレートはおしゃれで使いやすいものが揃っており、さまざまなシーンで活用できます。プロが作成したデザイン性の高いテンプレートも多く扱っているため、ビジネスシーンにもおすすめです。 パワーポイントで使用する際はppt形式にしてダウンロードする必要がありますが、ログインした状態でなければできません。ログインして好みのテンプレートを選択し、「すべてのオプション」→「保存」→「Microsoft PowerPoint」
![全て無料！パワーポイントのテンプレート27選｜ferret [フェレット]](https://cdn-ak-scissors.b.st-hatena.com/image/square/c74e825f0cc6ed3bf263996fb70bf9a20cb6acfc/height=288;version=1;width=512/https%3A%2F%2Fferret.akamaized.net%2Fuploads%2Farticle%2F2319%2Fog_image%2Fdefault-b900f68e7c541fab0f0b514c294944ea.jpg)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
naotovuorinen.com
