応用情報に合格したあと、どうしても作りたかった「過去問演習サイト」をHTML＋JavaScriptで自作した話 - Qiita
応用情報に合格したあと、どうしても作りたかった「過去問演習サイト」をHTML＋JavaScriptで自作した話 はじめに 2024年春、応用情報技術者試験に独学で合格しました。 そのときずっと思っていたのが、 「もっとサクッとスマホで過去問を解けるサイトがあったらよかったのに…」 ということ。 そこで合格後、「過去の自分がほしかったもの」を形にするべく、 資格試験の過去問演習サイトを自作しました。 👇 サイトはこちら 📎 https://ap-shiken-navi.jp/ サイトの概要 応用情報技術者試験ナビというサイト名で公開中です。 現在は午前試験の過去問を対象に、以下の年度の問題を掲載しています。 令和6年 春・秋（160問） 令和5年 春・秋（160問） 令和4年 秋（80問） 📱 レスポンシブ対応で、スマホ・タブレット・PCすべてに対応しています。 ▼ トップページ画面イ
【実践解説】Html Css Javascript Projects - Web開発で開発効率を劇的に向上 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 【実践解説】Html Css Javascript Projects - Web開発で開発効率を劇的に向上 🔥 なぜ今このツールが注目されているのか X(Twitter)で335いいね・40リツイートを集め、GitHubでも1700スターを獲得した「solygambas/html-css-javascript-projects」が話題になっています。私も実際に3週間使ってみたところ、作業時間が約35%削減され、驚くほどの効果を実感しました！このツールがなぜ開発者コミュニティで急速に広まっているのか、その理由と活用法を徹底解説します。
HTML / CSS / JavaScript 制作 Tips 番外編 - Qiita
HTML / CSS / JavaScript 制作 Tips 番外編 user: ChatGPT先生、先日はHTML/CSS/JavaScript を用いたWebページ制作の初級編・中級編・上級編として次の３０項目を教えていただきました。 初級編のTips 10個： HTMLタグは必ず閉じるように心掛けてや。メンドクサイけんど、閉じ忘れが原因でエラー起こることもあるんじゃ。 CSSは外部ファイルで管理する方が整理整頓やし、保守や改修も楽よ。ほなら、あんたのコードもすっきりと！ やはよう使うけど、セマンティックなタグを使うとSEOにも好影響よ。シンプルでも、意味をもったタグがあるけん、活用しとき。 CSSのセレクタ優先度を理解しとき。この順なら、「ID」「クラス」「タグ」よ。覚えておき。 JavaScriptでDOM要素を扱うときは、getElementByIdやquerySelector
ReactでJavaScriptを使ってWordをHTMLに変換 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Word文書をHTML形式に変換することで、コンテンツクリエイターは、ウェブ展示に適したコンテンツを作成するために、親しみやすいWord文書編集環境を活用できます。また、Word文書の内容をウェブページに埋め込むことで、コンテンツのメンテナンス性と更新効率を向上させることができます。JavaScriptとReactを使用することで、開発者はクライアントブラウザ内で直接Word文書をHTMLに変換する機能を実現でき、開発ワークフローが簡素化され、ロード時間やサーバーコストが削減されます。この記事では、ReactアプリケーションでJavaS
サイト模写を通じたWeb開発学習: CSS, HTML, JavaScriptの活用法 - Qiita
Web開発の基礎技術であるCSS、HTML、JavaScriptを使い、実際に既存のサイトを模写する学習に挑戦しました。この記事では、その学習プロセスを要約し、特にIDやクラスの使用、スタイルの適用、そしてJavaScriptによる動的な機能の追加に焦点を当てています。 HTMLの基礎 HTMLはウェブページの骨組みを構築するための言語です。HTMLを書く際には、<div>、<header>、**<nav>**などのタグを使用して、ページの構造を定義します。模写したサイトでは、ハンバーガーメニューを含むレイアウトが特徴でした。以下はその基本的なHTML構造です。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>サイト名</title> <link rel="stylesheet" href="sty
Converting Plain Text To Encoded HTML With Vanilla JavaScript — Smashing Magazine
What do you do when you need to convert plain text into formatted HTML? Perhaps you reach for Markdown or manually write in the element tags yourself. Or maybe you have one or two of the dozens of online tools that will do it for you. In this tutorial, Alexis Kypridemos picks those tools apart and details the steps for how we can do it ourselves with a little vanilla HTML, CSS, and JavaScript. Whe
2023-09-29のJS: Babel v7.23.0、Vike、State of HTML 2023受付開始
JSer.info #662 - Babel v7.23.0リリースされました。 7.23.0 Released: Decorator Metadata and many new import features! · Babel Stage 3のDecorator Metadataのサポート、Stage 3のimport sourceのサポートが追加されています。 Stage 2のimport deferのサポート、Stage 1のOptional Chaining Assignmentのサポート、TypeScript 5.2のサポートされています。 またBabel 8がαリリースされています。 変更点やアップデート方法については、マイグレーションガイドが公開されています。 Upgrade to Babel 8 · Babel ReactやVueなどに対応したNext.jsやNuxtのよう
これはすごい！ HTMLの新機能、popover属性でポップオーバーがJavaScript無しで簡単に実装できるようになります
先日リリースされたChrome 114でPopover APIがサポートされ、HTMLのpopover属性が使用できるようになりました。 今まではポップオーバーを実装するのにはJavaScriptを使用し、ポップオーバーの開閉・フォーカス・アクセスフックなど面倒でしたが、popover属性で実装すると驚くほど簡単で、さまざまなUIコンポーネントに利用できます。 Introducing the popover API by Una Kravets 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに HTMLのpopover属性とは ポップオーバーのデフォルト、オーバーライド 自動ポップオーバーと手動ポップオーバー popover属性とdialog要素の違い 近日公開予定の便利な2つの機
ターボワープを使用してhtml&javascriptで作ったアプリをexe化する - Qiita
exe形式の実行ファイルをturbowarpを使って作ってみた。(初記事) どうもこんにちは、最近あだ名メーカー使ったら「国士無双のカリスマ店員」て出てきた人です。 今回は、最近ターボワープを使ってプロジェクトをexe化していた時に気付いたことを実験し、記事にしました。 さて、本編へ行きたいと思います。 ちなみに今回は、html&javascriptで作ったアプリケーションをexe化していきます。 方法 1,ターボワープを開きeditorを起動します。 2,最初からあるスプライトを消してから、パッケージ化を選択します 3,パッケージ化画面に来たら、アプリの名前を入力します 4,「大きな緑の旗を表示せずに自動でプロジェクトを始める」のチェックボックスにチェックを押します 5,「Electron Windowsのアプリケーション(32bitまたは64bit)」にチェックをいれて、パッケージ化を
HTMLを最初に、JavaScriptを最後に：Webを高速化する秘訣 | POSTD
すべてのフレームワークはステートを保持する必要があります。フレームワークはテンプレートを実行することでステートを構築します。ほとんどのフレームワークは、このステートをリファレンスやクロージャとしてJavaScriptヒープに保持します。Qwikのユニークな点は、ステートが属性としてDOMに保持されることです（リファレンスもクロージャもシリアライズして送受信するのは不可能ですが、文字列であるDOM属性なら可能です。これがresumability(再開性）のカギとなります）。 DOMにステートを保持することには、以下のように多くのユニークなメリットがあります。 DOMはシリアライズの形式としてHTMLを使用します。ステートを文字列属性としてDOMに保持することで、アプリケーションをいつでもHTMLにシリアライズできます。HTMLを送信し、別のクライアントでDOMにデシリアライズすることが可能に
CodePenやJSFiddleにインスパイアされたHTML/CSS/JavaScriptのコードを実行できるOSSデスクトップアプリ・「Code Box」 - かちびと.net
Code BoxはJSFiddleにインスパイアされたHTML/CSS/JavaScriptのコードを実行できるOSSデスクトップアプリです。 Electronで作られておりWindows、Mac、Linuxなどの各OSで動作します。VS Codeと同じエディタを採用しており、オートコンプリート機能も搭載、ホットリロード機能もあるのでコードを書いてればそのまま更新されていきます。 embedできる、シェアできる点がCodePenやJSFiddleの魅力だと個人的には思うので実行環境が欲しいなら動作も軽量ですし、この手のオフラインアプリが一番捗りそうですね。ライセンスはMITだそうです。 Code Box
フロントエンドエンジニアの皆さん、フルスタック目指しませんか？飲食スタートアップがエンジニア大募集！
フロントエンドエンジニアの皆さん、フルスタック目指しませんか？飲食スタートアップがエンジニア大募集！ 株式会社トレタ @toreta フロントエンド Startup TypeScript I want to hear a detailed フロントエンドをやりたい人、フロントエンド開発全般に興味のある人、トレタでチャレンジしてみませんか？ 株式会社トレタは、飲食店向けの予約サービスを展開しており、業界ではNo.1シェアを獲得しているスタートアップです。弊社は現在、フロントエンドエンジニアの募集を行っています。 モダンなWebサービス開発に特化した体制へ 弊社は長らく、Ruby on Railsによるサービス開発を行ってきました。しかしWeb APIベースのモダンなWebサービス開発が一般的になった昨今では、 Ruby on Railsだと色々と余計な手続きも多いと感じるようになってきました
HTMLやCSSやJavaScriptなどのコードをかっこよく魅せるために使用できる無料ツールのまとめ
HTMLやCSSやJavaScriptなどのコードをかっこよく魅力的に見せるために使用できるツールを紹介します。 プレゼンなどでコードを人に見せる時をはじめ、TwitterやFacebookやInstagram用にコードの画像を最適化して見せることもできます。 6 Awesome Ways To Present Your Code 🔥 by Niharika Singh ⛓ 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに Carbon Codeimg.io Pastie Rust Playground Silicon Polacode はじめに Web制作者はいつか、コードを発表する時がくるかもしれません。プレゼン、ツイート、ブログ、あるいはスニペットを人に見せる時です。 あなたのコードを素敵に見せるために使用できる
Markdownベースのプレゼンテーション・エディタ「Slideas for Mac」が、次期アップデートで「reveal.js」フレームワークをサポートしHTML形式での書き出しが可能に。
Markdownベースのプレゼンテーション・エディタ「Slideas for Mac」が、次期アップデートでプレゼンテーション・フレームワーク「reveal.js」のテーマと、HTMLエクスポートをサポートするそうです。詳細は以下から。 SlideasはフランスのAgaric Perdereauさんが開発しているMac用のプレゼンテーション・エディタで、Markdown記法でプレゼンテーションを作成できますが、このSlideasが次期v1.2アップデートでHTMLプレゼンテーション・フレームワーク「reveal.js」をサポートするそうです。 I also had multiple requests for a simple Slide Template. I then decided to port some of the Reveal.js themes to Slideas.[…]T
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptで「HTMLファイルに直接JavaScriptのコードを記述する」の動作を確認してみた。 - Qiita
Calling LLMs from client-side JavaScript, converting PDFs to HTML + weeknotes
「HTMLのスーパーセット」Svelteはこんなに進化している — TechFeed Experts Night#27 〜 フロントエンドフレームワーク最前線
フロントエンドの知識地図—— 一冊でHTML/CSS/JavaScriptの開発技術が学べる本:書籍案内|技術評論社 - Realtime JSer.info
オープンソースの開発に携われるエンジニアを大募集！
How to Create Bank Landing Page HTML CSS JavaScript
