1.はじめに デザイナーさん、以下のような事態に困ったご経験はないでしょうか。 「画像の差し替え・削除・追加が発生して、ちょっと直したいけど、どこを編集すればいいかわからない」 「文言修正が入った。エンジニアさんに振るまでの量でもないので自分で直したいが、どこを編集すればいいかわからない」 「フォルダによくわからないファイルがたくさんある。いじるのが怖い。」 近頃のweb開発環境は複雑化し、gulpやwebpack・npmなど、デザイナーにとってはよくわからない単語が増えてきました。 このようなツールを駆使してフロントエンド環境を構築しているエンジニアにとって、作業は効率化されましたが、逆にデザイナーにとってはどんどん敷居が高くなっていると思います。 本投稿では、そんな環境下でもなんとなくイマドキの用語を軽く理解して、ちょこっとの編集作業ができるようになることを目標にします。 ゴール gu
![【デザイナー向け】どうしてもgulp、npm、sass、pugを操作しなければならない人への説明書](https://cdn-ak-scissors.b.st-hatena.com/image/square/172e3f3b9b650e596f44baf9a546c7ed8f8f2ae7/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUUzJTgwJTkwJUUzJTgzJTg3JUUzJTgyJUI2JUUzJTgyJUE0JUUzJTgzJThBJUUzJTgzJUJDJUU1JTkwJTkxJUUzJTgxJTkxJUUzJTgwJTkxJUUzJTgxJUE5JUUzJTgxJTg2JUUzJTgxJTk3JUUzJTgxJUE2JUUzJTgyJTgyZ3VscCVFMyU4MCU4MW5wbSVFMyU4MCU4MXNhc3MlRTMlODAlODFwdWclRTMlODIlOTIlRTYlOTMlOEQlRTQlQkQlOUMlRTMlODElOTclRTMlODElQUElRTMlODElOTElRTMlODIlOEMlRTMlODElQjAlRTMlODElQUElRTMlODIlODklRTMlODElQUElRTMlODElODQlRTQlQkElQkElRTMlODElQjglRTMlODElQUUlRTglQUElQUMlRTYlOTglOEUlRTYlOUIlQjgmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZzPTAwMjVlMzYxMmU5ZDQ0ZWU3NDYyNzAxY2E5Nzg3MjZj%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB5dWtpVFRUJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1lODJiMTQ4OWFjMThjMjM2MGE1NDdhNzIzMzkyYTNkZA%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D5532debf7c0774766f0199946c8d3ca1)