【ブログ一覧】 - ますみのブログ

ますみのブログ

パソコンとかプログラミングに関するあれこれ発信してます

【書けるからわかるCSS】deg、rad、turnとは?

こんにちは!エンジニアのますみです!本日はCSSの数値の単位deg、rad、turnについて解説します!聞きなれない単位ですね...何に使うのでしょうか?deg、rad、turnは回転の角度の単位deg、rad、turnはすべて回転の角度を表す単位です。transformのrotate等で使うことができます。それぞれ数値の意味合いが変わってくるので見ていきましょう。degの使い方BOX.box { transform : } degは最も簡単で、1degは円周の360分の1です。普段使う角度の単位と同じですね。数値を増やすと時計回りに要素が回転します。マイナスの値を指定すると反時計回りに回転します。radの使い方BOX.box { transform : } radはラジアンのことです。3.14が180度(180deg)、6.28が360度(360deg)です。動きが難しいのでサンプルは元の角度にオレンジの線、現在の角度に青い線を引きました。turnの使い方BOX.box { transform : } turnはさらに直感的で、1で一周といった意味になります。つまり半回転させたい場合は0.5turnとすればよいというわけですね最後まで読んでいただきありがとうございます!質問や、こんなことを記事にしてほしい!というのがありましたらTwitterのコメント等で受け付けていますので、お気軽にどうぞ!ますみ - 愛知県在住の20代プログラマー - | @mashmy_98それでは次の投稿もお楽しみに!

2023年04月29日

Read More

【プログラミング入門】最初に覚えておきたいプログラミング用語!

こんにちは!プログラマーのますみです!プログラミングを学習したての頃は、調べることがとにかく多い...欲しい答えにたどり着くには的確な検索キーワードを打ち込むべきですが、的確なキーワードすら知らずにわたしはとても苦労した覚えがあります...この記事を読めば学習がはかどる!そんな内容になるように頑張って書いていきます!この記事を書いた理由わたしがプログラミング言語を学習したての頃、わからないことを検索しようとしてもなんと検索したらよいのかわからずに時間がかかってしまうことがよくありました...調べものをするときに役立つ用語をまとめたサイトがあったらいいのに...と思っていたので、プログラミングを学習したての方がわたしと同じことで困らないためにこの記事を書きました!今回取り上げていきたい用語はほぼすべてのプログラミング言語に共通する用語なので、どの言語を学習していても役に立つ内容にしていきますので是非最後まで読んでみてください! 変数 定数 配列 オブジェクト最初に覚えておきたい用語①『変数』変数とは、データを格納するための箱のようなものです! プログラムの中で値を格納したり、計算したりするために使用されます。 変数には、値を代入することができ、その値は後で変更することができます。 変数は、その名前を用いてプログラム中で参照されます。例えば、javsacriptの場合は、以下のように変数を定義することができます!let price = 1000;こうしておくことで、プログラムのあちこちでprice呼び出して、priceに設定した値を使って計算したり、表示したりすることができます!変数を使うメリットは、人為的ミスを減らす、変更があった時に楽という点ですね!例えば変数を使わない場合console.log("商品の価格は" + 1000 + "円です");console.log("商品は二つで" + 1000 * 2 + "円です");と書くことになりますね大規模なプログラムを書く場合、これが何百行、何千行になったりするのですが、そうすると どこかで1000という数字を書き間違えてしまったり、『やっぱり1000じゃなくて1200で!』となった時に何千行のプログラムから1000という数字を見つけ出し、書き直すということをしなくてはいけません...変数を使って書いておけば、最初に定義したlet price = 1000;の部分さえ合っていればよいので、人為的ミスを減らすことができるし変更があってもこの一行だけ書き直せばいいわけですということで、使いまわす値、変更する可能性がある値は変数に格納しておくと便利!というわけですね!最初に覚えておきたい用語②『定数』定数とは、書き方は変数と似ていますが、変更することのできない値をいいます!例えば、javsacriptの場合は、以下のように定数を定義することができます!const PI = 3.14;この例では円周率をPIという定数に格納しています。円周率はプログラムの途中で別の値に変更することは考えにくいため、変更できないように定義して人為的ミスを減らすことができます!最初に覚えておきたい用語③『配列』配列とは、複数のデータを一つの変数で扱うことができる仕組みのことです!例えば、javsacriptの場合は、以下のように配列を定義することができます!const prices = [ 1000, 1200, 1500, 500 ];上記の例では商品の価格を配列に定義しました。さらに学習をしていくと、配列はプログラム言語ごとにさまざまな処理を行うことができることがわかってくると思います。例えばjavascriptの配列処理の機能で、上記のpricesの合計を計算してみるとconst prices = [ 1000, 1200, 1500, 500 ];let total = result.reduce(function(sum, e){  return sum + e;}, 0);という感じで価格の合計を計算することができます!最初に覚えておきたい用語④『オブジェクト』オブジェクトとは、プログラムの中で扱うデータを、そのデータに適した形でまとめたものです!例えば、javascriptの場合は、以下のようにオブジェクトを定義することができます!const product = {    name : "トマト",    price : 150};野菜って高いよね~...現場で扱うデータは、例のように複数の情報をひとまとめで扱うことが多いのでオブジェクトの扱いには慣れておくことが必須ですね!今回は最初に覚えておきたいプログラミング用語を紹介しました!質問や、こんなことを記事にしてほしい!というのがありましたらTwitterのコメント等で受け付けていますので、お気軽にどうぞ!ますみ - 愛知県在住の20代プログラマー - | @mashmy_98それでは次の投稿もお楽しみに!

2023年04月13日

Read More

ますみ

愛知県在住の20代プログラマーです!

プログラミングと無縁の専門学校を卒業して働き出しましたが、コロナ禍でほぼ無職に...

無職時代に独学でプログラミングを勉強して、未経験からめでたくプログラマーとして採用していただけました。

このブログを見た方が、わたしが独学で勉強していた時期に悩んでいたことで悩まないように...そう願いながら情報を発信しています!

おすすめレンタルサーバー


当サイトはXserverを利用しています。 HTML、CSSで作成したホームページはもちろん、wordpress、Laravel等で作成した高度なアプリケーションも利用可能です!

ますみ

愛知県在住の20代プログラマーです!

プログラミングと無縁の専門学校を卒業して働き出しましたが、コロナ禍でほぼ無職に...

無職時代に独学でプログラミングを勉強して、未経験からめでたくプログラマーとして採用していただけました。

このブログを見た方が、わたしが独学で勉強していた時期に悩んでいたことで悩まないように...そう願いながら情報を発信しています!