2020/01/14 昨日突如 zeitからNotionをバックエンドにしたヘッドレスCMSが発表されました!! Excited to share our long-awaited Next.js + Notion statically-generated blog example with the same tech as https://t.co/HVcLCVUO5w! - Edit via Notion - Blazing fast - JAMstack based - Always available - Fully customizable - Incremental SSG - MIT Licensedhttps://t.co/fD2vWxq2Y6 — JJ Kasper (@_ijjk) January 13, 2020 この内容が激アツなので、アツいポイントや使い方を紹介し
GitHubのIssueをNuxtとNetlifyでブログ化するというのをやってみたので解説します。 デモサイト: https://gh-blog.netlify.com/ Issues: https://github.com/miyaoka/gh-blog/issues Headless CMS はじめにHeadless CMSについて解説しておきます。旧来のAPI無しのWordPressのような一体型CMSではなく、コンテンツ管理部分を切り離してAPIでやりとりできるようにするのがHeadlessなCMSです。これによりフロントの実装やデプロイが疎結合になり、好きにできるようになります。 例としてCMSにContentful、デプロイにNetlifyを使う構成だとこんな感じになります。 参考) 次世代Headless CMS「contentful」事始め - Qiita Nuxt.js
Vue.js + Nuxt.js + GraphCMSでHPリニューアルしました 今年2回目となりますが、HPをリニューアルしました。以前は普通にWordPressで作ってたんですが、Nuxt.jsがV1のRCリリースされてたので本格的に触ってたら題材がないのでHP作り変えるかって感じですね。 Nuxt.jsはVue.jsで作ったSPAをSSR(サーバサイドレンダリング)してくれるやつで大変便利なのですが、サーバーサイドというかnode.jsでゴニョゴニョやってるところもあるみたいでそのへん意識してコード書かないといけないので最初は理解が大変でした。ググっても情報も少ないのでGithubで色んなひとのコードを貪るように読みました。 せっかくなのでサーバーレスでいきたいのとCMSどうするかというところで色んなサービス触ったのでその辺の選定を書いてみたいと思います。Vue.js + Nuxt.
リキッドレイアウトのように幅が常に変動するレイアウトのデザインは、動かないカンプからは実際の挙動が読み取れず、デザイナーの意図が汲み取りきれないことが多い。また、複雑化するアニメーションの実装においても、カンプだけではコミュニケーションに不備が生まれてしまう。ほかにも、CMSを使った案件ではデザインカンプと実際のデータの間に齟齬がある可能性もある。 実装効率を高めてスケジュール通りに仕事を終わらせるには、とにかく事前に仕様を固めることが大事だ。ワイヤーフレームやデザインの途中の段階からなるべくデザイナーとコミュニケーションを重ね、想定外の要件が発生しないように気をつけるべきだろう。 この記事では、デザイナーやフロントエンドエンジニアが見落としがちなWebフロントエンドの課題について列挙していく。 ホバー表現を後から指示される ツッコミ 後から仕様追加されると困るから先に決めて! メモ 最近
私は25歳の時に異業種から、Web業界に入りフロントエンドエンジニアになりました。 職業訓練校やスクールに通わず、知識ゼロの状態からフロントエンドエンジニアになるために行ったことや転職活動で使った求人サイト、面接で気をつけたポイントや意識したことをまとめてみようと思います。 これからフロントエンドエンジニアを目指している人、異業種からWeb業界への転職・キャリアチェンジを考えている方の参考になれば幸いです。 そもそもフロントエンドエンジニアとは 一般的にフロントエンドエンジニアとは、HTML/CSS/JavaScript/PHPなどを利用しWebサイトやWebアプリケーションの見た目や操作する部分を構築する人を指します。HTMLコーダーやマークアップエンジニアとの違いは、HTML/CSSの設計がメインの前者に対し、マークアップエンジニアはJavaScriptやPHPの実装、CMSや各種AP
VAddyとCSRFトークン VAddyは脆弱性診断を実行する際に、CSRFトークンを最新のものに更新しながら動作します。そのため「どのパラメータがCSRFトークンか?」を判断するロジックが存在しています。最近あるフレームワーク(後述)について「CSRFトークンを正しく認識できない」というバグを修正したのですが、良い機会なのでメジャーなフレームワークやCMSを中心にCSRFトークンの実装をざっと追ってみました。一覧にしても面白くないので、仮想インタビュー形式にまとめてあります。GitHub上で軽く追ったものが多いので、最新のバージョンでなかったり、解釈が間違っている箇所があるかもしれません。 それでは、どうぞ。 Ruby on Rails 金床(以下、金)「こんにちは。ようこそ。」 RoR「こんにちは」 金「相変わらずシェア高いようですね。」 RoR「はい、おかげさまで。この間はルマン24
攻撃に利用された場合、root権限で任意のコードを実行され、サーバを制御される可能性が指摘されている。 米Oracle傘下のオープンソースデータベース「MySQL」に未解決の脆弱性が見つかったとして、セキュリティ研究者が9月12日に概略やコンセプト実証コードを公開した。サイバー攻撃に利用された場合、root権限で任意のコードを実行され、サーバを制御される可能性が指摘されている。 研究者のDawid Golunski氏が公開した情報によれば、MySQLの脆弱性は複数発見され、、中でも特に深刻な1件については、リモートの攻撃者がMySQLの設定ファイルに不正な内容を仕込むSQLインジェクション攻撃に利用される恐れがある。 この脆弱性は、MySQLの最新版を含む5.7系、5.6系、5.5系の全バージョンに、デフォルトの状態で存在する。現時点でOracle MySQLサーバの脆弱性修正パッチは存在
県や市の公式ホームページ制作の経験から、気をつけておきたい点をメモに残しておきたいと思います。 納品前 納期が3月に集中する 行政サイトの場合、お金は年間予算や国からの特別補助金などから支払われます。つまり基本的に年度を跨ぐことが出来ません。(保守にかかる費用は別です)その為、行政の案件に頼っている制作会社は納期が重なり3月が滅茶苦茶忙しくなります。 年度末は余裕を持ったスケジュールを組んでおきましょう。 見積もりは2割増しで ここで言う見積とは入札時の見積もりではありません。行政の案件をいくつかこなして担当者と仲良くなってくると、コンペの上限金額を決めるために事前に見積を頼まれる事があります。「もし○○みたいな案件だったらいくら位でできそう?期間と見積もり貰えると助かるんだけど。」みたいな感じです。サラリーマン金太郎の東北編で出てきたアレです。大事なのはここで割引など一切考えずに、むしろ
パナマ文書の流出原因は、Wordpressのプラグイン? セキュリティが穴だらけだったことが判明2016.04.11 13:005,428 渡邊徹則 思わぬところに穴が…。 世界中の政治家や経済人、著名スポーツ選手など、いわゆる「世界トップの大金持ち」たちがタックスヘイブンで資産を隠しているのではないかという疑惑が浮上した、パナマ文書問題。その真相をめぐり、いまだ世界を揺るがし続けています。 その情報の流出元については、内部の何者かによるリーク(漏洩)説と、「リークではなくハック」だという説が囁かれています。真相はまだ不明ながら、もしハックだとしたら、Wordpressのプラグインが原因である可能性が浮上しました。 そのプラグインの名は「Revolution Slider」。以前、Slider Revolutionというプラグインを狙ったロシアのマルウェアがありましたが、それと同様、サイト
いま所属している組織で使っている情報共有システムが僕はいまいち好きではなくて,気に食わないところを twitter にガーッと書いたんだけど,さてここで「良い情報共有システムとは」と考えた時にスッと言語化出来なかったので,僕の思う情報共有システムに求めることをここでまとめておくことにする. エディタが腐ってない これは本当に重要で,エディタが腐っていると「Wiki を書こう」という気がそもそも起きないし,起きたとしてもエディタがストレスフルだと文章を書き始めてすぐに嫌になってしまうので最低限エディタはまともである必要がある.さもなくば Wiki は廃墟と化す. WYSIWYG なエディタを利用するのは難しいと思っていて,本当に使いやすい WYSIWYG エディタを作るというのはかなりコストが高い (WYSIWYG エディタはある程度まで完成度が高まっていないと使い物にならない気がする) の
モバイルとソーシャルの時代を迎えたメディア。 その新たな環境へと架橋する存在として、 モバイルエディタが台頭している。 モバイルエディタとはなにか。 そして、その存在理由を問う。 つい最近、著名な英国の雑誌社 Condé Nast でデジタル部門を統括する人物が、衝撃的な発言をしました。同社 Web サイトを来訪するデスクトップ(PC)ユーザーは、来訪者全体のたった 4% に過ぎないというのです。 Digiday に掲載された取材記事は、同社がデジタルコンテンツのパフォーマンス向上を果たすべく実施したデザインリニューアル、共通 CMS 再構築などについて追ったものです。その中から発言をもう少し紹介しましょう。 Web ページをデザインしようとすると、われわれはデスクトップ(PC)用サイトの見え方をどうするかに取り憑かれてしまう。(しかし)われわれの PC 用 Web サイトの読者は、われわ
フォームデータの内容を任意のメールに送ってくれるサービス『Mailthis.to』 『Mailthis.to』はウェブ上に設置してあるフォームに寄せられたメッセージを任意のメールアドレスに送信してくれるサービス。 登録やログインなども一切不要の他、さまざまなオプションを備えた無料のWebサービスAPIとして提供されています。 基本的にはフォームの送信先を通常のものから以下のように変えてやるというだけ。 下線の部分に任意のメアドを指定するとそこにフォームの内容が送られてくるという訳です。 しかしこの場合、平文でメアドを記述するとスパムの問題もあるため、サービス側では実際のメアドでエイリアスを作成することを推奨しており、先ずは元となるメアドに適当なユーザー名などを指定して[Validate Email]をクリックすることで「http://mailthis.to/ユーザー名」が実際のメアドに紐付
カテゴリー CSS (53) Compass (2) Sass (1) Custom (8) Dojo (1) GoogleMap (23) HTML&XHTML (12) HTML5 (1) Information (19) Javascript (42) jQuery (9) Material (9) Memo (71) やる夫がデザイナーの作ったPSDにお怒りのようです (5) MooTools (62) Tutorial (6) Perl (1) PHP (37) CakePHP (2) OOPでBBS (7) Zend Framework (4) Template (29) 4BOX (8) 5BOX (5) 6BOX (4) Form (5) Menu (1) Web Site (6) wordpress (55) plugin (8) Reference (7) Theme
バリデーションでSQLインジェクション攻撃をブロックしないCMSが多い ログインIDにおける典型的なSQLインジェクション攻撃として、'OR 1=1# をバリデーションがブロックするかどうかを確認しました。ログインIDとして許容される文字を見る限り、WordPress、Joomla、Drupalはブロックしそうですが、結果は下記の通りです。 WordPress: ブロックしない Joomla: ブロックする Drupal: ブロックしない MovableType: ブロックしない ということで、意外なことに、バリデーションでSQLインジェクション攻撃を止めるのはJoomlaのみという結果でした。 ログインIDにヌルバイトや改行が使えるCMSがある テストをしていてもっともびっくりしたことの一つがこれです。JoomlaとMovableTypeはヌルバイトや改行など制御文字がログインIDとして
Web屋という仕事のこれから 〜Web動向からWeb屋に必要な技術を考えてみる〜 FutureSync Vol.5 で発表したスライドです。 タイトルは釣りです。前半はほぼネタです。 中身はJavaScriptで動作するデバイスは楽しいからみんなやってみたら? という内容です。Read less
WordPressは2015年4月27日、オープンソースのCMS/ブログプラットフォーム「WordPress」に、深刻なクロスサイトスクリプティングの脆弱性が存在することを明らかにした。同日、問題を修正した新バージョン「WordPress 4.2.1」をリリースし、速やかなアップデートを呼び掛けている。 この脆弱性が影響するのはWordPress 4.2以前だ。コメント機能に問題があり、攻撃者がコメント中に挿入したJavaScriptを閲覧することで、サーバー上で任意のコードが実行される恐れがある他、管理者アカウントのパスワードを変更されたり、新たなアカウントを作成されたりする恐れがある。 この脆弱性を発見し、4月26日付で実証コード(Proof of Concept)を公開したフィンランドのセキュリティ企業、Klikki OyのJouko Pynnönen氏は、WordPress 4.2
概要 Github Pagesでブログ構築ができる静的サイトジェネレーターの総まとめです。 もともと使っていたOctpressからの移行で、HugoとHexoで迷い、デプロイのしやすさや、Node.jsで完結できることなどからHexoに決めました。なので、Hexoの情報は多めになっています。 Assembleも、Grunt・Yeomanでがりがり動かすことができそうで、いつか試してみたいです。 リプレース要件 以下を満たすもの。 Markdownでブログ記事を記述できる(Githubとかで管理したいから) Octopressから移行が可能(最悪手動でもOK) デザインがモダンであること(スマートフォン対応していること) イケてること(色んな意味で) Jekyll|Rails|Github Star 18848 メリット Github Star数No1と人気。 日本語の記事も多い なんでもで
この記事のオリジナルは voxxed に投稿されたものです。 JavaScript関連の問題を抱えるチームをサポートする仕事を通じて、いくつか共通の問題点があることに気づきました。もしあなたもJavaScriptに対するイライラを感じているのであれば、この記事は何らかの助けになるかもしれません。おことわり:私がお教えするヒントはすでにご存知のものもあるとは思いますが、うまくいけば、多少なりとも有用な情報があるかもしれません。特にエンタープライズアプリケーションやCMSソリューションを構築する際に有効なヒントです。チームの誰もが話したがらないCMSのコードについてお話しします。いずれも必要に応じて採用できるものです。 debuggerステートメント 大半のブラウザでサポートされているにもかかわらず、JavaScriptを書く際に最も活用しきれていない機能の1つです。debuggerステートメ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く