ども！ LIGでWebディレクターをやっていますZIMAです。 先日、上司から「FTP、FTPS、SFTP、SCPの違いについてZIMAは説明できる？」と聞かれました。 「いやいや、待ってくださいよ。そんなの僕だって〜わっかりま……（あれ？FTP、FTPSは理解しているつもりだけど、SFTP、SCPについては、謎だ！）」 と、返答の途中で答えられないことに気が付いたのです。 そこで今回はその、「FTP、FTPS、SFTP、SCPの違い」について調べてみましたので、その結果をご報告したいと思います。 未経験からWeb業界への転職を目指すなら… Webの知識を身に付けたい、Web業界に転職したい……という方は、「スクールでの勉強」もおすすめです。LIGではWebクリエイター育成スクール「デジタルハリウッドSTUDIO by LIG」を運営しております。詳細を知りたい方は、ぜひスクールの詳細をチ

こんにちは、ニュージーランドで働くプログラマのはっしーです。 ITエンジニアのあなた、英語の勉強してますか？ 新しい技術が目まぐるしく移り変わるIT業界において、もはや英語は必須スキルのひとつ。最新情報が日本語に翻訳されるのを待っているだけでは、流れについていくのは大変です。 とはいえ毎日忙しい中、英語の勉強時間を確保するのは簡単ではありませんよね。 そこで今回は、ITエンジニアが日々の仕事や通勤の時間をうまく利用して英語を学ぶ方法をお伝えします！ 入門編：英語でググってみよう Google検索は、もはやITエンジニアの仕事の一部です。謎のエラーに遭遇したときや、ライブラリの動き方がよくわからないときなど、みなさん毎日何度となくググっていることでしょう。 ぜひ一度、日本語を封印して英語のみでググってみてください。 英語の勉強になるのはもちろんですが、日本語よりも質の高い情報がたくさん見つか

勉強することはとても楽しい 知的欲求を満たすことは、とても楽しいものです。 もしもあなたが社会人であれば、その知識が仕事、ひいては賃金へと繋がることも多く、より強い愉悦となります。 しかしながら、ときおりそれは強迫観念となってしまい、やがて依存症へと変貌を遂げます。そして、無意識下のうちにストレスを生み出し……、ついには勉強を苦痛に感じるようになってしまうでしょう。 私は学生時代あまり勉強が好きではありませんでしたが、社会人となり、自分の興味があることを学習するうちに勉強することがとても楽しいものとなりました。 しかし、いつしか大好きだった読書に対しても『小説を読む時間があるならば技術書を読むべきだ』となかば強迫観念のような考えに縛られ、小説を読むことに対しては罪悪感すら抱いてしまうようになっていました。 必要なのは正しく息抜きができること 私は恐怖しました。このままでは大好きだった読書を

こんにちは、ニュージーランドで働くプログラマのはっしーです。 「プログラマはプライベートでも勉強して当然」なんて話をよく聞きますが、実際に仕事以外で勉強をしている人はどれくらいいるでしょうか？ かくいう僕も海外で働きだしてからは、あまりプライベートで技術の勉強をしてきませんでした。 しかし最近、ふとしたことからモチベーションを取りもどし、毎日1時間はプログラミングの勉強にあてる生活を送っています。 今回は、最近プライベートでの勉強から遠ざかってしまったあなたのために、「勉強への熱を復活させるコツ」、そして「少しずつでも勉強を継続させる方法」をお伝えします！ 履歴書を更新してみよう 勉強への熱を復活させるコツはひとつ。勉強しないとやべぇという感情を自分のなかで起こすことです。じゃあどうすれば「やべぇ」と感じることができるのか？ そのためにぜひやってもらいたいのが、「履歴書の更新」です。 会社

今回は、スクロールして、レイアウトが表示領域に入ったらフェードインするアレを加えます。 せっかくなので、最近注目のIntersectionObserver APIを使って実装してみましょう。 スクロールイベントの管理はscrollmagicライブラリーが有名ですが、ネイティブで実装できるにこしたことはないですね。 ※現在IE11やsafariで使用できないので、クロスブラウザ対応には専用のpolyfillが必要です。 対応状況はこちら。 要件 PC表示 ブラウザ幅が769px以上だったらPCレイアウト表示 互い違い 最低の幅は1280px 写真は、テキストボックスが少し被る余白を残して画面幅一杯に広げる 表示領域（window）に入ったら要素をフェードイン SP表示 ブラウザ幅が769px未満だったらSPレイアウト表示 均一に縦並び HTML、CSSを変更 トリガーとなるclassを追加し

