Notionを便利にするサービス16選 - Notionがあなたのチームを強くする(13)
この連載では、Notionであらゆるものを作れるとご紹介してきました。Notion単体でも非常に強力なツールなのですが、実は他のツールやサービスと組み合わせることによってさらに実現できる世界が広がります。 今回は、Notionを便利にするサービスをご紹介します。 1. リッチなWebサイトを作れる「Wraptas」 リッチなWebサイトを作れる「Wraptas」 Wraptas https://wraptas.com/ Notionの標準機能としてもWebに公開することはできますが、Wraptasを利用するとさらにカスタマイズできるようになります。 独自ドメインを利用できる JavaScript, CSSを設定できる SEO向けの設定ができる 例えばBLAM社の採用サイトやSHIBUYA SLOW STREAMのサービスサイトはWraptasによって作られています。一見するとNotionで
実装者が作業前にデザイナーへ確認しておくとよいこと
TAK(@tak_dcxi)です。 コーダーやフロントエンドエンジニア（以下実装者と呼ぶ）が作業に取り掛かる前に事前にデザイナーに確認しておくとよいことを独断と偏見でまとめました。過去に面倒臭がって聞くのを放棄して失敗した経験もあるので、自戒の念も込めています。 デザインの共通ルールを確認する 余白のサイズやフォントサイズや使用している色などはルール決めがされているとは思いますが、デザインのルールを実装時に分かりやすくしておくことで効率的かつ保守性や拡張性に強いコードが書きやすくなります。 逆に実装時にルールが分からないと、実装者がデザインカンプを見てもそのルールを理解するのに時間がかかってしまうことも多いです。余白であれば感覚で配置されてるのか、似たような箇所で17pxであったり23pxであったり…と意図が分かりかねる場合もあります。余白は原則8の倍数で行うみたいなルールが事前に実装者に
現役デザイナー直伝！最高のアニメーションを作成する7つの小技テクニックまとめ
アイデアをカタチにするツールはたくさんありますが、個人的に最高のアニメーションツールは引き続きAfter Effectsと言えるでしょう。ただし、利用できるプラグインが多すぎて、どれを使って良いのか迷ってしまうのが悩みどころ。 今回は、現役デザイナーがウェブサイトやアプリのアニメーション作成で実践しているプラグインやツールを、7つのシンプルな手順を追ってご紹介します。このガイドラインでは、デザイナーとデベロッパーが一緒にプロジェクトを進める効果的な方法をマスターできます。 No.1 SketchかFigmaでデザイン開始 レイヤーにきちんと名前を付けているか確認しましょう。After Effectsに取り込んでしまうと、レイヤーを見つけるのが難しくなってしまいます。 AEUXプラグインを利用することで、SketchまたはFigmaで作成したレイヤーをAfter Effectsにボタンひとつ
スプレッドシートをWeb開発の万能ツールに変えるおすすめサービス厳選まとめ！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、Googleが提供しているスプレッドシートを表計算ではなく、Web開発の即戦力になる万能ツールへと変えてしまうサービスを厳選してご紹介しようと思います。 スプレッドシートのデータを活用して、Webコンテンツを作成したりデータベースとして活用するなどさまざまな開発手法に応用できるので、ご興味ある方はぜひ参考にしてみてください！ ■スプレッドシートのデータを即座にAPIで提供する！ 【 SwiftSheet 】 SwiftSheetはExcelやスプレッドシートなどで管理しているデータを、即座にRESTful APIとしてホスティングしてくれるのが大きな特徴です。 CSVで保存したファイルをアップロードするだけという簡単な操作のため、ユーザー登録や課金などは一切不要です。 たとえば、お店のリストをスプレッドシートで管理しているとします。 こ
ちょっとしたデータまとめにも便利！ Googleスプレッドシートで「GAS（Google Apps Script）」をつかってみよう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、フロントエンドエンジニアのハルです。 最近、スプレッドシートでデータをまとめることにハマっています。特に、GASという便利なスクリプト言語を書くのがとても面白くて……。今回はそのGASについて、触り程度ですがご紹介したいと思います。 GAS(Google Apps Script)とは Javascriptベースのスクリプト言語で、Googleのサーバーでスクリプトを実行することができます。 Jvascriptを使える方なら、問題なく扱うことができるはず。このGASを使用すれば、Googleのスプレッドシート・ドキュメント・Gmailなどと容易に連携することが可能になります。今回はスプレッドシートの操作を行う方法を紹介しますが、「なんでもできそう」という気持ちになってもらえると思います。 ダイアログボックスをポップアップさせてみる 最初なので、まずはファイルを作成するところから紹
管理画面で設定できる！GoogleタグマネージャでGoogleアナリティクスを一元管理！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、なっちゃんです。 少し前になるのですが、6月にWeb制作の実績紹介サイト「LIG WORKS」を新しくリリースしました！ このプロジェクトは必要最低限の機能とページ数でスタートしたものなので、まだまだ完成ではございません。今後、もっともっと魅力的な実績サイトにしていくために、改善を加えていく予定です。 新しくサイトを立ち上げたとき、アクセス解析はとっても大事ですね！ 普段はGoogleアナリティクスのタグを埋め込んで数字を見ていくことが多いのですが、今回は思い切ってGoogleタグマネージャを使ってみることにしました。 今回のブログではGoogleタグマネージャでGoogleアナリティクスの設定方法を解説します！ 下記の画像からLIG WORKSが見れるので、よかったら見ていってくださいね♪ なぜGoogleタグマネージャを使用したのか 制作実績サイトの制作は「必要最低限のみで
SEO対策の必須ツール！Search ConsoleとGoogleアナリティクスの連携方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、ディレクターのちゃんれみです。 Googleアナリティクス連載第8回目は、あゆみさんからバトンを受けて「Search Consoleとの連携方法」を紹介します。Search ConsoleはSEO対策で絶対に欠かせないツールです。 読み方は「サーチコンソール」です。 ちゃんれみはこの記事を書くまでずっと「サーチコンソーレ」だと思ってました。 Search Consoleとは Search Console（旧ウェブマスターツール）とは、Googleが提供している無料ツールのことです。 主にGoogleの検索結果上でのデータや改善策を調査するときに活用したりしなかったりします。 つまりGoogleアナリティクスではユーザーがサイトに訪れた後の解析ができ、Search Consoleではサイトに訪れる前（検索結果画面）の解析ができます。 本来この2つは別々のツールですが、連携すること
MAMPとGoogleDriveの共有でMySQLが起動しなくなったときの備忘録
WordPressやサイトの開発環境としてMAMPを使っているのですが、急にMySQLが起動しなくなりました。 一回設定してしまえばあまり扱うこともなく、結構苦戦したのでその様子を備忘録として残しておきます。 設定上Google Driveで進めますが、ドロップボックスをお使いであれば以下の文章のGoogle ドライブを「Dropbox」に変更しても可能かと思います。 現状 ・MAMPのデータ保存先をローカルマシンからGoogleDriveに設定 ・そのため、MAMPのmysqlデータはGoogledrive側のmysqlデータをシンボリックリンク設定 流れ ・いつものようにMAMPを起動させるがMySQLサーバーが立ち上がらない ・phpMyAdminは「#2002 – Can’t connect to local MySQL server through socket ‘/Applic
masaplabs.com
masaplabs.com このドメインを購入する。 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
Macとさくらのサーバでの開発作業をGitで管理する
開発環境 Mac OS X 10.10.3（LAMP環境） さくら（スタンダード・プラン） ※Mac、さくら共にGit環境は既にインストール済み。 Mac（ローカル環境）で作成したファイルを、さくらのサーバへとアップロードしていく流れをGitで管理する。プロジェクトに関するディレクトリは全て新規に作成するものとする。 大まかな手順 1.さくらのサーバに中央リポジトリを作成する。 2.Macのローカル環境に中央リポジトリを複製（clone）する。 3.さくらのサーバ側にも（中央リポジトリとは別の）リポジトリを複製する。 4.Mac側でsample.htmlを作成したら、中央リポジトリに記録し全てのリポジトリにてデータを共有できるようにする。 さくらサーバに中央リポジトリを作成する まずさくらサーバにsshでログインし、適当な場所（今回は~/以下、つまりhome/ユーザ名/以下）にsample
ブラウザ × MIDI？Web MIDI APIを使ってMIDIデバイスの入力を取ってみよう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、店長です。 今回はWeb MIDI APIと、それを使って入力を取得する方法を解説したいと思います。まだまだ対応ブラウザは少ないですが、意外と簡単に扱うことができるので、ぜひ試してみてください。 Web MIDI APIとは MIDIとは電子楽器の演奏データを機器間でやりとりするための世界規格のことです。 MIDI（ミディ、Musical Instrument Digital Interface）は、日本のMIDI規格協議会（JMSC、現在の社団法人音楽電子事業協会）と国際団体のMIDI Manufacturers Association (MMA) により策定された、電子楽器の演奏データを機器間でデジタル転送するための世界共通規格。 MIDI – Wikipedia Web MIDI APIはMIDIデバイスとブラウザ間で通信をおこなうことができるAPIです。使用しているパソ
Facebookでログインできる！話題のソーシャルログインとは？ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！ フィードフォースの澤井です。 最近、ソーシャルログインを実装するサイトが増えてきましたね。 会員登録が必要なサイトで、こんなボタンを見かける機会が増えているのではないでしょうか？ 前回の「モバイル時代のマーケティングに欠かせない「データフィード」とは？」にも書きましたが、スマートフォンやタブレット端末の普及により、デバイスとユーザー行動の多様化が進んでいます。 サービス提供側は、ユーザー行動の多様化に合わせて新しいサービスを開発し、ユーザーは状況に応じたデバイスで利用します。そのため、ログインを必要とするサービスは増え続ける上に、利用するデバイスの数だけログイン実装をしないといけないのです。 そんなログイン地獄を解消することができるのがソーシャルログインです。 ソーシャルログインとは具体的にはどのような機能で、どんなメリットがあるのかを紹介していきたいと思います！ ソーシャル
gulp.jsとBrowser Syncで快適なWordPress開発環境を手に入れる
Browser Sync のインストール まず、BrowserSyncをダウンロードします。BrowserSync をダウンロードにはnpmコマンドを使用します。npmコマンドを使用するための設定については、はじめての gulp.js！Mac で CSS ファイル、JavaScript の圧縮を行おう gulp-css-sass-268を参考にしてください。 BrowserSync の動作確認 BrowserSync のインストールが完了したら動作確認しましょう。BrowserSync を起動するためには、以下のコマンドを実行します。これで、cssディレクトリ配下に保存されている CSS ファイルが変更される都度、ブラウザがリロードされます。
AngularJSで作成したシングルページアプリケーションをGoogleアナリティクスでトラッキングさせる方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
10月から引き続きAngularJSな日々を送っている先生です。 今回はAngularJSで作ったシングルページアプリケーション（以下SPA）をGoogle Analyticsでトラッキングさせたいと思います。 SPAでのトラッキング問題 Google Analyticsは、タグを埋め込むだけで勝手にトラッキングしてくれる手軽な解析ツールです。しかしAjaxやpushStateなどページ遷移を伴わないSPAでは、トップページしか解析されません。Analyticsではその対策として、任意のタイミングでトラッキングすることができる仕組みを持っています。 // ページビュー ga('send', 'pageview'); // イベントトラッキング ga('send', 'event', 'image1', 'clicked'); 参考：高度な設定 – ウェブ トラッキング（analytics.
Google Maps APIをコピペで使い倒せ！Web初心者でもカスタマイズできるgmaps.js | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。エンジニアののびすけです。 最近はひさしぶりに浅草をランニングして健康オタクを気取っています。 さて、ランニングといえば、アプリを使ってタイム測定をしている人も多いのではないでしょうか。大半のアプリには地図が内蔵してあり、特にGoogle Mapsを呼び出しているものが多いですね。 そこで今回は、そのGoogle Mapsをカンタンに導入できるgmaps.jsを使ってみたいと思います。コピペで試せるので、JavaScriptが得意ではないデザイナーやコーダーの方にもおすすめです。 http://hpneo.github.io/gmaps/ gmaps.jsはGoogle Maps APIを使いやすくしてくれるライブラリです。 そのメリットは大きく3つあります。 1. シンプルなコード 記述方法がとてもカンタンで、通常のGoogle Maps APIよりも分かりやすいソースコード
「Google マイビジネス」をGoogleが公開、GoogleプレイスとGoogle+ローカルを統合
[対象: 中級] Googleは、GoogleプレイスとGoogle+ローカルページを統合して管理できるツールとして「Google マイビジネス」を公開しました。 Googleプレイス/Google+ローカルに登録しているなら案内メールが届いているはずです。 Googleマイビジネスでできること Google マイビジネスでは、次のことができます。 Google 検索、マップ、Google+ に表示されるビジネスの情報を一元管理でき、更新もすべて 1 か所で行えます。 美しい写真や店内のバーチャル ツアーを掲載することで、お客様にお店の雰囲気を味わってもらえます。 Google+ ページから最新のニュースやイベント情報を共有し、ファンやお客様と直接つながれます。 オンライン上のクチコミをチェックでき、また、Google ユーザーからのクチコミには返信もできます。 お店のサイトの統計情報や
FINDJOB!終了のお知らせ | FINDJOB!
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
個人的に常用中のオススメ IFTTT レシピ 10個
最近、iPhone アプリがリリースされたこともあって話題に挙がることの多い IFTTT ですが、個人的に気に入ってるレシピ （IFTTT ではユーザーが設定した自動処理を 「レシピ」 と呼んでいます） を 10個ほど共有。 レシピ紹介してる Blog とかたくさんあると思いますので、なるべくかぶってない感じのやつをと思ったのですが、定番なのもいくつか混ざってます。 Blog を書く人向け、「Blog を更新したら○○に投稿」 系 Blog を運営している人なら、Blog に新しい記事を投稿したとき、同時に SNS などに更新通知を送るってことはよくやると思いますが、それ系で 5つほど。 1. Blog を更新したら Twitter に投稿 これはもう、定番過ぎる感じではありますが、Blog に新しい記事を投稿したら、その通知を Twitter に流すやつ。 WordPress をはじめ、
CSSとJavaScriptどちらでも実装できるけど、どのように使い分けるのがよいかの解説
CSSでもJavaScriptでもできるけどどちらを使おうか、CSSとJavaScriptどのように使い分ければいいのだろうか、二つのうまい関係を構築するテクニックを紹介します。 Building A Relationship Between CSS & JavaScript 下記は 各ポイントを意訳したものです。 はじめに スタイルの定義はCSSで：JavaScriptからCSSを遠ざける ユーザエクスペリエンスを犠牲にしないで使い分ける CSSとJavaScriptの使い分けの大切なポイント はじめに JavaScriptには数多くのライブラリ、jQuery, Prototype, Node.js, Backbone.js, Mustacheなどあり、非常に人気が高いです。これらは実際に非常に多く利用されており、時間をかければもっとよい方法があるかもしれないところでもそれらを使ってしま
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
無料メルマガに登録した人は、どこから来て何がポイントで登録したのかを分析するには？（第52回） | Googleアナリティクス セグメント100選
