キーワード React が含まれる動画 : 971 件中 929 - 960 件目
種類:
- タグ
- キーワード
対象:
PC自作から始めるスマホアプリ開発 #26 React Native基礎編 背景画像を設定する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではmicroCMSから取得したサムネイル画像を記事タイトルの背景に設定する方法を解説しました。
このYouTubeシリーズのレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
動画内で紹介した「ImageBackground」のページです。
https://reactnative.dev/docs/imagebackground
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
PC自作から始めるスマホアプリ開発 #11 React Native基礎編 もっと読むを実装する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではサードパーティのライブラリを使用して「もっと読む」ボタンを実装しました。「もっと読む」ボタンで長文を開閉可能にしました。
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
今回紹介したライブラリです
https://github.com/fawaz-ahmed/react-native-read-more
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
The First 15 Minutes of Batman: Arkham Origins (Wii U)
Copied from MobyGames:
Batman: Arkham Origins is a prequel to Batman: Arkham Asylum and is set about one year after Bruce Wayne became Batman. The main villain is the drug lord Black Mask who assigns eight powerful villains to assassinate Batman once and for all. It is long before Arkham City was established and therefore Batman can explore the whole city.
The basic gameplay is unchanged to Arkham City. Batman still slides through the open city and visits more linear locations in plot missions. The fights use the series' trademark freeflow system. An important part of these fights is to react to the enemies. When said enemies have firearms, melee fights are out of the question and Batman has to use stealth.
Besides fighting even more enemies, there are side quests to solve, like stopping the sniper Deadbeat or solving the Enigma puzzles. The crime scene investigations with detective view were expanded and involve short videos which can be searched for clues.
【九楽ライと幻の塔】九楽ライ(Re:AcT)ファンゲーム【プレイスルー】
七四(x.com/nanashi_74_name)様によるファンゲームのプレイ動画です
うまく行った部分を繋ぎ合わせて全体を見えるようにしました
九楽ライ様: youtube.com/@KulakuLie
Re:AcT: v-react.com
PC自作から始めるスマホアプリ開発 #32 React Native基礎編 ライブラリにパッチを当てる
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではpatch-packageを使用してライブラリにパッチを当てる方法を紹介しました。
以前紹介したreact-native-snap-carouselが原因でエラーが表示されていたので、ライブラリを修正する方法となります。
このYouTubeシリーズのレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
動画内で紹介しているライブラリのページです
「patch-package」
https://github.com/ds300/patch-package
動画内で紹介したreact-native-snap-carouselのIssueのページです
https://github.com/meliorence/react-native-snap-carousel/issues/981
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
PC自作から始めるスマホアプリ開発 #22 React Native基礎編 クリップボードにコピーしてSnackbarを表示する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではexpo-clipboardを使用して文字列をクリップボードにコピーする方法と、React Native Paperを使用してSnackbarを表示する方法を解説しました。
このYouTubeシリーズのレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
動画内で紹介しているライブラリ「expo-clipboard」のページです。
https://docs.expo.dev/versions/latest/sdk/clipboard/
動画内で紹介しているライブラリ「React Native Paper」のページです。
https://callstack.github.io/react-native-paper/
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
PC自作から始めるスマホアプリ開発 #15 React Native基礎編 文字入力の使い方
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではTextInputを使用して、文字入力を実装する方法を紹介しました。
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
PC自作から始めるスマホアプリ開発 #9 React Native基礎編 GPSの位置情報を取得してマップに表示する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画では電話機のGPSを利用して位置情報を取得して、Google/Appleマップに表示する方法を解説しました。
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
JavaScriptで文字を結合する方法「`${}`」
数字の足し算はイメージしやすいですし最初に勉強しますが、文字の結合は意外と知らなかったりします。
また意外と文字同士を合体させないといけない場面は、サイト制作やアプリ開発で発生しますよね?
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/font-merge
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
【眺める戦国】前回の天下人、滅亡しました
初代天下人・もちもち国が、滅亡しました。
天下を取ったのは、全員寝てた国です。
このゲームは未完成。次の天下人は、あなたのコメントが決めます。
キャラ・ルール・無茶ぶり、募集中なのだ。
▼本編(第二話)はこちら
https://www.nicovideo.jp/watch/sm46540427
※ゲームは非公開。今は、動画でしか見られません。
(育ちきったら、いつか…? それもコメント次第なのだ)
【使用素材】
VOICEVOX:ずんだもん
BGM:SUNOで自作
ゲーム:自作(React製ブラウザゲーム)
#眺める戦国 #ずんだもん #shorts
【眺める戦国】第三話 視聴者のコメントで、ゲームが改造されました
ニコニコに「ログが小さい」とコメントが来たので、直しました。
記念すべき、コメント反映第1号なのだ。
一揆は、引き続きコメントで受け付けとります。
さらに開発者権限で「滅んだ国の土地は早い者勝ち」ルールを追加。
その結果——こっそり土地を拾った国が、天下を取りました。
ついでに前回MVPは、「近いから」という理由で寝返りました。
このゲームは未完成。次に変わるのは、あなたのコメント次第です。
キャラ・ルール・無茶ぶり、募集中なのだ。
▼第二話はこちら
https://www.nicovideo.jp/watch/sm46540427
▼シリーズ「眺める戦国」
https://www.nicovideo.jp/series/569797
※ゲームは非公開。今は、動画でしか見られません。
(育ちきったら、いつか…? それもコメント次第なのだ)
【使用素材】
VOICEVOX:ずんだもん
BGM:SUNOで自作(ゲーム内実装)
ゲーム:自作(React製ブラウザゲーム)
中学英単語を60日で覚えよう Day 53 【動詞(Pi-Re)】 - リスニングで覚える英単語
中学英単語、約1900を60日で無理なく覚える動画シリーズです。1回10分前後で通学、通勤の間など短い時間に聴くだけで勉強できるよう構成されています。英単語は品詞と意味をセット覚えることが大切ですので、各単語ごとに品詞と意味を確認できるようできています。
英単語によっては複数の品詞を持つものがあります。それらは品詞別に複数回、動画で登場します。これによりテンポよく英単語を覚えることができます。どの品詞の意味も大事ですので、それぞれ覚えていきましょう。
この動画シリーズでは高校受験に頻出する中学英単語を各動画ごとに同じ品詞グループになるようまとめてあります。基本はアルファベット順となっていますが、テーマとしてまとめて覚えたほうがよいもの(数字など)に限りテーマ順となっています。
<Day53の収録英単語>
Day53は、動詞(Pi-Re)の33個です。
pick plan plant play please poison pollute post practice prefer prepare present print produce protect provide publish pull punish push put rain raise reach react read realize rebuild receive recognize recycle reduce refresh
えいごの英語ch(英語学習サイト)
https://eigoch.jis.click/
【使用BGM】Result_Celtic(PeriTune), Laid_Back3(PeriTune)
【キャラクターボイス】弦巻マキ(CeVIO AI)
PC自作から始めるスマホアプリ開発 #12 React Native基礎編 画像を表示する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画では画像の表示方法を解説しました。
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
URLのエンコード、デコードって何すか?【encode,decode】
「エンコーディング」「URLの文字化け」なんてことを聞いたことがあるかと思います。
正直言って何をしているのか自分はさっぱり分からなかったのですが、JavaScriptで用意されている簡単な関数を使うことで一瞬で理解できたので共有です。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/encode-decode
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
PC自作から始めるスマホアプリ開発 #27 React Native基礎編 モーダルを表示する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画では「react-native-modal」を使用してモーダルを表示する方法を紹介しました。
このYouTubeシリーズのレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
動画内で紹介した「react-native-modal」のページです。
https://github.com/react-native-modal/react-native-modal
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
PC自作から始めるスマホアプリ開発 #10 React Native基礎編 グーグルスプレッドシートにアクセスする
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ #グーグルスプレッドシート #spreadsheet
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではAPIキーを使ってグーグルスプレッドシートにアプリからアクセスし、データをアプリ内に描画する方法を解説しました。簡易データベースとしてグーグルスプレッドシートを使いたいときに便利な方法です
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
動画内で紹介しているQiitaの記事です
https://qiita.com/votepurchase/items/9d575c91ad58eea5809d
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
PC自作から始めるスマホアプリ開発 #8 React Native基礎編 ウェブAPIからデータを取得する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではdraftbitの提供するテスト用ウェブAPIからデータを取得して画面に描画する処理を解説しました。
動画内に登場する自作ボイラープレートです。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
次回からはAppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
JavaScriptで書く色んな条件分岐のパターン「elseがない⁈」【早期リターン(return)】
JavaScriptの条件分岐の書き方は色んな種類を発見します。
他人のコードや見ていると遭遇する「何これ?」ってなる書き方を、パッと見ただけでザックリ理解できるようになると良いと思いましたので共有です。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/not-else
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
引用元:https://www.youtube.com/watch?v=EumXak7TyQ0
Twitter:https://twitter.com/rubyprogram
JavaScriptで大文字⇔小文字を自動変換する方法【toLowerCase, toUpperCase】
英語の文字で大文字と小文字を、どちらかに揃えたい場面があります。
例えばslackではチャンネル名は自動で小文字になります。
そんな感じで自動で変換するのはJavaScriptでは1行追加するだけなので紹介します。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/font-size-convert/
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
JavaScriptのSwitch文は最初に理解しとかないとReactでハマる件
Webデザイナーのお仕事でswitch文を使う機会はほとんど無いと思います。
なぜなら多くの場合でif文で事足りるからです。
僕自身も言葉の意味しか分かっていなかったですが、
Reactなど最新のJSを触った時に「ちゃんと理解しておけば、、、」となりました。
そんな過去の自分に向けてswitch文の基礎を共有したいと思った次第です。
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
【眺める戦国】寝てた武将がMVPになりました【良い子はマネしないでね】
今回の天下人は、ねこまた国。
そしてMVPは——最後まで起きている姿を誰も見ていない、枕元ぐっすり斎です。
寝てただけでMVP。
ただし現実の昼行燈は難易度が高いので、民草の皆様はマネしないでください。
このゲームは未完成。次のMVPは、あなたのコメントが決めるかもしれないのだ。
キャラ・ルール・無茶ぶり、募集中なのだ。
(一揆は、引き続きコメントで受け付けとります)
▼本編(第三話)はこちら
https://www.nicovideo.jp/watch/sm46558170
▼シリーズ「眺める戦国」
https://www.nicovideo.jp/series/569797
※ゲームは非公開。今は、動画でしか見られません。
(育ちきったら、いつか…? それもコメント次第なのだ)
【使用素材】
VOICEVOX:ずんだもん
BGM:SUNOで自作
ゲーム:自作(React製ブラウザゲーム)
PC自作から始めるスマホアプリ開発 #13 React Native基礎編 アイコンを表示する
#reactnative #自作pc #プログラミング #iphone #android #スマホアプリ
自作パソコンを組み立てるところから始めるスマホアプリ開発のハウツー動画です。React Native Expoを使います。
今回の動画ではアイコンの使用方法を解説しました。アイコンを使用してアイコンボタンを作り、アラートを表示する機能を実装しました。
このYouTubeシリーズ用のレポジトリです。
https://github.com/kiyohken2000/youtuber-project
上記のレポジトリは下記の自作ボイラープレートをベースとしています。
https://github.com/kiyohken2000/ReactNativeExpoBoilerplate
AppStoreとGooglePlayでの公開を目指して実際にアプリを開発していきます。
まだ開発するアプリは決まっていないので「こんなアプリが欲しい」やアプリのアイディアなどありましたら教えていただければうれしいです。
よろしくお願いします。
分かりそうで分からなかったReduxを説明してみた
Reduxを初めて触った時はいまいち「これって何のためにやるんだろう?」という感じでした。
それから数ヶ月経って初心者なりに感じたReduxを使う事による恩恵、純粋なReactのみで起こるリスクについてまとめてみました。
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
JavaScriptのconsole logにCSSでスタイル使えて草
console.log()で出力する内容にCSSのようにスタイルを適用できるのをご存知でしょうか?
何気なく使っているconsole.log()に一工夫を加えることで、プリントデバックの可読性が良くなるかと思い共有です。
ちなみに自分は実務では面倒くさがって使っていないですw
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/console-style
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
引用元:https://youtu.be/v2tJ3nzXh8I
JavaScriptで??,||,&&を使って条件分岐してみよう!
条件式は「if」で学ぶことになりますが、他にも同じような条件式を書ける方法があるのをご存知でしょうか?
自分も基本的には「if」を使いながらも、コードを簡素化する目的で状況に応じて違う書き方をしています。
最近になって知ったのですが「もっと早くに知っておけば。。。」と感じた内容ですので皆さんにとっても有益な内容かと思います。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/sumbol-if
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
引用元:https://youtu.be/v2tJ3nzXh8I
よくあるReactでのカウントの落とし穴を共有
Reactを勉強し始めた時に必ず通る「カウントアプリ」についてです。
要件もシンプルでReactの機能を体験するには良い題材ですが、注意して理解しないと本番でハマってしまいます。
「コーディングでJavaScriptは軽く触ったことがある」
「Reactに興味があって勉強し始めた」
そんな方に向けた内容になっています。
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/tips/wrong-counter
適当に使ってたuseStateの意味が何となく分かった件【react-hooks(useState,useRef)】
Reactを勉強したての時に遭遇したあるあるを共有させて頂きます。
学習教材やYoutubeでよく見られる書き方は意外と本番で思わぬバグを引き起こすことがあります。
まずは基本を抑えることが大事ですが、実際の作業では何気ないコードを深掘りすることが求められます。
僕自身が遭遇したuseStateに関する事例を紹介させて頂きます。
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/tips/wrong-usestate
【CSSのみ】横並びレイアウトの高さを揃えてみた
コーディングは順調に進められたのに WordPress化した時にレイアウト崩れが起きることがあります。
その都度、修正していくのですが出来るだけCSSメインで修正してJavaScriptにまで手を出したくないデザイナーは多いのでは無いでしょうか?
今回はあえてCSSのみでレイアウト崩れを回避する方法を共有してみたいと思います。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/tips/limit-line-css
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
引用元:https://www.youtube.com/watch?v=OhCzEjXvY9A
scriptタグでのJSファイルの読み込みコピペしてるとハマる?!【defer】
JavaScriptのファイルって実は読み込む場所を間違えると思ったように動作しない経験ってありませんか?
自分は最初の頃よく遭遇していて、ググってもイマイチ理解できませんでした。
本来なら読み込みについては軽くスキップせずに理解すべきなんですが、
学習教材やYoutubeではそこまで触れられていません。
小さなミスで時間を取られないようにJSファイルの読み込みの基本をまとめてみました。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/js-file-import
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
引用元:https://youtu.be/v2tJ3nzXh8I
JavaScriptで文字が含まれているかを調べる1行【includes,startsWith,endsWith】
文章の中から特定の文字を検索したい時は多いですが、大体が正規表現で挫折してしまいます。
柔軟性があって便利なのは正規表現ですが、簡単な検索であればJavaScriptの標準の関数でも実現できます。
今回は代表的な3パターンを紹介するので、正規表現を使えない人でも利用してもらえる内容になっています。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/font-index
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
エクセルで集計するときに「なに空白入れとんねん?」ってなるよねー【JavaScriptのtrimで解決します】
文章の両端にある空白を削除するのはJavaScriptを使えば秒で実現できます。
意図しない空白があることでデータ管理や集計にトラブルが発生するケースは意外とあるので知っておくだけでも得だと思い投稿しました。
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/font-space-trim/
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
JavaScriptで文字をカウント(数える)のめちゃ簡単な話
フォームの作成などで「文字をカウント」という場面に遭遇するかと思います。
便利なライブラリもありますが簡単な仕組みなので一度は自分で作ってみてほしいです。
加えて実務で自分が遭遇した小さなバグと対処法も紹介します。
画面収録をミスりまして画面が見切れてしまっています。。。
ハンズオンをしながら閲覧してもらう分には全く問題ないですが、ブログにもまとめているので必要に応じて活用くださいm(_ _)m
テキストで確認したい方はこちら↓
https://lorem-co-ltd.com/font-count/
この動画はReact初心者のWebデザイナーが勉強したことや初めて知ったことを復習と共有を目的に投稿します。
学習教材のような動画ではありませんが、Reactでのコーディング、Reduxでの状態管理など、多くのことを学びますので一緒にハンズオンで作業して頂く形で視聴していただくことができると思います。
また僕自身がreactの予備知識は必要ありませんので、
同じような初心者の方はもちろん、
「Web制作でコーディングは出来るけどReactもやってみたい」という方に見て頂けると嬉しいです。
ブログ:https://lorem-co-ltd.com/
Twitter:https://twitter.com/rubyprogram
