配列・オブジェクト内の要素を用いて、様々な操作を行うことが出来る「スプレッド構文」ですが、私自身もJavaScriptやTypeScriptでコードを書く際に使ってましたが、React.jsを使うようになってからすごく頻 […]
Web技術に関するハウツーブログになります。 運営者が過去4年間で実際に現場で経験した内容から新しくキャッチアップしていく中で気付いたものまで、幅広く記事としてまとめ、公開しております。
東京にて、2018年～2020年 Java・PHP関連のプロジェクトへフロントエンドメインで参画。2020年以降は、地元福島へ戻り、リモートで 侍テラコヤで講師として3年間活動してきた実績を基に、個人でのレッスン対応もしてますので、気軽にお問い合わせください。
|
https://twitter.com/utubou_tech |
|---|---|
|
https://www.instagram.com/s_suke55/ |
![[ JavaScript 基礎 ] スプレッド構文(演算子)の使い方・注意点](https://img.blogmura.com/sites/1192007/post-images/49657974.webp/crop/435x435)
[ JavaScript 基礎 ] スプレッド構文(演算子)の使い方・注意点
配列・オブジェクト内の要素を用いて、様々な操作を行うことが出来る「スプレッド構文」ですが、私自身もJavaScriptやTypeScriptでコードを書く際に使ってましたが、React.jsを使うようになってからすごく頻 […]
![[ JavaScript 基礎 ] Null合体演算子の使い方 & 注意点](https://img.blogmura.com/sites/1192007/post-images/49610101.webp/crop/435x435)
[ JavaScript 基礎 ] Null合体演算子の使い方 & 注意点
本記事では、JavaScriptの構文であり、&&(AND)や (OR)と同じ論理演算子の1種である「Null合体演算子」の使い方や注意点について、ご紹介しております。if文やswitch文など条件分岐に適した他の構文と比較したサンプルコードも載せてますので、参考になればと思います。
![[React] Marerial UI – Material Iconsを導入する方法 + 使い方](https://img.blogmura.com/sites/1192007/post-images/49482083.webp/crop/435x435)
[React] Marerial UI – Material Iconsを導入する方法 + 使い方
Reactの現場でもよく用いられているCSSフレームワークは、BootstrapやBulma…など, UIフレームワークといえば、 Chakra UIやMarerial UIが挙げられます。 今回は、その中で […]
![[React] Sass(.scss)を導入する方法 (検証用のサンプルコードあり)](https://img.blogmura.com/sites/1192007/post-images/49465063.webp/crop/435x435)
[React] Sass(.scss)を導入する方法 (検証用のサンプルコードあり)
本記事では、Reactの環境へSassを導入する方法についてご紹介してます。 現在のReactのバージョンですと、これまでの方法が非推奨となっているので、これからReactを学んでいかれる方やReactのバージョンを更新するうえで、Sassを適切に使っていきたい方にオススメの内容になっておりますので参考になれば嬉しいです。
React + JavaScript – 開発環境構築方法(Windows & Mac)
JavaScriptのライブラリとして、React.jsが2013年に公開されるようになってから現在まで9年以上が経過しましたが、今や多くの現場で使用されているライブラリとなりました。 しかし、まだ扱える人材がJavaや […]
【React hooks】useContextの基礎を習得 – カウンターアプリ
※ 本記事は、以下の記事の続きになります。 【React hooks】useReducerの基礎を習得 – カウンターアプリ作成 【React hooks】useReducerの基礎を習得 - カウンターアプ […]
【React hooks】useReducerの基礎を習得 – カウンターアプリ
※ 本記事は、以下の記事の続きになります。 【React hooks】useState・propsの基礎を習得(カウンターアプリ作成) 【React hooks】useState・propsの基礎を習得 - カウンターア […]
【React hooks】useState・propsの基礎を習得 – カウンターアプリ
本記事内では、React hooksで提供される関数の一つである「useState」とpropsの基礎的な使い方をカウンターアプリを作成しながら解説していきます。 加えて、公式ページの内容にも少し触れていきたいと思います […]
nodebrewでNode.jsのバージョンが確認出来ない際の対処法
nodebrewは、Node.jsのバージョンを管理できるもので、プロジェクトに応じて、Nodeのバージョンの切り替えをコマンドを簡単に行うことができる点は、とても有難いものです。 本記事では、インストール済みであるにも […]
【Mac】Reactの新規アプリ作成時に発生したnpmエラーへの対処方法
昨日までは、いつも通りNode.jsのnpmコマンドを実行できていたのに、、急にnpmコマンドのエラーが発生すると萎えますよね.. 基本的には、Pathがおかしいかnode.jsのバージョンが低いことが原因ではありますが […]
AddQuickTagでアドセンス広告用のクイックタグを作成する方法
ブログサイトの運営で収益を目指していきたいのであれば、必ず合格をもらっておきたいGoogle AdSense(アドセンス)ですが、自分で好きな位置に広告を置きたいときに、コードを記事に毎回セットするの大変ですよねR […]
cocoon : タブに関するCSS(背景色・文字色・枠線・文字のフォント)をカスタマイズする方法
WordPressの無料テーマの中でも多くの方に使用されている「cocoon(こくーん)」で、フロントページの表示形式を「タブ一覧」に設定した際、背景色や文字(種類、色)・枠線をどうしたら変更出来るのか、CSSのどの部分 […]
【WordPress : オリジナルテーマでサイト制作】 第1回 オリジナルテーマ作成
本記事よりWordPress上にオリジナルテーマを作成し、完全オリジナルのWebサイトを制作したいと考えてる方向けにレスポンシブ対応のサイトが出来るまでの流れを複数に分けてご紹介させて頂きます。 第1回では、オリジナルテーマの作成手順になりますので、参考になれば幸いです。
React.js : create-react-appでアプリを作成することが出来ない場合の解決法
本記事では、React.jsにて、create-react-appコマンドを用いて、新規のアプリを作成しようとした際に発生したエラーの解消法について、何故エラーが発生したのかも含めてご紹介させて頂いております。 特に、少し古い記事などを参考に特定のバージョンでReactの環境を作った方が遭遇しやすいエラーになります。
Local by fly wheel インストール & サイト作成〜言語変更方法
WordPressでWeb制作を行っていくためには、PC上で作業を行うためのローカル環境を準備する必要があります。そこで、本記事では、ローカル環境として使用するLocalbyflywheelのインストールとサイトの作成までの手順をご紹介させて頂いております。
CommandError: ‘アプリ名’ is not a valid app name. エラー対処法
命名規則とは、名前をつける際のルールになりますが、アプリ開発を行う上でも存在します。本記事では、PyhtonのWebフレームワークであるDjangoでアプリを作る際に発生した「CommandError: '○○○' is not a valid app name. 」というエラーの対処法をご紹介させて頂いております。
AWS EC2インスタンスへSSH接続する方法 ( Mac )
示された手順通りに進めても、上手くいかないのは、困りますよね...。 そんな経験も交え、本記事では、AWSにてEC2インスタンス作成を行った際に、PC(Mac)からSSH接続を行う方法をご紹介させて頂いております。
![[ Django ] コマンドラインからプロジェクトの作成 & サーバーの起動を行う方法](https://img.blogmura.com/sites/1192007/post-images/38966975/crop/290x290)
[ Django ] コマンドラインからプロジェクトの作成 & サーバーの起動を行う方法
本記事では、PythonのWebフレームワークであるDjangoにおいて、新規のプロジェクトの作成からサーバーの起動を行う手順をご紹介させて頂いております。 Windows , Mac限らず同様の方法で行うことが出来ますので、Djangoで開発を行う際は、覚えるようにしましょう。
![[ Django ] TypeError at ✖︎✖︎ : argument 1 must be str, not PosixPath 対処法](https://img.blogmura.com/sites/1192007/post-images/38966972/crop/290x290)
[ Django ] TypeError at ✖︎✖︎ : argument 1 must be str, not PosixPath 対処法
本記事では、PythonのWebフレームワークであるDjangoの開発を行う上で、TypeError(argument 1 must be str, not PosixPath)が発生した際の対処法についてご紹介しております。一箇所修正するだけで解消できますので、サクッと修正してしまいましょう。
Djangoの開発環境を準備する手順 (Anaconda未使用)
本記事では、MacでのPyhtonのWebフレームワークであるDjangoの開発環境準備の手順をご紹介させて頂いております。 VScodeの準備及びPyhton3のインストールも併せて、載せておりますので、参考になればと思います。
Mac : Python3のインストール手順 ( VSCodeでバージョン確認含む )
本記事では、MacのPC上で、Pyhton3をインストールする方法についてご紹介させて頂いております。コマンドの入力/確認などについては、VSCode(Visual Studio Code)を使用しております。Macでは標準でPython2は入っておりますが、バージョンを3にあげておきましょう。
シニア層よりも若年層の方がオンライン会議のマナーを意識している傾向が強い!?
スポンサーリンク オンライン会議のマナー ざっくりオンライン会議におけるマナーといえば以下のものが挙げられます。 ここで挙げているものはあくまで最低限なので、上司が話している際にメモを取るなど、とある状況下...
「ブログリーダー」を活用して、ウツボウさんをフォローしませんか？
![[ JavaScript 基礎 ] スプレッド構文(演算子)の使い方・注意点](https://img.blogmura.com/sites/1192007/post-images/49657974.webp/crop/120x120)
配列・オブジェクト内の要素を用いて、様々な操作を行うことが出来る「スプレッド構文」ですが、私自身もJavaScriptやTypeScriptでコードを書く際に使ってましたが、React.jsを使うようになってからすごく頻 […]
![[ JavaScript 基礎 ] Null合体演算子の使い方 & 注意点](https://img.blogmura.com/sites/1192007/post-images/49610101.webp/crop/120x120)
本記事では、JavaScriptの構文であり、&&(AND)や (OR)と同じ論理演算子の1種である「Null合体演算子」の使い方や注意点について、ご紹介しております。if文やswitch文など条件分岐に適した他の構文と比較したサンプルコードも載せてますので、参考になればと思います。
![[React] Marerial UI – Material Iconsを導入する方法 + 使い方](https://img.blogmura.com/sites/1192007/post-images/49482083.webp/crop/120x120)
Reactの現場でもよく用いられているCSSフレームワークは、BootstrapやBulma…など, UIフレームワークといえば、 Chakra UIやMarerial UIが挙げられます。 今回は、その中で […]
![[React] Sass(.scss)を導入する方法 (検証用のサンプルコードあり)](https://img.blogmura.com/sites/1192007/post-images/49465063.webp/crop/120x120)
本記事では、Reactの環境へSassを導入する方法についてご紹介してます。 現在のReactのバージョンですと、これまでの方法が非推奨となっているので、これからReactを学んでいかれる方やReactのバージョンを更新するうえで、Sassを適切に使っていきたい方にオススメの内容になっておりますので参考になれば嬉しいです。
JavaScriptのライブラリとして、React.jsが2013年に公開されるようになってから現在まで9年以上が経過しましたが、今や多くの現場で使用されているライブラリとなりました。 しかし、まだ扱える人材がJavaや […]
※ 本記事は、以下の記事の続きになります。 【React hooks】useReducerの基礎を習得 – カウンターアプリ作成 【React hooks】useReducerの基礎を習得 - カウンターアプ […]
※ 本記事は、以下の記事の続きになります。 【React hooks】useState・propsの基礎を習得(カウンターアプリ作成) 【React hooks】useState・propsの基礎を習得 - カウンターア […]
本記事内では、React hooksで提供される関数の一つである「useState」とpropsの基礎的な使い方をカウンターアプリを作成しながら解説していきます。 加えて、公式ページの内容にも少し触れていきたいと思います […]
nodebrewは、Node.jsのバージョンを管理できるもので、プロジェクトに応じて、Nodeのバージョンの切り替えをコマンドを簡単に行うことができる点は、とても有難いものです。 本記事では、インストール済みであるにも […]
昨日までは、いつも通りNode.jsのnpmコマンドを実行できていたのに、、急にnpmコマンドのエラーが発生すると萎えますよね.. 基本的には、Pathがおかしいかnode.jsのバージョンが低いことが原因ではありますが […]
ブログサイトの運営で収益を目指していきたいのであれば、必ず合格をもらっておきたいGoogle AdSense(アドセンス)ですが、自分で好きな位置に広告を置きたいときに、コードを記事に毎回セットするの大変ですよねR […]
WordPressの無料テーマの中でも多くの方に使用されている「cocoon(こくーん)」で、フロントページの表示形式を「タブ一覧」に設定した際、背景色や文字(種類、色)・枠線をどうしたら変更出来るのか、CSSのどの部分 […]
本記事よりWordPress上にオリジナルテーマを作成し、完全オリジナルのWebサイトを制作したいと考えてる方向けにレスポンシブ対応のサイトが出来るまでの流れを複数に分けてご紹介させて頂きます。 第1回では、オリジナルテーマの作成手順になりますので、参考になれば幸いです。
本記事では、React.jsにて、create-react-appコマンドを用いて、新規のアプリを作成しようとした際に発生したエラーの解消法について、何故エラーが発生したのかも含めてご紹介させて頂いております。 特に、少し古い記事などを参考に特定のバージョンでReactの環境を作った方が遭遇しやすいエラーになります。
WordPressでWeb制作を行っていくためには、PC上で作業を行うためのローカル環境を準備する必要があります。そこで、本記事では、ローカル環境として使用するLocalbyflywheelのインストールとサイトの作成までの手順をご紹介させて頂いております。
命名規則とは、名前をつける際のルールになりますが、アプリ開発を行う上でも存在します。本記事では、PyhtonのWebフレームワークであるDjangoでアプリを作る際に発生した「CommandError: '○○○' is not a valid app name. 」というエラーの対処法をご紹介させて頂いております。
示された手順通りに進めても、上手くいかないのは、困りますよね...。 そんな経験も交え、本記事では、AWSにてEC2インスタンス作成を行った際に、PC(Mac)からSSH接続を行う方法をご紹介させて頂いております。
![[ Django ] コマンドラインからプロジェクトの作成 & サーバーの起動を行う方法](https://img.blogmura.com/sites/1192007/post-images/38966975/crop/80x80)
本記事では、PythonのWebフレームワークであるDjangoにおいて、新規のプロジェクトの作成からサーバーの起動を行う手順をご紹介させて頂いております。 Windows , Mac限らず同様の方法で行うことが出来ますので、Djangoで開発を行う際は、覚えるようにしましょう。
![[ Django ] TypeError at ✖︎✖︎ : argument 1 must be str, not PosixPath 対処法](https://img.blogmura.com/sites/1192007/post-images/38966972/crop/80x80)
本記事では、PythonのWebフレームワークであるDjangoの開発を行う上で、TypeError(argument 1 must be str, not PosixPath)が発生した際の対処法についてご紹介しております。一箇所修正するだけで解消できますので、サクッと修正してしまいましょう。
本記事では、MacでのPyhtonのWebフレームワークであるDjangoの開発環境準備の手順をご紹介させて頂いております。 VScodeの準備及びPyhton3のインストールも併せて、載せておりますので、参考になればと思います。
本記事よりWordPress上にオリジナルテーマを作成し、完全オリジナルのWebサイトを制作したいと考えてる方向けにレスポンシブ対応のサイトが出来るまでの流れを複数に分けてご紹介させて頂きます。 第1回では、オリジナルテーマの作成手順になりますので、参考になれば幸いです。
本記事では、React.jsにて、create-react-appコマンドを用いて、新規のアプリを作成しようとした際に発生したエラーの解消法について、何故エラーが発生したのかも含めてご紹介させて頂いております。 特に、少し古い記事などを参考に特定のバージョンでReactの環境を作った方が遭遇しやすいエラーになります。
WordPressでWeb制作を行っていくためには、PC上で作業を行うためのローカル環境を準備する必要があります。そこで、本記事では、ローカル環境として使用するLocalbyflywheelのインストールとサイトの作成までの手順をご紹介させて頂いております。
命名規則とは、名前をつける際のルールになりますが、アプリ開発を行う上でも存在します。本記事では、PyhtonのWebフレームワークであるDjangoでアプリを作る際に発生した「CommandError: '○○○' is not a valid app name. 」というエラーの対処法をご紹介させて頂いております。
示された手順通りに進めても、上手くいかないのは、困りますよね...。 そんな経験も交え、本記事では、AWSにてEC2インスタンス作成を行った際に、PC(Mac)からSSH接続を行う方法をご紹介させて頂いております。
本記事では、PythonのWebフレームワークであるDjangoにおいて、新規のプロジェクトの作成からサーバーの起動を行う手順をご紹介させて頂いております。 Windows , Mac限らず同様の方法で行うことが出来ますので、Djangoで開発を行う際は、覚えるようにしましょう。
本記事では、PythonのWebフレームワークであるDjangoの開発を行う上で、TypeError(argument 1 must be str, not PosixPath)が発生した際の対処法についてご紹介しております。一箇所修正するだけで解消できますので、サクッと修正してしまいましょう。
本記事では、MacでのPyhtonのWebフレームワークであるDjangoの開発環境準備の手順をご紹介させて頂いております。 VScodeの準備及びPyhton3のインストールも併せて、載せておりますので、参考になればと思います。
本記事では、MacのPC上で、Pyhton3をインストールする方法についてご紹介させて頂いております。コマンドの入力/確認などについては、VSCode(Visual Studio Code)を使用しております。Macでは標準でPython2は入っておりますが、バージョンを3にあげておきましょう。
スポンサーリンク オンライン会議のマナー ざっくりオンライン会議におけるマナーといえば以下のものが挙げられます。 ここで挙げているものはあくまで最低限なので、上司が話している際にメモを取るなど、とある状況下...
