ATOM GIT

テキストエディタ「ATOM」でGithubと連携させる方法

今回は弊社のデザイナーが使用している無料テキストエディタ「ATOM」と
社内でファイルを管理しているツール「Git」との連携方法を説明していこうと思います。


「ATOM」のダウンロード

まずはATOMの公式webサイトからダウンロードしてください。
https://atom.io/


ダウンロードしたAtomSetup-x〇〇.exeというファイルをクリックすると
ATOMのインストーラーが立ち上がりインストールを開始します。


しばらくするとATOMが立ち上がります。


ATOMの日本語化

このままだと英語表記でわかりずらいと思うので日本語化パッケージをいれていきます。


メニューバー「Help」から「WelCome Guide」を選択
「Install a Package」の項目で「Open Installer」をクリック
search packagesと書かれているフォームに「japanese-menu」と入力し「Packages」をクリック
一番上に出てきた「japanese-menu」をインストール


ATOMの日本語化が完了しました。


GitHub でリポジトリを作成する

Githubの公式webサイトにログインし,Your Repositoriesのページで緑色のNEWボタンをクリック
github Your Repositoriesのページ


「Create a new Repository」のページが開くので「Repository name」の欄に新しいRepositoryにつける任意の名前を(ここではatom_git_testにしました)入力し、下部の「create Repository」をクリックすればRepository作成完了です。



出来たレポジトリ画面の緑のcodeボタンにカーソルを合わせるとプルダウンが開きます。その中のアドレスを後程使うので、控えておきます。


ATOMでリポジトリを取得する

作ったレポジトリのクローンを入れる空のフォルダをPCの任意の場所に新規で作成します。
ATOM上部のパッケージの欄からコマンドパレットを開き「github:clone」と入力。
clone fromに先ほど控えてたアドレスをペースト。
To directoryには作った空のフォルダのディレクトリパスを入力


リポジトリの取得完了


AtomからGitHubのリポジトリにPushする(アップロード)

データの変更があるとGitタブのUnstaged Chagesに変更があったファイル名が表示されます
(ここではtest.htmlというファイルを新規作成しました。)


stage Allをクリック


すると変更のあったファイルがStaged Changesの欄に降りてくるので、
Commit messageに作業内容等を入力して青いバーをクリック


最下部の「push」の欄の横に数字が表示されているのを確認出来たらクリック


Githubのページでpushしたファイル名が確認できたら完了


AtomでGitHubのリポジトリからpullする(ダウンロード)

Gitで共有しているファイルを他の人が編集した場合の
ATOMを使ったPull(自分のファイルと同期させる)の方法を説明します。


ATOMのGitタブの最下部にある「Fetch」をクリックして、ファイルの更新があったかを確認します。


更新があった場合、「Fetch」の部分が「Pull」と数字の表記に代わると、更新データがあるということなので
「Pull」をクリックします。


Githubのページでpullしたファイル名が確認できたら完了
(今回はREADME.mdという新しいファイルが確認できました)

関連記事

  • ゴールデンウィーク休業のお知らせゴールデンウィーク休業のお知らせ 平素は格別のご愛顧を賜わり、厚くお礼申しあげます。 さて、誠に勝手ながら弊社では下記の期間を休業とさせていただきます。 期間中はご不便をおかけいたしますが、何卒ご了承くださいますようお願い申し上げます。 休業期間 2018年4月28日(土) – […]
  • 夏季休暇のお知らせ夏季休暇のお知らせ 平素は格別のご愛顧を賜わり、厚くお礼申しあげます。 さて、誠に勝手ながら弊社では下記の期間を夏季休業とさせていただきます。 期間中はご不便をおかけいたしますが、何卒ご了承くださいますようお願い申し上げます。 夏季休業期間 2018年8月11日(土) – […]
  • 夏季休暇のお知らせ夏季休暇のお知らせ 平素は格別のご愛顧を賜わり、厚くお礼申しあげます。 さて、誠に勝手ながら弊社では下記の期間を夏季休業とさせていただきます。 期間中はご不便をおかけいたしますが、何卒ご了承くださいますようお願い申し上げます。 夏季休業期間 2019年8月10日(土) – […]