エゾクラス

Magic xpa以外の問題点や方法などを加筆・修正してきたエゾクラス。
この度、これまで培ってきた技術を無料公開することにしました。
一度パスワードを入力すると、これからの追加される情報もすべて閲覧できます。

内容は主にWeb ClientやRIAで培った Magic以外の知識を公開します。

Magicについてはぜひ「基礎トレーニングコース」へ。

「WebClientは難しそう」から「これだけ資料があるんだからやってみよう」

以下にご入力いただくとメールにてパスワードを送付させていただきます。

    価格:無料になりました!

     

    目次

     

    Vol-1. はじめに

     

    1. HTML

    1-1.  HTML 言語とは... 
    1-2.  [基礎] 仕様・基礎情報  sample_1-1
    1-3.  [基礎] 名称と構造・記述ルール  sample_1-2
    1-4.  [基礎] ネスト・親子関係・階層  sample_1-3~4
    1-5.  [準備] 作業環境の準備・ベースの要素  sample_1-5
    1-6.  [準備] メタデータ・コメントアウト(メモ)  sample_1-7~8
    1-7.  グループ化要素 <header> <article> <section> <footer> <div>  sample_2-1
    1-8.  テキスト系 <h1> <p> <strong> 画像 <img> リンク <a>  sample_2-2
    1-9.  絶対パス・相対パス 
    1-10.  id 属性・class 属性  sample_2-3


    2. CSS

    2-1.  CSS 言語とは... / [基礎] 名称と構造
    2-2.  [基礎] 記述ルール(セレクターの種類と使い分け)  sample_3-4
    2-3.  [基礎] 記述ルール(セレクターの複数指定)と色・コメントアウト  sample_3-5
    2-4.  [準備] 作業環境の準備  sample_4-1
    2-5.  3箇所の異なる記述場所  sample_4-2~3
    2-6.  [基礎] 継承と「親子関係」・優先順位・後勝ち  sample_4-4~6
    2-7.  [プロパティ] width と padding / border / margin   sample_5- 1~2
    2-8.  リセット CSS
    2-9.  レスポンシブ WEB デザインとメディアクエリ


    3. Bootstrap 4

    3-1.  Bootstrap とは... / 導入方法  sample_6-1~2
    3-2.  使用方法と flex レイアウト  sample_6-3
    3-3.  col-XXの使い方と container / row クラス  sample_6-4
    3-4.  「col-XX は、12 分割されたマス」
       12 マスを超えた時・空白を空けたい時  sample_6-4~5

    3-5.  レスポンシブ・メディアクエリ・ブレイクポイント  sample_6-6
    3-6.  その他の便利なクラス


    4. Web Client

    4-1.  Angular とは... 
    4-2.  作業環境の下準備 
    4-3.  Magic xpaとAngularの関連について 
    4-4.  [sample 学習]sample 学習-1 題材・サンプルと全体の流れ 
    4-5.  [sample 学習]sample 学習-2  
    4-6.  吐き出された HTML・NG-BOOTSTRAP の導入 
    4-7.  ルーティングと IE 対応 
    4-8.  コンパイル・Javascript との連携 
    4-9.  最初から明細をオープンした形の作成方法 
    4-10.  Web Client で QR コードからデータを取得 
    4-11.  Web Client で QR コードを生成して画面に出力 
    4-12. Magic 4.71へバージョンアップした場合の変更点
    4-13.  パイプ処理
    4-14.  警告のカスタマイズ

     


    5. Magic xpa

    5-1.  Magic xpaとLINEの連携 
    5-2.  AWS S3との連携


    9. その他の記事

    9-1. Emmet HTML編 
    9-2. Emmet CSS編 
    9-3. VSCode - ユーザースニペット(入力候補・短縮)を設定する


    10. 掲載予定

    10-1.  github連携
    10-2.  markdown記述方法


     

    Vol-1. あとがき