【JavaScript 関数ドリル】中級編のreverse関数の実装アウトプット

## reverse関数の課題内容

\_.reverse関数を自分で実装する課題。
https://lodash.com/docs/4.17.15#reverse

「課題内容」/「解説動画」/「解答例」を確認したい場合は、以下リンク先のページを参照。

【中級】reverse関数の実装

## 課題に取り組む前の状態

– 解答を見なくてもできそうだと思った。

## 課題に取り組んだ後の状態

– 自分で実装できた。
– 解答例はループ処理の回数が半分で済む記述となっていて、参考になった。

## reverse関数の実装コード（答えを見る前）

“`javascript
function reverse(array) {
const reversedArray = [];

for (let i = 0; i < array.length; i++) { reversedArray.unshift(array[i]); } for (let i = 0; i < array.length;

Angularの導入

## はじめに
前回「[Angularってどんなもの](https://qiita.com/HITOSUKE/items/19a5cbaaee039548e8bd)」ついての投稿よりAngularについては理解を深めてください。
今回は、Angularを導入についてご紹介したいと思います。

## Angularのインストール
実際に進めてみましょう。
### [Step1] Node.js をインストール
各コマンドを実行して、Node.js をインストールします。
Node.js のバージョンは14系を使用しました。
　

① サイトから Node.js をダウンロードする
　curlコマンドにてURL（ https://rpm.nodesource.com/setup_14.x ）から対象をダウンロードしてきます。

　▽コマンド
“`
curl –silent –location https://rpm.nodesource.com/setup_14.x | sudo bash –
“`

　▽実行結果例
“`
[root@localhost html]# curl

JavaScript 初心者の学習の軌跡（①基本編）

# はじめに
今まで何となく GAS を書いてGoogleスプレッドシートの改善とかやっていましたが、いつもわからないところを都度ググりつつ何となく JavaScript 書いているのがイヤになってきたので、ここで一度体系的に学習しようと思いました。（GAS ≒ JavaScript ではありますが…）