こんにちは。 ジャスの意味がわかるやつは大体友達。Webデザイナーのミライです。仙台出身です。 私は入社当初から約1年、LIGブログの「アイキャッチ（記事サムネイル）」「バナー」「背景ジャック（大型バナー）」を制作しており、制作の回転数が多いこともあって、配色でぐるぐると悩むことがよくありました。 そのときにカラーリングの参考になるサービスサイトを手当たり次第に調べて、ためていたものを紹介します。けっこう量があり、ひと通りの配色系ツールを押さえているので、ブックマークしておけばきっと役に立つことでしょう。 配色に悩んで脳内、インターネット砂漠をぐるぐるとさまよい歩いたあなたの旅もここで終わりです。仕事はさっさと終わらせて、早く帰って寝るのです。 はじめに 説明を読めないほど疲弊しているあなたのために、評価の軸を立てました。 見やすさ 特異性 掲載数 です。 個人的な観点ではありますが、サク

8888（パチパチパチパチ） どうも、ありがとうございます！ ご好評頂いた皆様に感謝です！ ということで、このシリーズに味をしめた僕は、引き続きオフィスにて飛び交う様々な異世界の言葉に耳を傾けていたところ、「ZIMA、この件について、メンバーにケーティーしておいて！」と上司から指示を受け、勢いで「承知です！」と返答したのですが…… ケーティー？……KT？……コムロテツヤ？ なんすか、その業界用語みたいな意味不明な言葉は……！？ なんてふざけている場合ではない！ 上司からの依頼だし、このままでは、案件に支障が出かねないので、マジで調べないと今度はおれの首が危ない！！！ ということで、上司の使う異世界の言葉を真面目に学んでおこうと思います！ ＊言葉の引用元はみんな大好き：Wikipedia いつもありがとう：Weblio あなたのとなりに：goo辞書 LIGの上司が使うスマートな言葉 KT K

どうもですよ、はやちですよ٩( ᐛ )و 今回は、Canvasの操作を高速に描画できるPixi.jsを触ってみました。 導入から実装まで、ご紹介したいと思います( ˇωˇ)☝ 導入方法 npmはこちらからインストールしてお使いください！ npm install pixi.js 実装方法 image画像を操作する 画像を使用してCanvasに描画とアニメーションさせる方法をご紹介します( ˘ω˘)☝ はじめに表示するCanvasを用意します。 Canvasはサイズと背景色も設定できます( ˇωˇ)☝ let app = new PIXI.Application(800, 600, {backgroundColor : 0xDAE8F4}); document.body.appendChild(app.view); いつも使っている画像を用意します( ˇωˇ)☝ let hayachi = P

こんにちは！ディレクターのRISHです。だんだん暑くなってきましたね。 UberやAirBnB、Facebook、Google、Apple…シリコンバレーでスタートアップとして始まったサービスがここ東上野にも完全に普及しきっている今日ですが、「アメリカのエンジニアの平均年収は日本の◯倍！」や、「資金調達した金額◯◯米ドル！」などと騒がれていますね。 彼ら彼女らのビジネスとして本当はどれくらいの儲けが会社に入っているのか、気になったりしませんか？？ � その答え、意外と誰でも簡単に「決算書」を読めば知ることができます。 決算書を読んだり、会計を理解するってけっこう堅苦しいイメージを持ちがちですが、この本で紹介されているスタンフォード大学経営大学院のエリザベス・ブランケスプール助教授が 「会計は人間がどう決断したかのストーリーである」 と言っていたのを本で読み、それが僕にとってのブレークスルー

