PHPでお問い合わせフォームを作る - Qiita
はじめに タイトルについて記事にしました。 この記事で得る内容は以下の通りです。 ・ PHPを使ってお問い合わせフォームを実装 学習したことを一気に書いていたら長文になってしまいました。それでも構わなければご覧下さい。 手軽にお問い合わせフォームを実装したいという方は以下の記事をご覧下さい。 ・参考記事：Googleフォームを使ってお問い合わせ機能を実装する ローカルでPHPの動作確認をする XAMPPやMAMPなどを使わずに、ローカル環境で動作確認をしたい場合は、phpがインストールされている状態で、以下のコマンドを開発ディレクトリ下で実行しWebサーバを起動します。 http://localhost:8888/にアクセスをすると、index.phpの内容が表示されます。 概要 処理の全体図を画面イメージとシーケンス図を使って解説します。 画面イメージ PHPを使って、以下のような入力・
【JavaScript】var / let / const を本気で使い分けてみた - Qiita
再宣言 一度宣言した変数を、同じ変数名で宣言し直すことを再宣言といいます。 再宣言可能なvarで再宣言した場合、後に宣言した変数が適用され、 再宣言不可能なlet/constで再宣言した場合、エラーになります。 varでは、予期しない再宣言が起こりうるため危険です。 // var var a = 0; var a = 1; console.log(a) // `1`と出力される // let let b = 0; let b = 1; // SyntaxError: Identifier 'b' has already been declared // const const c = 0; const c = 1; // SyntaxError: Identifier 'c' has already been declared
JavaScript の this を理解する多分一番分かりやすい説明 - Qiita
JavaScript の this は、(他のプログラム言語から見ると) ちょっと面白い挙動に見えることがあります。 先日、この this の挙動について、会社の同僚が説明してくれたのですが、これまで聞いた説明の中で一番分かりやすいと感じたので、頑張って日本語で説明してみます。 分かりにくかったら、多分それは私の技量不足。 this と function の関係 function が基準スコープになるのがまず一点。 その function をどう呼ぶかで変わるのかがもう一点。 それを踏まえて…… this は function を呼んだ時の . の前についているオブジェクトを指している と理解できるというのが、同僚の説明でした。 . が省略された場合はグローバルオブジェクトになります (non-strict モード時)。 strict モードでは undefined になります。（@ryo
【JavaScript】アロー関数式を学ぶついでにthisも復習する話 - Qiita
対象読者 ES6を詳しくは知らない なんとなくJavaScriptを書けるけど、JSのthisの特性についてまだよく知らない アロー関数式を知らない、または知っているけど実装経験がない 概要 JavaScriptのES6で導入されたアロー関数式を、関数のただのシンタックスシュガーに過ぎないと思っていたのですが、調べてみると実際そうではないようだったので、thisの話と一緒にまとめてみました。 アロー関数式とは ES2015（ES6）から利用可能になった新しいJavaScriptの構文の一つです。 ES6とは、2015年に標準として策定されたJavaScriptの新しい文法です。 ES6では他にも、letによる変数宣言が可能になったり、promiseという非同期処理の実装ができるようになったりと、アロー関数式以外にも様々な構文追加がありました。 さて、この記事の主題はそのなかでもアロー関数な
Railsはどのようにテンプレートを見つけているか - Qiita
これは何？ Railsのテンプレート探索についてまとめた記事です Railsのバージョンは4.2です 本記事は以下の内容を翻訳したものに加筆・修正を加えています Digging Rails: How Rails Finds Your Templates Part 1 " Part 2 " Part 3 " Part 4 構成 この後の構成は以下のとおりです。 はじめに 1章 オプションのノーマライズ 2章 オプションよりレンダー 3章 レンダラーによるレンダー 4章 オプションよりテンプレートパスを見つける まとめ はじめに Railsアプリケーションでコントローラアクションにリクエストがあった時、Railsがどのようにレンダーするテンプレートを見つけているか疑問に思ったことはありませんか？例えばArticlesControllerのindexアクションにリクエストがあった時、通常テンプレ
奇術の日なので、ScrollMagicとかJavaScriptのスクロール連動ライブラリについて調べてみました - Qiita
MITライセンス | Wikipedia GPL（GNU GPL v3）ライセンス | Wikipedia ここで言う「スクロール連動」とは、閲覧者のページ上のでのスクロール（量）を検知し、特定の量やビューポート（ブラウザの表示領域）内に特定の要素が検知されたときに、特定のイベントや演出が展開されるコンテンツ。としています。 ScrollReveal ScrollReveal は、他の類似ライブラリに比べてスター数も多く、頻繁にアップデートも行われているようで、2018年12月現在のバージョンは4.0.5。非商用はGNU GPL v3。商用ライセンスも用意されています。 アニメーションなど演出処理もjsに含まれた演出一体型ライブラリで、別途cssを読み込む必要はないので、手軽に使用できるのがメリット。他のライブラリと同様に、スクロール・要素検知イベントが用意されているので、イベント発火時に
jQueryを使わないスワイプ対応のjavascriptスライダーSwiper の使い方 - Qiita
jQueryを使っていないのでフリクションしにくいのも利点。入れ子でスライダーが組めるところが便利です。 【使い方（Usage）】 GitHubから最新バージョンのSwiperをダウンロードする。 Swiper 下記をHTMLに記載 <head> .... <link rel="stylesheet" href="cssまでのパス/idangerous.swiper.css"> <script defer src="JAVASCRIPTまでのパス/idangerous.swiper-2.x.min.js"></script> .... </head> <body> <div class="swiper-container"> <div class="swiper-wrapper"> <!--First Slide--> <div class="swiper-slide"> <!-- ここに
WordPress ブロックエディター(Gutenberg)カスタマイズあれこれ - Qiita
WordPress 5.0から導入されたブロックエディター(Gutenberg)のカスタマイズ方法や、関連するオプション、新しく導入された設定について見ていきます。オフィシャルの テーマサポート の内容をベースに、独自の情報を追加しています。 更新履歴 2021/06/11 - ブロックフォントサイズの shortName が無くなったので削除。ブロックパターンの削除、カスタム単位、カスタム行間について追加。 2021/01/10 - グラデーション設定を追加。 2020/06/19 - 投稿タイプ別に使えるブロックを制限する方法を追加。 2020/05/24 - ブロックスタイルの削除について追加。 2020/04/22 - 後方互換性についての注意を追加。ダークモードの記載追加。 2020/02/20 - Gutenberg 7.5 でインラインの文字色編集が追加されたので記載。 20
jQueryとCSSでシンプルなタブ切り替え - Qiita
<div class="ChangeElem_Btn_Content"> <button class="ChangeElem_Btn">1番目のタブ</button> <button class="ChangeElem_Btn">2番目のタブ</button> <button class="ChangeElem_Btn">3番目のタブ</button> </div> <ul> <li class="ChangeElem_Panel">1番目のコンテンツ</li> <li class="ChangeElem_Panel">2番目のコンテンツ</li> <li class="ChangeElem_Panel">3番目のコンテンツ3</li> </ul> [補足] ・タブに class="ChangeElem_Btn" を、中身に ' class="ChangeElem_Panel" を付与しま
Macでスクリーンショットを撮る方法と保存先＆形式を変える方法 - Qiita
Macでスクショ撮るショートカットキーと、通常デスクトップにpng形式で保存されるものを後から変更する手順を探したので、両方をまとめてシェア。 Mac OS X でのスクリーンショット取得するためのショートカットキー 画面全体： Command + Shift + 3 マウス選択の範囲： Command + Shit + 4 マウスカーソルの形状が変わるのでキャプチャしたい範囲をドラッグで決めます。 ESCでキャンセル。 選択したウィンドウ： Commadn + Shift + 4 + スペース ==> 対象ウィンドウをクリック マウスカーソルがある場所のウインドウのみをキャプチャできます。 スペースキーを押すとキャプチャ対象のウィンドウがグレーアウトされ、アイコンがカメラマークに変わるのでそこで左クリックするとキャプチャされます。 (2017.02.24追記）保存せずクリップボードコピー
jQueryにおけるレガシー・冗長な書き方を一掃したい - Qiita
はじめに jQuery 3.0になってから結構経ちましたが、そろそろ旧バージョン時代の書き方をなくしていかなければならないはず。 ついでに、冗長な書き方も一掃したい。 レガシー？な書き方たち 一応互換性を考えて残っているものも多いですが、そろそろこの書き方もなくしていきましょう。 $(document).ready(function () {}) DOM構築が完了した後に実行する、jQueryを使うにあたって結構重要なやつですね。 こんなに無駄な書き方しないで素直に $(function () {}) と書きましょう。
[Boxy] SublimeText3 2016年 俺的一押し おすすめ テーマの紹介・設定をさらす - Qiita
対象 SublimetText3を常用している方 テーマデザインの細かい調整をしたい方（細かい方こだわりがある方 気分によってサクッと見た目を変えたい方 jsonファイルでの設定に嫌気がさしている方 簡単に細かい見た目の調整をしたい方 また前提として、Package Controlのインストールは済んでいるものとします。 Boxy Theme Githubより以下、引用 The most hackable theme for Sublime Text 3 The most hackableと...この言葉どおりのテーマだと思います。 2016/3にPacakage Controlに公開され、現在までGithubも活発に動いています。 また、動画による説明やGithubのwikiがとても充実しているのが素敵です。 ですが、wikiを読まなくても、各種設定を直観的に可能なのが、Boxy The
![[Boxy] SublimeText3 2016年 俺的一押し おすすめ テーマの紹介・設定をさらす - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/7bcffa5c769d9a5e9b7d1c783e82fbe076938069/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCQm94eSU1RCUyMFN1YmxpbWVUZXh0MyUyMDIwMTYlRTUlQjklQjQlMjAlRTQlQkYlQkElRTclOUElODQlRTQlQjglODAlRTYlOEElQkMlRTMlODElOTclMjAlRTMlODElOEElRTMlODElOTklRTMlODElOTklRTMlODIlODElMjAlRTMlODMlODYlRTMlODMlQkMlRTMlODMlOUUlRTMlODElQUUlRTclQjQlQjklRTQlQkIlOEIlRTMlODMlQkIlRTglQTglQUQlRTUlQUUlOUElRTMlODIlOTIlRTMlODElOTUlRTMlODIlODklRTMlODElOTkmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZzPTI4YjE5OGNlMGU2NGUwYzNlMjZhZTlmN2Y2ZThhZjI1%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB0dXRpZGEmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWViODRkZmMyODZjN2FjMjlhNmQ2ZjU3OGNmMTU5YmMx%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4g5qCq5byP5Lya56S-RnVzaWM%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%2523212121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3Dda3efc8389c77a5a2bc4055c70ded6c9)
sublimeプロジェクトの管理しよう - Qiita
{ "folders": [ { "path": "/path/to/project/report5" }, { "path": "/path/to/project/report4" } ] } これに追加するとそのプロジェクトだけ有効になります。便利ですね！ 以下のものが設定できます。 folders path フォルダーへのパス。必須 name サイドバーでの表示名 file_exclude_patterns 非表示にするファイル名のパターン folder_exclude_patterns 非表示にするディレクトリ名のパターン file_include_patterns 表示にするファイル名のパターン folder_include_patterns 表示にするディレクトリ名のパターン setting PreferencesのUser settingsを上書きすることが出来る。 buil
Magento1テーマ開発の勘所12点 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? この記事はMagento Advent Calendar 2015の二日目です。 ←「Magento Advent Calendar 2015」1日目「Magentoでアクセス集中を乗り切るには〜前編〜」 「Magento Advent Calendar 2015」3日目「Magento1.x開発環境をOS Xに構築する」→ 新兵＠Magento日本コミュニティの@kzkiq2ndです。 2015年11月18日に新バージョンMagento2がリリースされましたが、まだまだ現役なのがMagento1。そこで、僕がMagento1テーマ開発
HTML5 Canvas 入門 - Qiita
今更ながら、Canvas をまともに勉強したことがなかったので、一からやってみました。 これまでの人生、 JavaScript は初心者の超えるべき壁をすっ飛ばして学んできたので、おさらいも兼ねて。 キャンバス上でクリックすると、その座標で図形を描画できるようになるチュートリアルです。 コードだけ見たい方はこちらを。 https://github.com/kyrieleison/canvas-tutorial/blob/master/index.html キャンバスを準備する <!DOCTYPE html> <html> <head> <title>canvas tutorial</title> <style> #canvas { background: #666; } </style> </head> <body> <canvas id="canvas" width="640" heig
レスポンシブなHTMLメールをつくる - Qiita
仕事でHTMLメールを作る機会があったんですが、メーラーは種類が多く、各メーラーによって実装状況にかなり差があるので、多くのユーザー環境で正しく表示されるHTMLメールを作ろうと思うとなかなか面倒でした。 しかもレスポンシブとなると、通常のwebページでいうクロスブラウザ対応の比ではないほど気を使うことに。。 なので、やったことをここにメモしておきます。 後々、会社のブログで記事にするつもりだけど。 基本的なつくりかた レスポンシブという言葉の響きで、なんかモダンな作りができそうだなーと思ってしまうけど、結局は下記のような昔ながらの作り方をしなくちゃいけないです。 tableレイアウトでコーディング。 これでやらないとOutlookでまともに表示できない。 インラインスタイルでCSSを記述。 <style>タグに対応していないメーラーが多いため。 また、前述のとおり各メーラーで動作に差異が
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTMLの略語を調べてみた - Qiita
Sublime Text 3のインデント設定を変更する - Qiita
-webkit-overflow-scrollingを指定するときについでにやっておいた方がいいこと - Qiita
CSSだけでアコーディオンを実装 - Qiita
