GitHub Desktopの基本的な使い方とAdobe Dreamweaverの繋がり

1. GitHubのアカウントを取ろう

まずは公式サイト https://github.com/ にアクセスします。

取得方法はいたって簡単。トップページの右上からサインアップして、登録を完了させます。

ガイドラインをある程度読んでおくことをお勧めします。

こちらに大まかな使い方が掲載されているので、まずはこれに従って使うのが無難だと思います。

世界中のプログラマー、エンジニアが使っているので、お気に入りの人が見つかったらフォローすると楽しみが増えます♬

ちなみに今回は、フォローしてくれたフランス人ジャーナリスト、ベルニーさんの協力もあり、Art Boxをリポジトリに追加できました!

 

2. Adobe Dreamweaverを使ってみよう

タイトルにもありますが、Adobe Dreamweaverで製作するために

サイトをローカルエリアで同期する際、GitHubのアプリがあると、とっても便利です。

DreamweaverはCreative Cloudでアカウントを取得すれば、体験版を無料で7日間使用することができます。

よくできたプリケーションですが、使いこなせるようになるまでにはある程度の期間が必要です。

私も3ヶ月くらいスクールで習ってようやく使えるようになりました。

Dreamweaverで一からサイト製作することもできますし、他のエディターで作ったらフォルダを読み込んで製作することもできます。

本格的なツールで、開発者向けのアプリケーションだとスクールでも教わりました。

その割に、価格はお手頃なのでウェブデザイナーを目指す人にはもってこいだと思われます。

 

使ってみると色々な注意喚起が表示されるので、飛ばさず読み進めないと訳が分からなくなります。

今回は上の写真にある、Gitクライアントを使うのか使わないのかをまず決めて、使うならそれをインストールしてローカルエリアでシステムパスを確認してから、アプリケーションソフトを再起動しなさいと出ました。

 

Gitクライアントを起動する

今回、GitクライアントはGitHubを使っていますが、他にもSourceTree(ソースツリー)などもよく使われているのでおすすめです。

起動する際に、プッシュするリポジトリをローカルリポジトリから選んでくださいと出るので、選びます。

 

User Interface of GitHub Application

 

結果的には、ローカルにあるリポジトリをGitHubを使ってGitHubのリポジトリに移動するという作業です。

リポジトリを作成する際には、パブリックにするか、プライベートにするかが問われるので、決心してから作成しなければなりません。

今回は、プライベートにする必要性を全く感じておらず、むしろフォロワーの事を考えたら、公開すべきだと感じており、リポジトリを作成しました。

プッシュするサイトがないという方も、簡単なテストページを作ってプッシュするといいでしょう。

今回プッシュしたのは前々からやろうと思っていた Art BoxというBootstrapを使ったサイトです。

3. what is Art Box ?

Framework of Art Box 3.6 is public on GitHub now 

フレンチジャーナリストのベルニーさんのブログでも紹介して頂きましたが、彼此3年以上かけて開発した海外のアーティストの作品を紹介しているサイトです。

Bootstrapを使ったシンプルな作りです。(作り方は企業秘密です;)

About Art Box 3.6 : French blogger Bernie made an article ! Please read !http://www.bernieshoot.fr/2018/03/we-are-art-box-by-yukyco.html

 

4. 新規ファイルでコーディングする場合

新しくサイトを作る場合は、ファイルの新規作成から上記のようにコーディングしていきます。

Dreamweaverのすごいところはコードの入力が便利なのはもちろん、プレビュー画面で書いたコードが確認出来て、サイトの初期設定からアップロードまで全部一括してできるところです。

 

今まではアップロードするときは他のソフト、コードを書くときはこっちのソフト・・・と色々なファイルを確認しているうちにどのファイルを編集して、どのファイルをアップロードしたのか、分からくなっていました。

でもこれを使えは、圧倒的にミスが減って、自信も持てるコーディングができるのではないでしょうか。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA