こんにちは、ハヤマです。 唐突ですが、もう年末。今年は色々とありましたね。 色々とありすぎて、季節感すら追えていません、、。 そんな状態ですが、せめてブログでは時期に合ったネタ？を紹介したいと思います。 はじめに Webサイトデザイン制作において…

こんにちは、ナカムラです。 スタティックのHTMLページを作成している中で、商品情報など、 同じレイアウトを繰り返すコンテンツがあります。 数が少なければ手作業で書き込めば良いですが、10件、20件ともなるとなかなか大変な作業になります。 そこで今回…

こんにちは、コバヤシです。 11/30（米国時間）、EC2上でmacOSが利用できる「Amazon EC2 Mac Instances」の一般提供が発表されました。 今回は、Mac Instanceを起動して、リモートデスクトップで接続するまでをやってみたいと思います。 今回はこちらを参考…

こんにちは、ユアサです。 前回までの記事では、お問い合わせフォームを作成していく上で実装したい入力項目やライブラリを紹介しました。今回はそれらを使って、土台の部分となってくる入力画面、確認画面、完了画面を作成していきたいと思います。 ↓前回の…

こんにちは、ハヤマです。 ストックフォトサービスを提供する「Shutterstock」から、2021年のカラートレンドが発表されました。 選ばれた3色ですが、上品だけれども生命力を感じるナチュラルカラーで、個人的にも好きな配色です。 詳しくはこちら。（英語サ…

こんにちは、ナカムラです。 今回はスマホサイトではお馴染みのハンバーガーメニューの作り方をご紹介します。 タイトルに「階層の深い」と書きました。 ページ数の多いサイトでは、第2階層、第3階層とメニューが深くなっていきます。 階層が深くなるとメニ…

こんにちは、コバヤシです。 今回はLaravel5.5以降でデータベースからマイグレーションファイルを作成する方法について書きます。 DB->マイグレーションファイル 以前はXethron /migrations-generator があって便利に使っていたのですが、これってLaravel5.4…

こんにちは、ユアサです。 前回の記事でも記述していた通りフォーム作成をしていこうと思っていましたが、それより以前の記事で紹介したComposerを使用して（どうせなら勉強したことの実践も兼ねて）既存のライブラリを活用していく方向にしようかな？と考え…

こんにちは、ハヤマです。 先週、「Adobe MAX 2020」が開催されましたね。 今年はコロナ禍もありオンラインでの開催となりました。 今回はこのイベントのコンテンツについてお話ししていきたいと思います。 「Adobe MAX」とは？ 「Adobe MAX」は、アドビシス…

こんにちは、コバヤシです。 今回はVue.jsでCKEditorを使う方法を書いていきたいと思います。 CKEditorとは テキストエリアをWYSIWYG形式のエディタに変更するライブラリになります。 ckeditor.com CKEditor4とCKEditor5がありますが、今回はCKEditor4を導入…

こんにちは、ナカムラです。 今回は文字数などのコンテンツ量によって表示を制限するJavaScriptを解説していきます。 jQueryを使わないネイティブでの書き方になります。 ※IEにも対応したい場合は注意点があります。詳しくは解説の中で記載しています。 作り…

こんにちは、ユアサです。 今回は、簡易的ではありますがお問い合わせを想定したフォームの作成をしていきます。 フォーム作成のお手伝いはしたことがありますが、一人で作成したことがなかったので一つひとつ順を追って作成していきたいと思います。 まずは…

こんにちは、ハヤマです。 最近、弊社もワイヤーフレーム以外にデザイン制作においてもAdobe XDを用いるようになりました。 Adobe XDのメリットはなんといってもデータの軽さではないでしょうか。 配置画像をどんなに拡大・縮小しても画像自体に劣化が発生し…

こんにちは、ナカムラです。 今回はjavaScriptのプラグイン「Shuffle.js」を使って絞り込みとソートの実装をしてみたいと思います。jQueryは使用しません。 オプションがいろいろありすぎて読み解くのがなかなか辛かったので 一番シンプルな絞り込みとソート…

こんにちは。コバヤシです。 今回は、Laravelでフォームリクエストを使ったバリデーションについて書きたいと思います。 フォームリクエストバリデーションとは バリデーションロジックを含んだカスタムリクエストクラスです。コントローラーの処理に入る前…

こんにちは、ユアサです。 前回の記事ではComposerのインストールについて書きました。 前回↓ tech.arms-soft.co.jp 今回は基本的なコマンドやその使い所についてまとめます。僕も実際に使っていきたいと思います。 composer require ターミナル等を使用して…

こんにちは、ハヤマです。 今回は、ブラウザチェックについて書いていきたいと思います。 はじめに ブラウザチェックとは、コーディングしたページがブラウザ上で正常に表示されているかを確認する作業のことを指します。 より良いサイトを作るには、サイト…

こんにちは、中村です。 今回はこちらの記事で紹介されている「rel="noopener”」という属性について確認していきたいと思います。 「Firefox 79」が正式リリース ～Windowsで新レンダラー「WebRender」の適用を拡大 - 窓の杜 記事の内容はFirefox79の仕様でr…

こんにちは、コバヤシです。 今回はPhpStormでPHP_CodeSnifferを使ってPSR12でチェックする方法について書きたいと思います。 PHP_CodeSnifferとは コード規約をチェックするツールです。 Composerでインストール出来ます。 github.com PHP_CodeSnifferをイ…

加藤です。 前回で、Laravel 7.x環境でvue.jsを導入してみました。 tech.arms-soft.co.jp 以降は勉強のため、Vueを使ってタスク管理Webアプリケーションを作成してみようと思います。 環境 PHP 7.3 Laravel 7.0 Node.js v8.12.0 目標・やりたいこと ログイン…

初めまして、ユアサです。 ちょうど一ヶ月前くらいに入社しました。バックエンド側になりますが、実務でのプログラミングや動作テスト等まだまだ経験不足の初心者です。 色々勉強しながら、初心者目線で書いていけたらと思います。よろしくお願いします！ Co…

こんにちは、ハヤマです。 購読している「Adobe Blog」にて、Illustratorの操作で参考になった記事（動画）を見つけたので紹介したいと思います。 記事について 記事はこちら。 blogs.adobe.com ゲストである博報堂プロダクツの河和田将宏さんが、Illustrato…

こんにちは、中村です。 少し前の話になりますが、Edgeがchromiumベースに更新されましたね。 以前のEdgeで固定表示した要素がスクロールした時にがたつく現象がありました。 javascriptを使ってブラウザのスムーススクロール機能をオフにし、 スクロールの…

こんにちは。コバヤシです。 今回はLaravelでview composerを使って、ビューのロジックを分離する方法を書いていきます。 view composerとは view composerとは、ビューを表示するビジネスロジックをコントローラから分離して記述するための仕組みです。 各…

加藤です。 前回と前々回で、Laravel 7.xの認証機能を使ってログイン画面を作成してきました。 tech.arms-soft.co.jp tech.arms-soft.co.jp 以降は勉強のため、Vueを触っていきたいと思います。 まずは導入からです。 環境 PHP 7.3 Laravel 7.0 Node.js v8.1…

こんにちは、ハヤマです。 今回は、ウェブデザインのデータをAdobe Photoshopで作成する際、データの作りとして気をつけていることをまとめていきたいと思います。 その1：レイヤー名はわかりやすく ページボリュームが多くなると、モジュールやセクション、…

こんにちは、中村です。 今回はCSSの擬似クラス「:only-child」についてご紹介しようと思います。 擬似クラスとは？ セレクタ要素の特定の状態に対してスタイルを当てるためのクラスです。 ユーザーの操作に反応したり、要素の状態によって見た目を変えるこ…

こんにちは。コバヤシです。 前回に引き続き、PhpSpreadsheetについて書いていきます。 今回はExcelファイルの作成です。 前回の記事はこちら。 tech.arms-soft.co.jp まずは作成してみる

tech.arms-soft.co.jp 加藤です。前回Laravel 7.xでマルチ認証機能を作成し、一般ユーザ用と管理者用とでログイン画面を分けることに成功しました。 今回は登録とパスワードリセット機能をそれぞれに追加していこうと思います。 環境 目標・やりたいこと ユ…

こんにちは、ハヤマです。 最近、お問い合わせなどのフォームのデザインを行う機会が多かったので、制作時に気をつけるべきことや、気づいたことについてまとめていきたいと思います。 入力内容に合わせて幅を設定する 全てを領域の幅いっぱいまで広げる必要…