Corredor

ウェブ、プログラミングの勉強メモ。

独自ドメインを無料で取得できる Freenom を使ってみた

Freenom というサービスが、無料で取得できる独自ドメインを5種類提供していたので、試しに取ってみた。

取得できる無料ドメインは、.cf.ga.gq.ml.tk の5種類。

ドメイン (Wikipedia)
.cf 中央アフリカ
.ga ガボン共和国
.gq 赤道ギニア共和国
.ml マリ共和国
.tk トケラウ

なかなかに「どこ」感。

画面は英語だが、流れに沿ってすぐ登録できた。登録時にも転送先 URL を設定するのだが、登録後に改めて設定変更しないと上手く反映されなかった。

  • サイトのメニューから「Services」→「My Domains」を選択する
  • 取得したドメイン一覧が出るので「Manage Domain」ボタンで遷移する
  • 「Management Tools」タブ →「URL Forwarding」を選択する
  • 「URL Forwarding」欄に転送先 URL を入れ、「Forward mode」は「Redirect (HTTP 301 forwarding)」を選択する

今回は単にリダイレクトするだけの超シンプル設定。設定変更後、5〜10分くらいで反映された。

.tk ドメインについては、90日間で25アクセスないと登録が抹消されてしまう、という情報が複数見つかったので注意が必要。無料ドメインの更新は1年単位で、期限日の10日前ぐらいから更新作業ができるらしい。

自分は neos21 始まりで5種類のドメインを取った。

に、それぞれリダイレクトする。覚えづらいかもしれないですが、サクッとアクセスしたいサイトがあれば覚えてください。Bit-Archer は今回ハミりです。

Freenom というサイトはそれなりに知名度があるらしく、日本語で解説したサイトも沢山あるので安心。今回はやらなかったが、DNS の設定も出来るみたいなので、ちゃんと使いたい人は設定してみると良いかも。

「Web 版 VSCode」な StackBlitz が超優秀だった

StackBlitz という Web サービスを発見した。「Web ブラウザ上で動作する VSCode」といったところで、Angular や React などのプロジェクトを作成してその場で動作させられる Playground だ。

何が凄いかというと、

ってなところ。

プロジェクトはバンバン Fork できちゃうし、無料でユーザ登録すらしなくて使えちゃうし、容量とか大丈夫なんか?これ…。とか思っちゃう。w

ちょっとしたデモを共有したい時に、相手の環境を選ばず共有できるのでオススメ。

はじめてのVisual Studio Code (I・O BOOKS)

はじめてのVisual Studio Code (I・O BOOKS)

Xcode 10 以降で Cordova ビルドが失敗するようになったのを直す方法

Xcode 10 から、新しいビルドの方式が標準採用になり、現時点ではまだ Cordova (cordova-ios) がそちらのビルドシステムに対応していない様子。

Cordova ビルドコマンドに --buildFlag="-UseModernBuildSystem=0" を渡すと、旧ビルドシステムを利用してビルドできるようになるのだが、プロビジョニングプロファイルを端末に自動インストールしてくれなくて困っていた。

# 一旦コレでしのげるが…
$ cordova build ios --buildFlag="-UseModernBuildSystem=0"
$ cordova run ios --buildFlag="-UseModernBuildSystem=0"
  • Xcode メニューの Window → Devices and Simulators → (デバイスで右クリック) → Show Provisioning Profiles... から手動でプロビジョニングプロファイルを選択して追加すれば回避できたが、面倒臭い。

そこでもう少し調べてみると、Xcode 上で設定変更をすれば、このオプション引数を指定することなく、以前の挙動に戻せるようだ。

対象の症例としては、Xcode 上で実機向けにビルドした時に以下のようなメッセージが出る場合。

The executable was signed with invalid entitlements.

The entitlements specified in your application's Code Signing Entitlements file are invalid, not permitted, or do not match those specified in your provisioning profile. (0xE8008016).

設定変更の方法だが、

  1. Xcode メニューの File → Project Settings に進み
  2. 「Build System:」を「New Build System (Default)」から「Legacy Build System」に変える

ことで、旧ビルドシステムを選択し、プロビジョニングプロファイルの自動インストールもできるようになった。

とりまこんな感じ。

詳細! Swift iPhoneアプリ開発入門ノート iOS12 + Xcode 10対応

詳細! Swift iPhoneアプリ開発入門ノート iOS12 + Xcode 10対応

Angular のルーティング定義を全て取得してパスの存在チェックをしてみる

Angular アプリを作っていて、ルーティング定義をまとめて知りたくなったので、調べ方を調べた。

@angular/router が提供する Router クラスより、config を参照すれば、全てのルーティング定義が見られることが分かったので、ココから path 情報を取得すれば、アプリ内の全ルーティング ≒ 全ページの URL が調べられる。

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  /**
   * コンストラクタ
   * 
   * @param router Router
   */
  constructor(private router: Router) { }
  
  /** 初期表示時の処理 */
  public ngOnInit(): void {
    // 全パスを取得する : ルートを指定するため router.config に '/' を指定する
    const paths: string[] = this.getRoutes(this.router.config, '/');
    // コンソール出力する
    console.log(paths);
  }
  
  /**
   * ルーティング定義からパスを取得する
   * 
   * @param routes ルーティング定義の配列
   * @param parentPath 第1引数 routes までのパス
   * @return ルーティングのパスの配列
   */
  public getRoutes(routes: any[], parentPath: string): string[] {
    const paths = [];
    
    routes.forEach((route) => {
      const path = `${parentPath}${route.path}/`;
      
      // 子のルーティング定義があれば再帰呼び出しして分割代入する
      if(route.children) {
        paths.push(...this.outputRoute(route.children, path));
      }
      
      // 空文字のパスは大抵 redirectTo を設定しているモノなので無視する
      if(route.path === '') {
        return;
      }
      
      // console.log(path);
      paths.push(path);
    });
    
    return paths;
  }
}

拙作の Angular Utilities からルーティング定義を引っ張り出してみたところ、以下のようになった。

0: "/index/"
1: "/font-family-tester/"
2: "/csv-file-to-table/"
3: "/touch-friendly-dnd/"
4: "/multiple-diff/"
5: "/text-converter/add-line-number/"
6: "/text-converter/case-converter/"
7: "/text-converter/normalize-to-nfc/"
8: "/text-converter/"
9: "/dynamic-generate-form/"
10: "/calculator/"
11: "/beautifier/javascript/"
12: "/beautifier/html/"
13: "/beautifier/css/"
14: "/beautifier/"
15: "/regexp/"
16: "/colour-converter/colour-converter/"
17: "/colour-converter/"
18: "/epoch-time-converter/"
19: "/encoder-decoder/"
20: "/detect-character/"
21: "/date-time-countdown/"
22: "/draw-triangle-svg/"
23: "/guitar-scale-generator/"

コレで求めていたモノは拾えた。

パスの存在チェックとかがしたければ、この配列から filter() とかすれば良いだろう。

Angularデベロッパーズガイド 高速かつ堅牢に動作するフロントエンドフレームワーク

Angularデベロッパーズガイド 高速かつ堅牢に動作するフロントエンドフレームワーク

  • 作者: 宇野陽太,奥野賢太郎,金井健一,林優一,吉田徹生,稲富駿,丸山弘詩
  • 出版社/メーカー: インプレス
  • 発売日: 2017/12/15
  • メディア: 単行本(ソフトカバー)
  • この商品を含むブログを見る

AngularによるモダンWeb開発 実践編~実際の開発で必要な知識を凝縮~

AngularによるモダンWeb開発 実践編~実際の開発で必要な知識を凝縮~