JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長 No.2

前回の記事では、ノーコードアプリのカスタマイズに取り組んだ経験を共有しました。自ら学び、改善していく過程で成長を感じ、引き続き案件を進めています。

今回は、メールアドレス形式のチェックを行うためのJavaScript関数を実装しました。
この関数は、入力された値が有効なメールアドレス形式かどうかを厳密に検証します。このような形式チェックは、ユーザーが正しい情報を入力するための重要な手段です。


// メールアドレスの形式チェック関数
const isValidEmailFormat = (value) => {
const emailRegex = /^[^\s@]+@[^\s@]+.[^\s@]+$/; // 厳密なチェック
return emailRegex.test(value);
};

 

JavaScriptを活用したノーコードアプリのカスタマイズに挑戦!経験から得た学びと成長

最近、ノーコードアプリ用のカスタマイズJavaScriptの案件に取り組んでいます。
その中で、実装した「ひらがな、カタカナの部分をヘボン式のローマ字に変換する」
コードの一部をシェアします。

最初はwanakanaライブラリを使用していましたが、レビューを受けてライブラリを使わない方法に切り替えました。その際に作成した変換マップを以下に示します。
レビューでの要望を解決するために自ら学習し、改善していく過程で、自信を深めることができました。

自身の成長を感じながら、引き続き案件を進めていきます。

// 変換マップの定義
const romanMap = {
'あ': 'a', 'い': 'i', 'う': 'u', 'え': 'e', 'お': 'o',
'か': 'ka', 'き': 'ki', 'く': 'ku', 'け': 'ke', 'こ': 'ko',
'さ': 'sa', 'し': 'shi', 'す': 'su', 'せ': 'se', 'そ': 'so',
'た': 'ta', 'ち': 'chi', 'つ': 'tsu', 'て': 'te', 'と': 'to',
'な': 'na', 'に': 'ni', 'ぬ': 'nu', 'ね': 'ne', 'の': 'no',
'は': 'ha', 'ひ': 'hi', 'ふ': 'fu', 'へ': 'he', 'ほ': 'ho',
'ま': 'ma', 'み': 'mi', 'む': 'mu', 'め': 'me', 'も': 'mo',
'や': 'ya', 'ゆ': 'yu', 'よ': 'yo', 'ら': 'ra', 'り': 'ri', 'る': 'ru', 'れ': 're', 'ろ': 'ro',
'わ': 'wa', 'ゐ': 'wi', 'ゑ': 'we', 'を': 'o',
'ん': 'n',
'が': 'ga', 'ぎ': 'gi', 'ぐ': 'gu', 'げ': 'ge', 'ご': 'go',
'ざ': 'za', 'じ': 'ji', 'ず': 'zu', 'ぜ': 'ze', 'ぞ': 'zo',
'だ': 'da', 'ぢ': 'ji', 'づ': 'zu', 'で': 'de', 'ど': 'do',
'ば': 'ba', 'び': 'bi', 'ぶ': 'bu', 'べ': 'be', 'ぼ': 'bo',
'ぱ': 'pa', 'ぴ': 'pi', 'ぷ': 'pu', 'ぺ': 'pe', 'ぽ': 'po',
'きゃ': 'kya', 'きぃ': 'kyi', 'きゅ': 'kyu', 'きぇ': 'kye', 'きょ': 'kyo',
'くぁ': 'qa', 'くぃ': 'qi', 'くぇ': 'qe', 'くぉ': 'qo',
'くゃ': 'qya', 'くゅ': 'qyu', 'くょ': 'qyo',
'しゃ': 'sha', 'しぃ': 'syi', 'しゅ': 'shu', 'しぇ': 'sye', 'しょ':'sho', 
'ちゃ': 'cha', 'ちぃ': 'tyi', 'ちゅ': 'chu', 'ちぇ':'tye', 'ちょ': 'cho',
'てゃ': 'tha', 'てぃ': 'thi', 'てゅ': 'thu', 'てぇ': 'the', 'てょ': 'tho',
'ひゃ': 'hya', 'ひぃ': 'hyi', 'ひゅ': 'hyu', 'ひぇ': 'hye', 'ひょ': 'hyo', 
'ふぁ': 'fa', 'ふぃ': 'fi', 'ふぇ': 'fe', 'ふぉ': 'fo',
'みゃ': 'mya', 'みぃ': 'myi', 'みゅ': 'myu', 'みぇ': 'mye', 'みょ': 'myo',
'ヴぁ': 'va', 'ヴぃ': 'vi', 'ヴぇ': 've', 'ヴぉ': 'vo',
'ぎゃ': 'gya', 'ぎぃ': 'gyi', 'ぎゅ': 'gyu', 'ぎぇ': 'gye', 'ぎょ': 'gyo',
'じゃ': 'ja', 'じぃ': 'zyi', 'じゅ': 'ju', 'じぇ': 'zye', 'じょ': 'jo',
'ぢゃ': 'dya', 'ぢぃ': 'dyi', 'ぢゅ': 'dyu', 'ぢぇ': 'dye', 'ぢょ': 'dyo',
'びゃ': 'bya', 'びぃ': 'byi', 'びゅ': 'byu', 'びぇ': 'bye', 'びょ': 'byo',
'ぴゃ': 'pya', 'ぴぃ': 'pyi', 'ぴゅ': 'pyu', 'ぴぇ': 'pye', 'ぴょ': 'pyo',
'ぁ': 'xa', 'ぃ': 'xi', 'ぅ': 'xu', 'ぇ': 'xe', 'ぉ': 'xo',
'ゃ': 'xya', 'ゅ': 'xyu', 'ょ': 'xyo', 'っ': 'xtu', 
'ヴ': 'vu',
'ー' : '-',
'、' : ', ',
',' : ', ',
'。' : '.'
};


「習うより慣れろ!」実務でのJavaScript経験を通じて成長する

昨年卒業した某プログラミングスクールの方から、JavaScriptの案件を紹介してもらい、同じく卒業生の方々と共同で取り組んでいます。

最初は分からないことや慣れない作業に戸惑いながらスタートしましたが、少しずつ状況を理解し、チームメンバーと協力しながら、初めての実務経験を積んでいます。

この案件を通じて、実際の業務の流れや問題解決のプロセスを学び、自身の成長を感じています。

 

桜が咲くこの季節に、久しぶりに新入社員の頃を思い出しながら、新たな経験を積む機会に感謝しています。

 

今後も、習うことから実務に慣れていく過程を大切にしていきます。

プログラミングの新たな勉強方法に挑戦

某プログラミングスクールを卒業後、改めてJavaScriptの勉強をしています。

新たな勉強方法としてYouTubeを利用し、初めてjQueryの勉強をしました。

アコーディオン表示機能の実装のYouTubeを見て、まだぼんやりの認識ながら、こうすれば、こう実装できるんだと新たな知識がつきました。

趣味で、筋トレをしていますが、プログラミングの勉強は筋トレとよく似ているなと感じています。コツコツとトレーニングを継続することで筋力(技術)が積みあがっていくものだと。プログラミングの勉強においても、筋トレ後に飲むプロテインのようなものがあればいいなと思ってしまいますが・・・。継続は力なり、筋トレと同様に、これからもコツコツと積み上げていきます。