f@ctor

JavaScript関連のことを調べてみた2023年01月13日

JavaScript関連のことを調べてみた2023年01月13日
目次

WebStorm(IntelliJ)における”Promise returned from … is ignored”の警告を消す

Promiseが返ってくるけど別にawaitする必要ない(できない場合も多々な)ときにWebStormでは以下のような警告が出てしまいます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/385410/40e30a2b-70a8-7c90-caee-59370ea273c8.png)

上記のキャプチャはaws-amplifyというライブラリの非同期メソッド”federatedSignIn”を使用しています。

ほんとに些細なことですが、警告が残ってるのは気になるし、一番最初にIDEより提案される解決方法が`then()`をつけるというものです。
これもまた、あってもいいけど不要だしな…とずっと思っておりました。

これに対して個人的にいいと思う解決方法があったのでメモ的に。

# 解決法

`void`をつける。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/385410/2a498

元記事を表示

JavaScript 基礎 変数とデータ型まで

・変数宣言と定数宣言

`let`は変数宣言である。あとから値を再代入することができる。
`const`は定数宣言である。あとから値を再代入することができない。

・メモリの使い方

　プログラム上で使われる値はすべてメモリ上に保管されている。
　⇒メモリ上の場所はアドレスという数値で表現される。

再代入のイメージ

“`JavaScript:ex.js
let playerName = “ルフィ”;

playerName= “Luffy”;
“`

値の再代入のイメージ
![再代入.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2850098/b49f787b-5ed1-467a-2abc-9c66c1b8521b.png)

このイメージにように変数に別の値が代入されると、変数のアドレスが変化する。そして２番地にある”ルフィ”という値は、他の使用箇所がない場合メモリから削除

元記事を表示

【React】ポートフォリオに使えそうなタイムラインを作成する

# タイムラインとは？

こういうやつ。
自分のキャリアや人生をかっこよく見せることができる。

![app-tree.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2848520/a64de251-86dd-565e-a62f-398b8b6ca2c7.png)

# こちらのモジュールを使用します。
__React-Chrono__

https://github.com/prabhuignoto/react-chrono

# さっそく作ってみよう！

## create-react-app
“`react
npx create-react-app my-app
“`

## React Chronoをインストール！
“`react
// install with yarn
yarn add react-chrono

// or with npm
npm install react-chrono
“`

## データを表示してみよう！

タイムラインを表示するためには、表示するデータ群

元記事を表示

【React】HTMLの

がjavascriptで送信されないように設定する方法

## この記事について
Reactを学習し初めて気づいた点や、学んだ点を記録として残します。

## HTMLの`

`がjavascriptで送信されないように設定する方法
`

`タグを使用すると、ブラウザのデフォルト機能として入力値が送信され、画面がリロードされます。

“`react:qiita.js

return (

{
setEnteredTodo(e.target.value);
}}
/>

);
};
“`

例えば例の追加にある送信ボタンを押すと、その度に画面が更新されます。

元記事を表示

エンジニアインターン2日目

今日はLPのチェックボックスの修正を行った。
JavasctiptやjQueryを使ってチェックの位置を変更しようとした。
そこでnet::ERR_ABORTED 404のエラーが発生した。
調べたところパスがずれていることが問題だった。
この前新しくjsのファイルを作成したところjsファイルを読み込ませようとlinkを読み込ませたところが問題であった。このことを先輩エンジニアに質問したところ一瞬で解決した。linkを消すだけのことだった。
簡単なエラーだったからこそ恥ずかしいし悔しかった。しかし、エラーを解決するための考え方を学ぶことができた。
今はとにかく何でも吸収することが大切であると思う。一日中コードに向き合えるこの機会を大切にしていきたい。

元記事を表示

やりたいことの優先順位

# 自分が何をやるべきか忘れちゃうから
# やりたい事を書いてみる
1位
オセロ作りたい！
2位
洋服を管理できてコーディネートが組めるサービスを作りたい！
似てるサービス（目標）
・[XZ(クローゼット)](https://apps.apple.com/jp/app/xz-%E3%82%AF%E3%83%AD%E3%83%BC%E3%82%BC%E3%83%83%E3%83%88/id909369654)
3位
投票できるサービスを作りたい！
# 一歩、前進するためには
オセロ作ってる人のコードを写経してみる。
Youtube
[オセロ八段のプログラマーがオセロゲームを作る方法を教えたげるけどなんか質問ある？【JavaScriptプログラミング】](https://www.youtube.com/watch?v=EwGhVS-Y4LE&list=PLdYRFhfhNt_B583zw9EklZwmx8uj9C7qY)
JavaScriptのclassがわからないからアコーディオンボタンを作りながら理解してみる。
↓
[【JavaS

元記事を表示

Vue.jsでHTMLをインクルードする

# 1. 概要
趣味でやっているバスケットボールチームの公式HPを作ろうという話になり、簡単にHTMLを書き、Bootstrapでデザインを整え、Netlifyを使って公開しました。
3ページしかない小さなサイトですが、ヘッダーやメンバー紹介のカードなどHTMLを共通化したい部分がいくつかあったので、[Vue.js](https://jp.vuejs.org/index.html)のコンポーネントを使って共通化しました！

# 2. なぜVue.jsなのか
端的に言えば、使ったことがなかったから、そして一番簡単にできそうな手法だったからです。
「HTML インクルード」等で検索するとJavaScriptやPHPを使った手法がヒットします。HTMLの`