↓動画でも解説しています。 Headless CMSとは？ 近年、目にする機会が増えた「Headless CMS」という単語。この記事では、Headless CMS、関連技術、人気のサービスなど、導入に向けた基礎知識をご紹介していきます。導入のためのイメージ作りになれば幸いです。 キーワード1：CMS（Content Manegement System） CMS（Content Manegement System）は、コンテンツ、ファイル、ワークフロー、リポジトリなどの情報を管理・公開するシステム。身近なところでは、WEBメディアの記事、企業サイトの各ページ、ECサイトの商品情報などの管理・公開など幅広く使われています。 画像などのファイルや、投稿の変更履歴、権限の管理など、様々な機能を技術者でなくても利用できるのが特徴です。 CMSを代表するのがWordpress。 2003年にリリース

ワードプレス　Kota Naito / 2017.08.11 独自のカスタムフィールドを追加する方法。プラグインなしでオリジナルの入力項目を追加しよう WordPressが標準でサポートしている入力フィールドは「タイトル」と「本文」の2つとなっているのですが、カスタムフィールドを利用すれば、好きな入力項目を追加することができるようになります。 例えば、「完読した本を毎週紹介していく」といったブログを運営している場合、「本のタイトル」「本の作者」「本の価格」などの独自の入力項目があると便利ですよね。カスタムフィールドを活用すれば、これらのような独自の入力欄を投稿(post)や固定ページ(page)だけでなく、カスタム投稿タイプにも追加することが可能となるのです。 今回は、PHPの知識が無い方でもプラグインを使わずに、コピペするだけで独自のカスタムフィールドを追加する方法を紹介いたします。 ※

Apple Designing for iPhone X アップルがiPhone X（テン）について、開発者・デザイナー向けの情報を公開。iPhone Xでアプリを開発する際の注意点を多数挙げている。 画面の密度と縦横比の変化、画面のラウンドシェイプ化、ボタンがなくなったことによる画面下部の使用禁止などだ。 「iPhone 8に比べてiPhone Xの出荷が遅い理由、うまく動かないアプリを改変するのに時間がかかるからでは……」と、アスキーの誰かがボソッと言っていた。 公開情報は以下のとおり。 Designing for iPhone X https://developer.apple.com/videos/play/fall2017/801/ Building Apps for iPhone X https://developer.apple.com/videos/play/fall201

こんにちは、@yoheiMuneです。 Macを使っているフロントエンジニアの悩みの1つにWindows環境の検証をどうするかがありますが、今回はVirtualBoxを用いて、Mac上にWindows環境を構築する方法をブログに書きたいと思います。 目次 事前準備 VirtualBoxという仮装環境を作るツールを利用します。インストールしていない方は、以下からインストールしてください。 https://www.virtualbox.org/ インストール後に、以下のようにVirtualBoxを起動できればOKです。 VirtualBoxのディスクイメージを入手 Microsoftの公式ページ（以下）より、様々なバージョンのIEやEdgeが入ったVirtualBox用のデータを入手することができます。以下のページから欲しいものをプルダウンで選んでダウンロードします（4GBくらいあって重たいで

2018年4月20日、23日開催の「〜スマホアプリの開発を検討されている方必見！〜 リーズナブルに、高品質でセキュアなスマホアプリを作るコツ」での講演資料

雑談力がつくニュースアプリ

Grow Your Technical Skills with Google Whether you're new to computer science or an experienced coder, there’s something for you here in Google’s Tech Dev Guide. We’ve carefully curated materials from various sources, including some made by Google, that you can use to grow your technical skills, supplement your coursework, and prepare for interviews. Interested in pursuing a career in business? Ch

