PHPプログラミング実践①　関数編

#はじめに#
コロナ休みで暇なので記事書いてます。
前にPHPプログラミング入門という記事を書いたので、まだみてない方はよかったらみてください。
前回の記事↓
[PHPプログラミング入門](https://qiita.com/SsS136/items/3f17a130be0485efeb41)
Twitterやってます。よかったらフォローきてください。
↓↓
[@DevTweak](https://sss136.github.io/)
低クオリティーTweakを作ってるので、よかったらリポジトリ登録してください。
↓↓
[リポジトリ](https://sss136.github.io/)

##目次##
1. 関数の実装
2. まとめ

##関数の実装##
関数の実装は簡単です。意外と。
まあこんな感じです。

“`php:index.php

“`

これで　こんにちは　と表示されます。戻り値なし、引数を取らない関数の場合ですね。
C言語だと戻り値があるかないかで、定義しな

【Webアクセシビリティ奮闘メモ】マークアップ編（超基礎）

勉強しないといけないと思いつつも、なかなか手を出せていなかったWebアクセシビリティ。
去年、[Accessibility Step Vol.6](https://a11ystep.connpass.com/event/156645/)に参加して、色んな方たちのお話聞いて、「あぁこれはちゃんと勉強しないと駄目なやつだわ」と実感。
だけど、いきなりやれと言われても難しい…そんなしっかり知識があるわけでもないし。。。

ということで。
ちまちまと調べたことをメモとして残していきます。

## セマンティックなマークアップはSEOに効果があるだけじゃないよ
まずはマークアップです、基礎の基礎。
SEO内部施策で「セマンティックなマークアップを！」みたいなことを言うけど、セマンティックなマークアップはSEOだけでなく、アクセシビリティにもよいのですな。

## HTMLで定義された要素を利用したマークアップ

– `

` / `

Slackで引用タグ（>）は内部的にはどのように認識されているか？

# 結論
**`>`**という特殊文字コードで認識されている

# `>`だと反応しない
“`
if (receivedMessage.indexOf(‘>’) === 0) {
var message = ‘“`’ + receivedMessage + ‘“`\n\nこの行の文頭に「>」を感知しました！’;
} else {
var message = ‘“`’ + receivedMessage + ‘“`\n\nこの行の文頭に「>」を感知しませんでした…’;
}
postMessage(message)
“`

# `>`で反応する
“`
if (receivedMessage.indexOf(‘>’) === 0) {
var message = ‘“`’ + receivedMessage

【初心者向け】Rからxtableを用いて掛け算九九表のHTMLを出力する。

多くの人が腕試しに試みてるので私も挑戦してみました。

	1x	2x	3x	4x	5x	6x	7x	8x	9x
1y	1	2	3	4	5	6 元記事を表示 #マンダラチャート の作成方法( #Localstrage 使うから入力値が保存されます) #該当 大谷投手の目標管理にマンダラチャートを利用していたというのは有名な話かと思います。 マンダラチャートを作成できるWEBサービスを探したのですが、見当たらなかったので作成しました。 #マンダラチャートURL [https://koji-yamamoto-github.github.io/mandala-chart/] #概要  Web1.0時代の見た目ですが、簡易に作成しようとするとこれが限界でした。 タイトルは変更することが出来ます。 入力した値は、Localstrageに保存するので、誤ってブラウザを閉じたとしても続きから始められるようにしてあります。 localstrageも含めて全部消すには、下部の「クリア」リンクを押下して頂ければ消えます。 #作り方 マス上のものは、以下のCSSを利用するに尽きます。 display: grid; 元記事を表示 【RoadsAPI】GoogleMapに自分の移動経路を描写する方法 ##今回のGPSロガーとは？ 位置情報をブラウザで取得＆移動を監視し、 GoogleMap上にピンを立て、歩いた経路を表示するものです！  ピンをクリックするとinfoWindowと呼ばれるフキダシが表示されます。  ##使用技術 ###HTML5/GeolocationAPI [MDN] https://developer.mozilla.org/ja/docs/Web/API/Geolocation_API – 現在地の取得、位置情報の監視はHTML５のGeolocationAPIを使用します。 元記事を表示 IE11のサポートを切ると使えるようになるCSSとか一覧 Internet Explorer11のサポートが切れ、今後は動作対象にIE11を含めないことも増えるでしょう。 サポートしないことにより、使えるHTMLとCSSをまとめました。 JavaScriptはきりがないので調べてません。 [Can I Use](https://caniuse.com/#compare_cats=CSS,HTML5)をもとにまとめています。 分かりやすいように簡単な説明をつけています。厳密に正しい説明ではありません。 順不同です。 反応次第でキレイに並び替えるかもしれません。 # HTML ## meter メーターを表示できる。 “`html:html at 50/100 “` タイプ：要素 使いやすさ：★★★☆☆ 参考：[<meter> – HTML: HyperText Markup Language 元記事を表示 パラメータ付きURLって、SNSでシェアできないの？（Twitter・Facebook） #できます ただし一手間が必要。 それは**エンコード**。 #実装方法 “`js // URLとパラメータを分ける var href = location.href; var param = location.search; var url = href.replace(param, ”); // パラメータをエンコード param = encodeURIComponent(param); // 各SNSのシェアURLと、シェアしたいURL、パラメータ、ハッシュタグを結合 // Twitter var twLink = ‘http://twitter.com/share?url=’ + url + param + ‘&hashtags=ハッシュタグ’; // Facebook var fbLink = ‘https://www.facebook.com/sharer/sharer.php?u=’ + url + param; // シェアボタンのリンクを置き換える // Twitter $(‘#js-tw-link’).attr(‘href’, twLink); // 元記事を表示 初心者がPHPで掲示板を作ってみた # はじめに プログラミング学習のアウトプットとして掲示板の制作しました。 この記事では掲示板の概要や制作過程について説明します。 ソースコードはこちらになっております。 [github:yukisugikawa/bulletin-board](https://github.com/yukisugikawa/bulletin-board.git) # 目的 掲示板の作成の過程で基本的なweb制作の技術を学ぶ。 就職活動に向けてのポートフォリオ作り。 # 開発環境 使用言語/HTML5/CSS3/PHP7 DB/MAMP/MYSQL 開発環境/macOS Catalina 10.15.3 #主な機能 ###ユーザー管理機能 ・ユーザー登録機能 ・ユーザーログイン機能 ###掲示板機能 ・投稿機能 ・コメント機能 ・編集、削除機能 #機能の説明 簡単にどういったコードで実装したか説明します。 見やすいように要点のみを書きました。 #1.データベース設計 ・threadsテーブルのboard_idはboardsテーブルと紐付けるために追加しました。 DB: bullet 元記事を表示 複数の画像が読み込まれた”後”に処理を実行させる # やりたかったこと 1. 画像を含んだ要素をappendする 2. appendされた画像がすべてロードされたあとに関数を実行する 2. その関数で、imgを含めた要素の高さを取得する ## つまづいたところ 通常ならappendしたらそのまま次の処理でheight()すれば、要素の高さを取得することができるが、**画像をappendしたときは画像がロードされたのを見届けなければ、高さがうまくとれない。** **それは、画像を子孫に含んだ要素も同じです。** リロードするとキャッシュされたものを拾ってくれるので、一見するとうまく処理されているように見えるトラップつきだった。 ### 失敗コード appendしてすぐに`match_height_byChildElems(‘.js-add-faceImgs’);`しているコードです。 “`javascript $(function () { var thumbnails = [‘taro’, ‘jiro’, ‘saburo’, ‘shiro’, ‘goro’, ‘tanjiro’] for (var i 元記事を表示 IE・EDGEのクリッカブルマップクリック時にどうしても枠線がでてきてしまう問題 タグにスクリプトを追加して回避 // メモ書きです 元記事を表示 PHPプログラミング入門 #はじめに こんにちは。 なんか学校がコロナ休みで暇すぎるので今回はPHPについて書いてこうかなと 思います。 よかったらツイッターやってるのでフォローよろしくお願いします。 ↓↓ [@DevTweak](https://twitter.com/DevTweak) あと低いクオリティーではありますが、Tweakも作ってるのでよかったらリポジトリ登録お願いします ↓↓ [リポジトリ](https://sss136.github.io/) #目次 1. PHPとは 2. 基本的な文法 3. 画面に出力するコード 4. いろんな演算子 5. 条件分岐 6. 繰り返し 7. sessionとcookie 8. その他いろんな関数とか 3. まとめ ##PHPとは まあめちゃくちゃ簡単に言うと、動的なWebページを作るサーバーサイドのオブジェクト指向型のプログラミング言語です。 何ができるかって言うと、代表的なのが掲示板ですね。SQLと組み合わせてデータベースに書き込んだり読み込んだりしてそれをWebページに表示したりできます。あとはログイン 元記事を表示 [HTML&CSS]画像と文字を互い違いに表示させる方法 忘れたときすぐ見れるよう自分用メモ こういうよく見るレイアウト  HTMLはこんな感じ “`html 1.テキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト 元記事を表示 [Chrome] ドロップダウンリストを開いたままにして Chrome のデベロッパツールで要素の検証をしたい # 問題 [React Select](https://react-select.com/home) というライブラリがある。このライブラリが提供するドロップダウンリストは、リストの外部をクリックすると自動的に閉じる仕組みになっている。そのため、リストの要素を検証したくてもできないというもどかしい事態に陥ってしまう。今回はこの問題を解決したい。他のドロップダウンリストのライブラリにも応用できるはず。 初心者によるWeb入門 #Web 　Web「World Wide Web」 　インターネットを介して文書を公開・閲覧するためのシステム 　Web上の文書(Webページ)は、**HTML**に代表される**ハイパーテキスト**と呼ばれる言語で構成されていて、 　表示させたい文章や画像を挿入して自身のコンテンツを魅力的に発信することができる。 　**Webの特徴** 　　他のハイパーテキストへの参照(**ハイパーリンク ＜ａ＞**)を挿入することで繋がることができる。 #HTML 　HTML「HyperText Markup Language」 　ハイパーテキストを記述するための言語 　文章の表示方法やハイパーリンクを、タグを使用して既述する「`マークアップ言語`」 #Webブラウザ 　ハイパーテキストの意味を解釈し、人にとって読みやすい内容に作り変えて表示するプログラム #サーバー 　サービスや機能を提供する側のコンピュータ #クライアント 　サービスを要求する側のコンピュータ #Webサーバー 　ブラウザからアクセスするホームページ等のファイルがおいてあるサーバー。 　Webブラウザからコンテンツ( 元記事を表示 PHP 生年月日のselectタグ　値保持 ##生年月日の入力フォームの作り方メモ selectタグでプルダウンの形で作りました。その際、バリデーションエラー等で元の画面に戻ったときに入力値が保持される様に処理しました。簡単ですがメモしておきます。 #####まず関数を作ります。 引数に始まりと終わりの年月日を指定し、プルダウンに一覧表示するようにします。第３引数は保持したい値を指定します。 ?演算子はとっても便利で、issetで値を確認するときなども良く使います。 “`php:function.php function birthdayLoop($start, $end, $selection=”){ echo ‘選択してね‘; for($i=$start; $i<=$end; $i++){ $i = sprintf('%02d', $i); $selected = $i==$selection?'selected':''; echo " 元記事を表示 初心者によるプログラミング学習ログ 259日目 #100日チャレンジの259日目 twitterの100日チャレンジ#タグ、#100DaysOfCode実施中です。 すでに100日超えましたが、継続。 100日チャレンジは、ぱぺまぺの中ではプログラミングに限らず継続学習のために使っています。 259日目は、 おはようございます 259日目 ・過去につくった自作ポートフォリオ改造　1.5h cssをsassで書く練習もしてます#早起きチャレンジProgate始めたてのあなたが読む記事① プログラミングを学び始めてprgateを使っての学習のまとめです。 prgateを始めたての初心者の方要所要所で 概念がわからない事があると思うのでこちらの記事も参考にしてください。 HTMLとCSSとは この2つはwebページを作成するにあたってパソコンに司令を出す言語です。 日本人には日本語で話しますし英語圏に人には英語で話しますよね。 それと同じようにパソコンにはパソコン語で司令を出します。 いくつか種類がありますがその中で最も基本的なものがこの HTML/CSSだと思ってください。 このHTML/CSSを学べば基本的なwebページは作れるようになります。 prgateを実際にやりながら復習として見てくださいね。 まずHTML/CSSを作成するにあたってテキストエディターという ノートのようなものを用意します。 このエディターに実際にHTML/CSS言語を入力し最終的にパソコンに 命令を出す文章を作成していくというわけです。 元記事を表示 Firefoxを改造してみようハンズオン Firefoxの改造を通してコントリビューター（特にN高生）を増やそうという記事です。 今回の改造ではFirefoxに隠しコマンドを追加します。HTMLとJavaScriptを使うので、N予備校のプログラミング入門コースを終えている人が対象です。 何か分からない事があれば、僕にSlack（圧倒的初心者の極み）かTwitter（[u7693](https://twitter.com/u7693)）で聞いてください。 ## とりあえずビルドしてみる 改造する前にFirefoxをビルドできるか確認します。 OSによって変わってきますが、大まかな流れは以下の通りです。詳細は[**Building Firefox – Mozilla | MDN**](https://developer.mozilla.org/en-US/docs/Mozilla/Developer_guide/Build_Instructions/Simple_Firefox_build)を見てください。 “`shell # ソースコードをとってくる $ hg clone https://hg.mozilla.or 元記事を表示 よく使うけどちょっとニッチなcss よく使うけど、いつもググってるので、まとめました。 ###3番目のみ “`style.scss li:nth-child(3){ margin-bottom: 20px; } “` ###2の倍数のみ “`style.scss :nth-child(2n) “` ###奇数 “`style.scss :nth-child(odd) :nth-child(2n+1) “` ###偶数 “`style.scss :nth-child(even) :nth-child(2n) “` ###最後以外 “`style.scss li:not(:last-child) { margin-bottom: 20px; } “` ###最初と最後のみ “`style.scss .wrap > li:first-of-type, .wrap > li:last-of-type { margin-bottom: 20px; } “` ###最初と最後以外 “`style.scss .wrap > li:nth-child(n+2):nth-las 元記事を表示 OTHERカテゴリの最新記事 2024.09.19 JavaScript関連のことを調べてみた 2024.09.19 JAVA関連のことを調べてみた 2024.09.19 iOS関連のことを調べてみた 2024.09.19 Rails関連のことを調べてみた 2024.09.19 Lambda関連のことを調べてみた 2024.09.19 Python関連のことを調べてみた