こんにちは。株式会社LIGの監査役をしている手塚（右）です。 私は、LIGの監査役として、社内のあらゆる業務の監査を担当しています。 ここ数年は、業務の生産性向上を目的としたサービスが次々に登場していますが、みなさんは「RPA」というものをご存じでしょうか。 RPAとは？ 「Robotic Process Automation（ロボティック・プロセス・オートメーション）」の省略で、業務効率を改善する自動化ツール。人が手作業でおこなっている日々のルーティンワークを、替わりにロボットにやってもらうことから、仮想知的労働者とも呼ばれている。 最近では、導入費用や維持費が安いRPAツールが数多く出ています。ただ、一般の人にはちょっとわかりづらく、システムエンジニアやプログラマなど専門職の人が使うというイメージを持つ人も多いのではないでしょうか？ ところが、誰でも簡単にロボットを作れるRPAがあるら

どうもですよ、はやちですよ:D 今回は、ページ上でタイピングをしているようなアニメーションが再現できるツール「t.js」をご紹介します。 導入方法 githubのほうでダウンロードしてから読み込んでください。 <script src="t.min.js"></script> 実装方法 基本的な設定方法ご紹介します:D 動かしたいhtmlのマークアップに対して <div id="js-target" class="box">Hello,　World. This time I tried using t.js.</div> 指定をするだけで実装が完了になります！　簡単！ $('#js-target').t(); 設定されたものは下のような動きになります。

こんにちは。フロントエンドのつっちーです。 前回、前々回に引き続き、「サーバーサイドテンプレートやHTMLファイルへのマークアップに対して、Vue.jsを使用する方法」に的を絞り、Vue.jsについて書いていきます。今回は、Vue.jsを拡張するプラグインの使い方について、実際にプラグインを利用して画像を遅延読み込みさせている例から見ていきたいと思います。 プラグインで更に便利に拡張する jQueryには、その機能をさらに拡張する、プラグインと呼ばれるツールが数多く開発されています。Vue.jsにもまた同様に、機能拡張のためのプラグインが多く開発されています。Vue.jsは、jQueryよりもかなり後に誕生しているため、その数はjQueryに遠く及びませんが、思いつく機能のプラグインは大抵がすでに存在しています。awesome-vueには、その豊富なプラグインが機能ごとに一覧でまとめられて

はじめまして、エディターのとりです。 前職では実用書（主に料理書）の制作を3年半ほどやっていて、今年の2月末から編集・ライターとしてLIGに入社しました。 正直、編集職ならWebも出版も大差ないだろうと思って転職したのですが、出版業界とWeb業界の文化の違いに戸惑ってばかりの日々を送っています。 とにかく新しく覚えなければいけないことで頭がいっぱいで、毎晩夢の中でも出社してしまう始末。 睡眠の質が明らかに低下しているから、早いとこ慣れてぐっすり眠りたい。 というわけで、記念すべき初ブログのテーマは「書籍編集をやっていた私がWeb編集に転職して感じた文化の違い」。 遠くない未来には今の環境にすっかり慣れ、こんな気持ちも忘れている予定なので備忘録として。 それと、出版からWebへ転職を考えていて「紙とWebって実際どう違うの？」と気になっている人にも現場の雰囲気を少しばかりお伝えできたら嬉しい

個人ブログをNode.jsで作るのを最近の目標にしているハルです。 今回は、Node.js 製 のCMS「KeystoneJS」をサーバーで公開する方法について調べながら挑戦したので、そのことを書いてみました。 直接サーバーにKeystoneJSをインストールし、起動しアクセスしていきたいと思います。 環境について CentOS7に Nginxでを用意し、アクセスできる状態までは用意します。Node.jsをバージョン管理のnodebrewを用意しました。mongodbも必要なのでインストールし、起動済みにしてあります。 環境情報 CnetOS 7 nodebrew 0.9.8 Nginx 1.13.8 mongodb v3.4.11 Node.js v9.2.0 npmでインストール pm2のインストール $ npm install -g pm2 pm2はNode.jsをデーモン化するのに

こんにちは！ バックエンドエンジニアのまさくにです。 僕、Remember The Milkが大好きなんですよね。ご存知ですか、Remember The Milk。変な長い名前なので略してRTMと呼んだりしますが、Remember The Milkはシンプルで多機能なタスク管理ツールです。TrelloとかTodoist、Any.doなどが同じジャンルにあたるでしょうか。 僕もタスク管理ツールをいろいろ試したのですが、何だかんだでRemember The Milkに落ち着いています。もう8年くらい有料ユーザーで使ってる。本当に好き。愛してる。そして同じエンジニアとして、こういうアプリケーションを作れることを尊敬します。 でもこの流れの早いWeb業界にいて、仕事の管理ソフトなど、花粉症で浪費されるティッシュ箱くらい早いローテーションで移ろいゆくものじゃないですか。RTMもそろそろ古参のタスク管