はじめに この記事は「旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門」の2つ目の記事です。 シリーズの最初から読みたい方は 旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ へどうぞ。 また、このシリーズではECMAScript5を概ね対応するブラウザを対象としています。 もっと平たくいうと、IE8以下は切り捨てます。ご了承ください。 そしてプロによるマサカリ 対策として一つ重要な注意書きをします。 この記事中で出てくる「CommonJSモジュール」という表現は全て「CommonJSのModules 1.0仕様をベースとして、Node.jsが独自に拡張したCommonJS派生のモジュール仕様及びインターフェース(require/exports

Webサイトのデザインやコーディングは、やるべきタスクが年々増えてきました。それらの手間がかかる面倒な事が楽にできるツールやアプリも年々リリースされています。 これからのWeb制作にどんどん取り入れていきたいツールやアプリを紹介します。 Adobe Experience Design(Adobe XD) Adobe XDはWebサイトやスマホアプリのデザインやプロトタイプを作成するベクターベースのツールで、PhotoshopやIllustratorともスムーズに連携して利用することができます。 以前は「Project Comet」の名称で発表されていた新ツールが、2016年3月に「Adobe Experience Design(Adobe XD)」としてプレビュー版が公開されました。現在はOS X版のみですが、2016年後半にはWindows 10への対応も予定されています。

最近、デザイナーに求められるスキルが多くて何を学べば良いかわからなくなってきた。と言う声を聞くようになってきた。 流行りの記事にいくつか目を通すと、デザイナーは「 経営者と対等に話せるコミュニケーション能力、ビジネスセンスを保有していて、イケてるグラフィックを作り、コードまでかけないといけない 」らしい。 スキルを多く保有している方が望ましいのは間違いない。 ただ、 現場デザイナー に最も大事なのは実装面での考慮事項が網羅されて考え込まれた「 決定力のあるデザイン 」を作る力だと思う。 サッカーで言うと、決定力は「 得点を決める能力 」として使われているけど、UIデザインにおいては「 実装面まで考慮された実装可能なデザインであるか 」という言葉として使っている。 魅せるデザインとフィージビリティが考慮されているデザインでは、かなり内容が異なってくるので、現場デザイナーとしては特にこのあたり

注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日本語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日本語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、本家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで

ごきげんよう。フーミンです。 最近のサイトはいたるところにアニメーションする要素が増えてきましたね。 制作ツールや学習環境が充実してきたことによって、実装が簡単になってきたことも要因の一つでしょうか。 実装が簡単になった分、 ｢アニメーション簡単で楽しい！どんどんアニメーションさせてイケてるサイト作るぜ〜！」 と、なにも考えずに何でもかんでもアニメーションさせていたら、 「なんか重いなぁ・・・動きもカクカクしてるなぁ・・・」 なんてことになったことありませんか？ 今回は、もっさり重くなってしまったサイトのパフォーマンスを改善するために、原因の追求と対策について、簡単に説明していこうと思います。 パフォーマンスの改善について まず、ひとことに「パフォーマンスの改善」といっても、 ネットワークパフォーマンスの改善（HTTPリクエストを減らす など） JavaScript & CSSパフォーマン

Meet Phalcon! - Phalcon PHPフレームワークを Nginx on Amazon EC2 にインストール！PHPnginxAWSAmazonLinuxPhalcon あけましておめでとうございます！ cloudpack の @dz_ こと大平かづみです。 今年の初投稿です、今年度もどうぞよろしくお願いいたします！ Prologue - はじめに お気に入りのPHPフレームワーク Phalcon Framework を、Nginx で動かしてみます！ 最初に Phalcon を触った時は、インフラ担当さんに作ってもtらった IIS + Phalcon で動かしていました。 コードは書きますが、環境構築は手順に従うことが多かったのです。 そんな私ですが、自力で試行錯誤して作りました！ Nginx は初めて触ったので至らぬ点もあるかも知れません。 改善・改良点あれば、すぐに

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

Webやアプリに携わるデザイナーにおすすめの企業ブログを厳選しました。各社が提供しているサービスの事例や、ノウハウ、最新トレンドなどあらゆる情報が公開されているので、ぜひチェックしてみてはいかかでしょうか。 dwango creators’ blog http://creator.dwango.co.jp/ 株式会社ドワンゴのデザイナーが運営している、2015年11月にできたばかりのブログです。ニコニコのサービスに関連した記事や、現場で活躍しているデザイナーが実践している便利なTipsが紹介されています。 1pixel http://ameblo.jp/ca-1pixel/ 株式会社サイバーエージェントが運営しているクリエイターズブログです。サイバーエージェントのゲームやWebサービスで使用されている技術や、話題の音楽配信アプリ「AWA」の開発秘話などが掲載されています。 DeNA Cre

はじめに 「これは、素人がAWSを使ってWebサービスを生み出す過程の、自分用メモでございます。」 今の僕の状態は、以下の通り。 AWSアカウント開設 EC2インスタンスをローンチ SSH接続をできるようにして セキュリティグループに「Tyep:HTTP/PortRange:80」を追加 SSH接続後に、LAMPインストール完了で、Public IPをブラウザで叩いてアクセスできるようになった。 今回やりたいのは、 独自ドメイン（お名前.comで取得済み）と、IPアドレスに紐づける！ です。 まずは「Elastic IP」を設定する。 最初は、Public IP（PIP）が設定されていて、Elastic IP（EIP）は設定されていません。 PIPは時間が経つと変わっちゃうみたいで、EIPを設定しておかないと独自ドメイン設定できないっぽい（詳細しりませんが。。）ので、これを設定します。イー

# 2015年12月アップデートしました。本記事の元ネタは2014年11月に書かれたものです。 やはり時代は話題のAWS、ということで。クラウド新時代のIaaSとして、どんどん成長を続けるAWS。クレジットカード登録必須なのが抵抗感を煽っていましたが、やらざるを得ない状況になりつつあるので、とうとう登録しちゃいました。 正直、この手の新しいプラットフォームは流行が廃れたらもう使わなくなる技術だと思っていたわけですが、想像以上に利便性が高く、関連知識がないとWebサービスの構築もできない時代が来る気がしたので、先行投資ということで断腸の思いでサービス登録しました。 ありきたりではありますが、メモ書きとして、Webサーバ構築までの流れをメモ。 Amazon Web Services (AWS)とは？ AWS、正式名称はAmazon Web Services。 ここで語らずとも、そこら中で紹介さ

これにて、Yahooプロフェッショナル試験対策は終了になります。 次回で合格すると思いますので、こちらで試験の合格のための 情報掲載を終了しようと思います。 前回の試験は、848で合格ラインをクリアできませんでした。 こちらよくわからなかったところをおさらいしていきましょう... ラーニングポータルで勉強していきましょう。 http://promotionalads.yahoo.co.jp/online/ 【YDN】 ターゲティング編 ・参照元URLは他社でもおkみたいですね。知らなかった。 ・アニメーション画像について ・

明けましておめでとうございます。 2016年初日は、お祭り用のはっぴを来て出社した五所です。 今年初の投稿をさせて頂きます。 概要 最終的な目的は、WEB広告の運用の自動化。 手始めに、Google Adwords APIでレポートの取得を自動化する。 まだ日本語の情報が少ないので、APIの公式ドキュメントとExampleを見ながら進めた。 現状では様々なフォーマットの広告レポートを、アカウント毎に手作業でダウンロードしている。 そのため一括でダウンロードし、すぐに分析を始められる状態にしておきたい。 ※本投稿は、下記でComposerを使って書き直しました。良かったらどうぞ。 aimstogeek.hatenablog.com 完成像 下記フィールドを持つキャンペーンレポートをダウンロードする。 Date,CampaignName, Impressions,Clicks,Cost,Con