ちゃる＠駆け出しWebデザイナー💻エンジニア

今はまだ営業職ですが、Webデザイナーやエンジニアになるために勉強中💻 #駆け出しWe…

ちゃる＠駆け出しWebデザイナー💻エンジニア

今はまだ営業職ですが、Webデザイナーやエンジニアになるために勉強中💻 #駆け出しWebデザイナーとつながりたい #駆け出しエンジニアとつながりたい

RPA（Robot Process Automation）って何のこと？

こんにちは、ちゃるです！ 今日はPCによっていろいろな操作を自動化するRPAという仕組みについて調べてみました！ 単純な作業を自動化できると仕事が楽になり、時間に余裕が生まれますよね。私もタイパ向上のために覚えたい技術です。 RPAとは RPAは、ロボット・プロセス・オートメーションの略です。RPAは、コンピュータを使用して、人間が行う作業を自動化する技術です。RPAでは、コンピュータが人間が実行するタスクを自動的に処理し、作業を効率化することができます。RPAは、様々な業

ちゃる＠駆け出しWeb…

    • オブジェクト指向って何？（Javascriptの場合）

      こんにちは、ちゃるです😀 プログラムの勉強をしていてオブジェクト指向という言葉をよく見かけます。 どういうことかわからなかったので調べてみました！ オブジェクト指向プログラミング (Object-Oriented Programming, OOP) は、コンピュータプログラミングの一手法です。OOPでは、プログラムを構成するものを「オブジェクト」と呼び、それらのオブジェクトがデータを持ち、またそれらのオブジェクトがどのようにデータを処理するかを定義する「クラス」を使用します

      ちゃる＠駆け出しWeb…

      • requestAnimationFrameとsetIntervalの使い分け

        こんにちは、ちゃるです😀 Javascriptで同じ処理を繰り返す関数にsetIntervalがありますが、requestAnimationFrameというものもあり、違いがよくわからなかったので調べてみました！ requestAnimationFrameとsetIntervalの違いについてrequestAnimationFrameとsetIntervalは、どちらもJavaScriptで使用される時間管理のためのメソッドです。どちらも、指定された時間ごとに何らかの処理を

        ちゃる＠駆け出しWeb…

        • 最近よく聞くJamStackって何？

          こんにちは、ちゃるです😀 今日は最近よく見かけるJamStackというものについて調べてみました！ JamStackとはJamStackとは、静的ウェブサイトやアプリケーションの構築に使用される技術スタックのことです。JamStackは、JavaScript、APIs、およびマークアップの3つの単語からなる言葉で、その名前の通り、JavaScriptを使用したAPIとマークアップを組み合わせて構築されます。 JamStackを使用した実装例として、Gatsby.jsがあり

          ちゃる＠駆け出しWeb…

        RPA（Robot Process Automation）って何のこと？

        ちゃる＠駆け出しWebデザイナー💻エンジニア

          Javascriptの変数宣言、varとletとconstについて

          こんにちは、ちゃるです😀 今日はJavascriptで変数を宣言するためのキーワード、varとletとconstについて調べてみました。 var,let,constとはJavascriptにおける、var、let、constは3つのキーワードです。これらは変数を宣言する際に使用されます。 var: varキーワードは、変数を宣言する際に使用されます。varで宣言された変数は、宣言されたスコープ内であればどこでも参照・変更が可能です。 let: letキーワードは、変数を

          ちゃる＠駆け出しWeb…

          Javascriptの変数宣言、varとletとconstについて

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          CSSでグラデーションをつくる方法

          こんにちは、ちゃるです😀 今日はCSSでグラデーションをつくる方法について調べました！ CSSでグラデーションを設定するには、background-imageプロパティを使用します。次のようなコードを記述します。 #grad { background-image: linear-gradient(red, yellow);} このコードでは、#gradというIDを持つ要素の背景にリニアグラデーションが設定されます。リニアグラデーションは、色が1色から別の色へ繰り返し変

          ちゃる＠駆け出しWeb…

          CSSでグラデーションをつくる方法

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          Webサイトにおける「ペルソナ」とは？

          こんにちは、ちゃるです😀 今日は「ペルソナ」について調べてみました。 ペルソナと言ってもゲームではないですよ😁 Webサイトにおけるペルソナとは？Webサイトのペルソナは、そのWebサイトを表す人物像のことです。ペルソナは、Webサイトのターゲットユーザー層や、そのWebサイトが提供するサービス、製品などを表す人物像です。ペルソナを作成することで、Webサイトがどのような人々を対象としているのか、どのようなサービスを提供しているのかがわかりやすくなります。また、ターゲットユ

          ちゃる＠駆け出しWeb…

          Webサイトにおける「ペルソナ」とは？

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          CSSの命名規則　BEM・OOCSS・SMACSSについて調べてみた

          こんにちは、ちゃるです😀 今日はCSSの命名規則について、BEM・OOCSS・SMACSSについて調べてみました！ 気まぐれでクラス名をつけていると複雑なWebサイトでは管理しづらくなってしまいますよね。それを防ぐためにクラス名にもルールを決めて運用するというのが命名規則です。 BEMBEMは、Block, Element, Modifierの略で、WebサイトやWebアプリケーションのデザインやマークアップに使用される命名規則の一つです。この命名規則は、HTMLとCSS

          ちゃる＠駆け出しWeb…

          CSSの命名規則　BEM・OOCSS・SMACSSについて調べてみた

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          Intersection Observerを使用してウインドウ内に要素が入ったらフェードインして表示させる

          こんにちは、ちゃるです😀 今日はIntersection Observerについて調べました。 Intersection Observerは要素と交差したかどうかを判定するクラスです。ウインドウとの交差を判定することで、画面内に入ったかどうかを判定することができます。 このIntersection Observerを使用して、ウインドウ内に要素が入ったらフェードインして表示される処理を書いてみました！ Copy code// フェードインする要素を取得const fa

          ちゃる＠駆け出しWeb…

          Intersection Observerを使用してウインドウ内に要素が入ったらフェードインして表示させる

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          CSSの新しい単位「svh」について

          こんにちは、ちゃるです😀 今日はCSSで使える「svh」という単位について調べました！ pxやvhはよく使ってたけどsvhって…？ svhという単位は、CSS3にて導入された単位です。 svhは「スクリーン上の縦方向のビューポートの高さの単位」を表します。 この単位は、スクリーン上の縦方向のビューポートの高さを1として、その縦幅の比率を表すことができます。 例えば、スクリーン上の縦方向のビューポートの高さが500pxの場合、100svhは500pxに相当します。 こ

          ちゃる＠駆け出しWeb…

          CSSの新しい単位「svh」について

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          CSSセレクタの優先度について

          こんにちは、ちゃるです😀 今日はCSSセレクタの優先度について勉強しました。 CSSが効いたり効かなかったり…よくわかっていなかったのであらためてきちんと調べました！ CSSセレクタの優先度とはCSSセレクタの優先度とは、そのセレクタがどの程度優先されるかを決めるものです。セレクタの優先度が高いほど、そのセレクタが適用されるスタイルが優先されます。 CSSセレクタの優先度は、以下のように計算されます。 同じセレクタを複数回使用した場合、最初に出てきたセレクタの優先度が高

          ちゃる＠駆け出しWeb…

          CSSセレクタの優先度について

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          css gridで3列のレイアウトをつくる

          こんにちは、ちゃるです😀 今日はCSS Gridについて調べました。 CSS Gridを使用して3列のレイアウトを作成するには、まずHTMLの <div> 要素を使甋して、グリッド コンテナーとしてマークアップします。 そして、 display: grid を使甋して、その要素をグリッド コンテナーに設定します。 次に、 grid-template-columns プロパティを使甋して、列の数とサイズを定義します。ここでは、3つの列を作成し、それぞれの幅を指定します。例

          ちゃる＠駆け出しWeb…

          css gridで3列のレイアウトをつくる

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          Javascriptでオブジェクトや配列をループする方法

          こんにちは！ちゃるです。 今日はJavascriptのループについて調べてみました😀 JavaScriptでは、for文やfor-in文、for-of文、while文、do-while文などが使えます。 まず、for文を使って配列をループする例を見てみましょう。以下は、配列colorsをfor文を使って取り出している例です。 // 配列を定義するconst colors = ['赤', '青', '黄'];// for文を使って配列をループするfor (let i =

          ちゃる＠駆け出しWeb…

          Javascriptでオブジェクトや配列をループする方法

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          スクロールしたらフェードインして表示させる

          こんにちは、ちゃるです！ 今日はスクロールしたらフェードインして表示させる動きをCSSとJavascriptで作ってみます。次のような手順で作っていきます！ HTMLに、フェードインさせる要素を記述する。<div class="fade-in-element">要素をフェードインさせる</div> CSSで、フェードインさせる要素に対して、透明度を0（不透明度を0）に設定する。.fade-in-element { opacity: 0;} JavaScriptで、ウ

          ちゃる＠駆け出しWeb…

          スクロールしたらフェードインして表示させる

          ちゃる＠駆け出しWebデザイナー💻エンジニア

          はじめまして、ちゃるです

          関西地方で営業職をやっています。 WEBデザイナーかエンジニアになりたいため、独学で勉強をはじめました。 noteには勉強したことや覚えたいことを書いていこうと思います。 よろしくお願いします！

          ちゃる＠駆け出しWeb…

          はじめまして、ちゃるです

          ちゃる＠駆け出しWebデザイナー💻エンジニア