こんにちは、ゆるふわwebデザイナーのなかむらです。 弊社ではデザイナーがコーディングまで行うことがあるのですが、フロントエンドエンジニアさんのような知識があるわけでもないゆるふわデザイナー2人がclip-pathツールを使おうとしてドツボにハマった経験を活かし、表層だけを撫でるclip-pathの記事を執筆いたします。 clip-pathとは メリット 落とし穴 Safariと死ぬほど仲が悪い 落とし穴にはまらない使い方とポイント パターン1：clip-pathに直接数値を書いて切り抜く パターン2：svgで書いたパスをclip-pathに読み込んで切り抜く パスのsvgの作り方 XDでのや…

こんにちは。株式会社TRYTで開発業務丁稚奉公修行中のhollyroyal-teaと申します。 紅茶好きのような名前ですが、紅茶よりコーヒーを愛する人です。 本日はクリスマス恒例のアドベントカレンダー用に記事を書き起こしてみました。 そんなクリスマスのお題ですが・・・

httpでアクセスしたのにhttpsへ強制的に接続されてしまうのは、HSTSが原因かもしれません。 HSTSとは HSTSとは、WebサーバがHTTPヘッダの中で指定する項目の一つで、Webブラウザに対して以降は常にHTTPSによる通信を行うよう指示するもの。RFC 6797として標準化されている。 HSTSとは - 意味をわかりやすく - IT用語辞典 e-Words なるほど…一生接続できないとということですね。 いや接続したいんだ！諦めない！という方は、以下の方法でHSTS設定の削除ができますのでぜひお試しください。 HSTS設定の削除方法（Chrome） アドレスバーから「chrome…

はじめまして、TRYT開発課エンジニアの安原です。 少し前にWEBページのホスティングの設定をするにあたって、少し躓いた点と気づきがありましたので、記事に残しておこうかなと思います。 やりたかったこと 静的なWEBページのホスティング ホスティングの方法として、今回はCloudFrontを経由してS3にアップロードしてある静的ページ（HTML、CSS）にアクセスできるようAWS上で設定を行いました。 CloudFront側の設定では特定のURLパスにアクセスしてきた場合に、S3の資材を参照するようにしたかったため、大凡の設定は以下となります。 CloudFront オリジン：S3バケット ビヘ…

実機はiPhoneを指しています ブラウザはsafariです Macユーザー向けのお話になります 実機あるある さっそくですが、こんなことありません？ iPhoneのsafariでサイト見たらレイアウトが想定していたものと違っていた PCのエミュレートでは起きていないので原因が調べられない 一体何がどうなっているんだ…起きていることの詳細知りたい… そんな時は、safariの開発ツールを使うと便利です。 safariの開発ツールの使い方 実機でも開発ツール使えるんです！本当にありがたい。 使い方はこんな感じです。 MacとiPhoneをケーブルで繋いでください Macでsafariを開いて「開…

ファビコンって 守備範囲広くて面倒ですよね。 もはや当たり前ですが、ずーっと前はfavicon.icoを準備するだけでよかったのが、スマホの「ホーム画面に追加」に対応とか、Winの「ピン留め」に対応とかいろいろとしなきゃならないことが多いです。 なので大きい画像を準備するだけでサクッとマルチデバイス対応してくれるReal Favicon Generatorを使って生成・設定しました。 指南してくれるサイトに沿って記述してアップ。 順調にことは運び、あれよあれよとレビューも終わってステージング環境に反映され、便利ツールを作ってくださった方に一礼してタスク完了。 全然面倒じゃない。本当に助かります…

こんにちは、TRYT開発課の成阪です。 アプリケーションから利用するDBユーザーの権限追加作業をやった際のメモです。 方法 MySQLでは TRUNCATE 単体では権限が用意されておらず、DROP権限と相乗りの形で用意されているので、GRANT DROPを対象のユーザーに付与すればOKです。 GRANT DROP ON `hogedb`.`fuga_table` TO 'tryt-app-user'@'%'; DROP 権限は TRUNCATE TABLE のためにも必要です。 MySQL :: MySQL 5.6 リファレンスマニュアル :: 6.2.1 MySQL で提供される権限 補足…

こんにちは、TRYT開発課の成阪です。 クラスター有効のElastiCache Redisに接続した際に以下のエラーが発生しました。 Redisを利用するのは今回のプロジェクトが初だったので、今後のために調べたことを残しておきます。 発生したエラー elasticache redis MOVED 11637 192.168.112.18:6379` エラーの原因 MOVED というエラー自体は Redis Cluster のもので、アクセス対象のデータを持っているノードへのリダイレクトらしい。 https://redis.io/topics/cluster-spec MOVED Error f…

こんにちは、TRYT開発課の成阪です。 Salesforceと連携するプログラムをつくっていた際に、一瞬ハマりました。 小ネタですが、忘れないようにメモとして残しておきます。 結論 COUNT(*) ではなく、COUNT(fieldname) は使用できるので、 COUNT(fieldname)を使用するか、削除できるのであれば ORDER BY、GROUP BYを削除しましょう。 発端 データ取得するクエリのSELECT句とLIMIT句だけを変更して、処理対象の総件数を取得したかったのですが、ORDER BYが指定された状態では、エラーとなってしまいました。 -- データ取得 SELECT …

みなさんこんにちは。 TRYTでフロントエンドエンジニアをやったりやってなかったりするやっくんです。 本日はこのテックブログを盛り上げようってことで、ほんとはお酒とかe-sportsとかパン作り、あと陶器とか西遊記について書きたかったのですが、 ここはひとつまじめにエンジニアリングについて書こうと思います（趣味の分布がバグってる）。 で、本題は長いタイトルの通りです。 フロントの資材にhuskyを導入し、GUIからのコミット時にもprecommitを走らせるまでの手順やよくあるエラーなどについて書いていきます。 huskyとは huskyとはGitのコミットやプッシュなど、特定の動作をトリガー…

イベントフライヤーデザインのコツ7選をご紹介。フライヤー作成に興味がある方、制作に悩んでる方におすすめ！

トライトにおけるエンジニア組織を紹介します。 エンジニア組織自体が拡大期に突入しており、今後さらに体制が変わっていくので、本記事を現時点の体制のスナップショットとして残すという狙いもあります。 組織体制について トライトでは医療福祉業界・建築業界向けの転職・派遣サイトを10数個運営しており、各サイトの開発・運用保守を数十名程度のエンジニア組織で行っています。 開発に主に関わるロールとしては、ディレクター、デザイナー、フロントエンドエンジニア、バックエンドエンジニアです。 基本的には、ビジネスサイドからの依頼や要望・企画をディレクターがとりまとめて開発を進めていきますが、開発規模に応じては要件定…

トライトグループで技術ブログを開設しました。よろしくお願いします。 初めての記事になるので、トライトグループでエンジニアが何をやっているのかを軽く紹介しようと思います。 そもそもトライトグループは何をやっているの？についてですが、 医療福祉業界と建設業界をメインにした人材紹介・人材派遣事業を行っています。 トップページ | トライトキャリア トップページ | トライトエンジニアリング エンジニアチームでは、弊社の転職支援サービスへの利用登録を行っていただくためのウェブサイトの開発から運用保守をメインで行っており、 ウェブサイトと基幹システムのデータ連携 広告配信に利用するためのデータ連携 デジ…