Salesforceの認定資格 [JavaScriptデベロッパー](https://trailhead.salesforce.com/ja/credentials/javascriptdeveloperi) 取得をゴールに見据えつつ、**自分が今まで知識としてちゃんと定着できていなかった部分**を記録として残していこうと思います。

なお学習には以下書籍を使用しています。(アフィリンクではありません）
また色々問題になりそうなので、記事内に本の内容をそのまま転載するようなことはせず、あくまで頭の中でかみ砕いた内容で記事作成をします。

https://www.shoeisha.co.jp/book/detail/9784798160276

# 実行環境
どちらも導入自体がかなり簡

【JavaScript 関数ドリル】中級編のremove関数の実装アウトプット

## remove関数の課題内容

\_.remove関数を自分で実装する課題。
https://lodash.com/docs/4.17.15#remove

「課題内容」/「解説動画」/「解答例」を確認したい場合は、以下リンク先のページを参照。

【中級】remove関数の実装

## 課題に取り組む前の状態

– 解答を見なくても実装できそうだと思った。

## 課題に取り組んだ後の状態

– 解答例と異なる部分はあるが、実行結果はサンプルと同じになった。

## remove関数の実装コード（答えを見る前）

“`javascript

function remove(array, predicate) {
const removedArray = [];

for (let i = 0; i < array.length; i++) { if (predicate(array[i])) { removedArray.push(...array.splice(i, 1)); } } return

【JavaScript 関数ドリル】中級編のpullAt関数の実装アウトプット

## pullAt関数の課題内容

\_. pullAt関数を自分で実装する課題。
https://lodash.com/docs/4.17.15#pullAt

「課題内容」/「解説動画」/「解答例」を確認したい場合は、以下リンク先のページを参照。

【中級】pullAt関数の実装

## 課題に取り組む前の状態

– 前回取り組んだpull関数と同じように実装すればいいのかなと思った。

## 課題に取り組んだ後の状態

– サンプルの実行結果と同じ結果が出たものの、第二引数が数字の場合、複数渡される可能性があることに気づいていなかったため、解答例を見て、修正しなければならなかった。

## pullAt関数の実装コード（答えを見る前）

“`javascript
function pullAt(array, indexes) {
const pulledArray = [];

switch (typeof (indexes)) {
case ‘number’:
pulledA

JavaScript初学者が書き方に慣れるためゲームを作ってみた

JavaScirptを学んで一か月弱になります。
C言語でできることができたり、できなかったりとなかなか苦戦しています。

ほぼほぼ基本構文を使用しており、組み込み関数をほぼ使用していないためコードが冗長になっています。
改善案をいただけると大変助かります。

デベロッパーツールを使用するゲームであり、
alartやpromptを多用しており邪魔かもしれませんが遊んでいただけると幸いです。

htmlを避けていますが、そろそろDOMについてしっかり学んで動的サイトを作りたいです。

“`warShipGame.html

Ajax 使い方基本

# Ajaxとは
非同期にクライアントとサーバで間の通信を行える仕組み。
リロードをする事なく、必要なデータのみ受信することができる。

## 非同期通信とは
非同期通信は画像の遷移のない通信。
非同期処理は、前の処理を終わりを待たずに、処理を進めていく。

同期処理は一瞬画面が白くなって、画面を切り替わる。
同期処理は、順番に一つ一つ処理を終わらせていく。

## Ajaxのメリット
・リンクをクリックした際のレスポンス待ち時間の体感時間が少くできる。

・必要な部分の情報のみを取得変更し、必要なときに更新可能の為高速に動作する。

## Ajaxを使う
### 準備
Ajaxを簡単に使うためのライブラリ「axios」をHTML内で読み込みます。
“`

“`

### get通信 パターン1
[例]
“ajax.php“でechoした物を、“index.html“で受け取る
“`ajax.php

AbortControllerでEventListenerを取り外す方法

こんにちは！ちゅらデータのおーすてぃんやいびーん！

# 概要
AbortControllerでEventListenerを取り外す方法を紹介します。

## 課題
EventListenerを取り外すことはメモリリークを防ぐのにも、思わぬ動作を抑制するのにも、必要な作業です。

従来のやり方では、EventTarget.removeEventListenerのメソッドを使って取り外していました。ただ、このやり方には以下の問題があります。
1. EventTarget.addEventListenerを実行した時に指定したEventListenerのEventタイプと完全に一致するようにEventTarget.removeEventListenerに渡さないと静かに失敗する
1. EventTarget.addEventListenerを実行した時に指定した関数のObject reference (オブジェクト参照)を2番目の引数と

JS 文章の一部を正規化で書き換える為に：2

以前、[こちら](https://qiita.com/molhot/items/ea4e046c8f8700485c0a)の記事にてJSを用いた文章の取り出し方を解説しました。
今回はその続きです。

## 今回のゴール：文章内条件と一致した文字があるか見る
以前、取り出したい位置の文章は取り出せましたね。
今回、文章は前回と同じく、こちらを用います。
“`html:HTML

あばたけたぶら

彼は背後にひそかな足音を聞いた。
それはあまり良い意味を示すものではない。
誰がこんな夜更けに、しかもこんな街灯のお粗末な港街の狭い小道で彼をつけて来るというのだ。

6歳娘「パパ、HTMLタグがセットなら、コンポーネントもセットにしちゃったら？」

※Reactを使っている前提です。
※タグっていうか要素やね。

# リモートワーク中ワイ

ワイ「さてと、今日もお仕事開始や」
ワイ「Webサイトを作っていくで」
ワイ「ほな、デザインデータを見ながらコーディングしていこか」
ワイ「どれどれ」

#### デザインデータ


ワイ「↑どうやら、この番号付きリストが」
ワイ「色んなページで登場するみたいやな」
ワイ「ほな、使いまわせるように**コンポーネント化**しておこか」

# コンポーネントを作る

ワイ「HTMLのタグとしては」

“`html

1. 〇〇する。

2. △△する。

3. □□する。

   <

VS Code 用プラグイン Microsoft Teams Toolkit が GA リリース ?

こんにちは、みなさん元気にお過ごしでしょうか？
ここ一年ほど、[一連のブログ記事(英語)](https://dev.to/azure/developing-enterprise-ready-microsoft-teams-apps-with-teams-toolkit-v30-o87)で Teams Toolkit プレビュー版を紹介してきましたが、今回、[Visual Studio Code 用 Teams Toolkit](https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension) と Teams Toolkit CLI が GA (Generally available) リリースになったことをお知らせします。そして、.NET の Web アプリを構築している方のための Visual Studio 用 Teams Toolkit がプレビュー版で利用できるようになりました。Build カンファレンスでの発表も聞いていただけたでしょうか？
![tomomi-b

[個人開発]一つのフォームをみんなで編集し合う掲示板を作ってみた！

今回作ったもの
https://www.synher.net/

最初の数秒は何もフォームに何も表示されないかもですがバグではないので、リロード等はしないでください。

# 初めに
一年ぶりとなってしまいましたが新しいwebアプリを作ってみました。それがSYNHERです。

vueを使ったアプリで初めての公開になりました。

# 概要

このようにリアルタイムでいろいろな人とフォームを編集して遊ぶアプリです。

# 何で作ったか
自分は「Reddit

webfontは使いたいけど重くて使いづらい。そんな悩みを解決するWebFontLoader

## はじめに

– LPやWeb制作を行う上で大事なフォント。高級感のあるフォント、信頼感をイメージ付けるフォントなど、そのサイトのイメージにあったフォントを選ぶことでユーザーに与える印象は大きく変わります。
– そこでよく使われるのがGoogle Fontsです。無料で使える上に、導入がとても簡単なのがいいですよね。でもGoogle Fontsのデメリットはなんといっても重い、つまり表示に時間がかかってサイトの読み込みに影響が出てしまうこと。
– そんなGoogle Fontsを非同期で読み込んでサイトの読み込みスピードを上げる方法を書いていきたいと思います。

## 通常のGoogle Fontsの使い方

– 通常は[Google Fonts](https://fonts.google.com/)にアクセスして読み込みパスを取得、使いたいサイトのhtml、もしくはcss内に追記して使います。

### Robotoの場合

– Google Fontsでよく使われている`Roboto`を使用したい場合、下のように読み込みパスを追加する必要があります。

#### htmlの

ノンビン塾～エンジニアとしての成長記録5～

## ノンビン塾について
そもそもノンビン塾ってなに？
→[過去の記事参照](https://qiita.com/kenny_engineer/items/fc3a45ef2c123ce49495)

## 前回の課題提出
### テーマ
　閏年のコードを`elseif` を使って簡略化する

### 回答
　elseifは使った事がなかったので、まずはどういったものなのか調べてみた。

>if (条件式①) {
> 記述した条件が満たされた場合の処理
>} else if (条件式②) {
> ①が満たされず②の条件が満たされた場合の処理
>} else {
> ①も②満たされなかった場合の処理
>}

ふむふむ。何となくイメージはつかめた。
ではやってみよう。

“`calc.js
(function() {
‘use strict’;
kintone.events.on([‘app.record.create.submit’,’app.record.edit.submit’], function(event) {
let str = ”;
let

PHPで数値のカンマ区切りプログラムを作成しました。

Webアプリケーションで数値のカンマプログラムを作成しました。
ソースコードを公開します。

注) 今回はJavaのFormatter、PHPのnumber_format関数は使用禁止という条件です。

条件を入れ忘れましたので追記いたします。

canma.php(入力側)

“`PHP