どうもこんにちは、僕です。もりすけです。 突然ですが、皆さまはご自宅で暇になったときって何をしてますか？ 今回は連休などで何も予定がなく暇になった場合、誰でもご自宅で簡単にできる暇つぶしを厳選しました！　さっそく、カテゴリ別で紹介していきたいと思います！ 基本 エンタメ 人生プラン フローリング クリエイティブ リア充 サイエンス ひとり遊び 恋人 身体 性 ライフハック コミュニケーション 心を落ち着かせる 探す 過去を振り返る 自己対話 基本 暇つぶしの基本形です。誰もが日常的にやっているでしょう。 読書 リリーフランキーのコラム集はかなりおすすめです。 YouTubeを見る NBAのスーパープレイをよく見ます。 書道 書道をたまにやるとスッと背筋が伸び、気が引き締まっていいですよね。 十乳十色：爆・巨・美・貧 映画鑑賞 VODはかなり便利ですね！　ドラマも映画もいくらでもあって暇を潰

こんにちは、Webディレクターのともぞうです。 今回はディレクターならよく作成するスライドについてお話しします。スライドといってもPowerPointやKeynoteでつくるのではなくHTMLでつくります！ それでは、HTMLでスライド作成し、スライドをGitHub Pagesというサービス上に公開するまでの方法をご紹介したいと思います。 今回のゴール 先に今回のように私が作成したスライドを以下から確認してみてください。 https://lig-komatsu.github.io/statistics_01/#/ お作法さえ押さえれば簡単にスライドを作成することが可能です。 用意するもの 好きなエディター ライブラリ取得 GitHubアカウント とりあえずスライドだけつくりたい！　という方はGitHubアカウントを取得する必要はありません。 Gitを使ったことがなくてもスライドは作成できる

ただいまご紹介に預かりました、はつしです。 今回は、みんな大好きjQueryとFirebaseで簡単な投票システムを作ってみましょう。 Firebaseの使い方は以前僕が書いた記事をご参照下さい。 データベースをセット firebaseにログインして下記のように値をセットします。 ルールタブを押し、コードを以下のように書き換えます。 投票画面側 まずは、投票する側の画面を作成します。 いい感じにHTMLを組んで、jqueryとfirebaseを読み込みます。 firebase読み込みのコードは以下です。 <script src="https://www.gstatic.com/firebasejs/4.6.0/firebase.js"></script> JSを書きます 以下のようにJSを書きます。 const TRANSITION_END = 'transitionend'; fireb

「優秀なエンジニアが採用できない」「リソースが足りなくて開発が進まない」という方は、海外にエンジニアチームを作ってみませんか？ 詳しい内容は以下からご覧いただけます。 サービス詳細はこちらから Steam APIについて Steamとは Steamとはゲーム販売とSNSの機能を持つサービスで、PCゲームをやる方はご存知の方も多いでしょう。そんな SteamでWeb APIが公開されており、プロフィール情報を取得してみます。 Steam : https://store.steampowered.com/ Steam Web APIドキュメント : https://steamcommunity.com/dev Steam API Wiki: https://developer.valvesoftware.com/wiki/Steam_Web_API Web APIキーの取得 まずは、Web A

僕はデザイナーではないのですが、これからの編集者はコンテンツ制作においてデザイナー的視点も絶対に必要になると思ったので参加してきました。 というわけで、たくさん学びのあったイベントの模様をお届けします。 デザイナーとチームが意識すべき結果とは？ Session1のテーマは「デザイナーとチームが意識すべき結果とは？」 株式会社LIG 経営企画室長執行役員　須田允さん 株式会社DMM.comラボ CDO　赤坂幸雄さん このセッションですごくおもしろかったのは、「感性で上がってきたものに関しては基本的に評価しない」という姿勢です。デザイナーは自分が作ったものをロジカルに説明できなければならないということ。　そうじゃないとクライアントしかり、相手を納得させられない。そのため、自分が作ったものに関して説明できるというのもデザイナーとして持っておくべきスキルとのことでした。 また興味深い話だったのが、