Changed command explanations carefully

Kaneko Yuto · Kaneko Yuto · commit c51e27c5bb47 · 2023-07-19T16:03:56.000+09:00
diff --git a/README.md b/README.md
@@ -69,8 +69,7 @@ npx qiita init
 
 以下の流れでトークンを発行してください。
 
-- https://qiita.com/settings/applications へログインした状態でアクセスします。
-- `設定 > アプリーケーション > 個人用アクセストークン` からトークンを発行します。
+- [https://qiita.com/settings/tokens/new](https://qiita.com/settings/tokens/new?read_qiita=1&write_qiita=1&description=qiita-cli) へログインした状態でアクセスします。
   - トークンの権限には「read_qiita」と「write_qiita」を設定します。
 
 発行したトークンは`Qiita CLIのログイン`、`GitHubで記事を管理する`で利用します。
@@ -84,7 +83,7 @@ npx qiita login
 ```
 
 ```console
-Enter your token: トークンを入力しEnterキーを押す
+発行したトークンを入力: トークンを入力しEnterキーを押す
 Hi ユーザー名!
 ```
 
diff --git a/src/commands/init.ts b/src/commands/init.ts
@@ -2,14 +2,7 @@ import fs from "node:fs";
 import path from "node:path";
 import { config } from "../lib/config";
 
-export const init = async () => {
-  const rootDir = process.cwd();
-  const workflowsDirectoryPath = path.join(rootDir, ".github/workflows");
-  const publishWorkflowFilePath = path.join(
-    workflowsDirectoryPath,
-    "publish.yml"
-  );
-  const publishWorkflowFileContent = `# Please set 'QIITA_TOKEN' secret to your repository
+const publishWorkflowFileContent = `# Please set 'QIITA_TOKEN' secret to your repository
 name: Publish articles
 
 on:
@@ -39,15 +32,25 @@ jobs:
           qiita-token: \${{ secrets.QIITA_TOKEN }}
 `;
 
+const rootDir = process.cwd();
+const workflowsDirectoryPath = path.join(rootDir, ".github/workflows");
+const publishWorkflowFilePath = path.join(
+  workflowsDirectoryPath,
+  "publish.yml"
+);
+
+const gitignoreFilePath = path.join(rootDir, ".gitignore");
+const gitignoreFileContent = `.remote
+node_modules
+`;
+
+export const init = async () => {
+  console.log("設定ファイルを生成します。\n");
+
   if (!fs.existsSync(workflowsDirectoryPath)) {
     fs.mkdirSync(workflowsDirectoryPath, { recursive: true });
   }
   writeFile(publishWorkflowFilePath, publishWorkflowFileContent);
-
-  const gitignoreFilePath = path.join(rootDir, ".gitignore");
-  const gitignoreFileContent = `.remote
-node_modules
-`;
   writeFile(gitignoreFilePath, gitignoreFileContent);
 
   const userConfigFilePath = config.getUserConfigFilePath();
@@ -61,15 +64,32 @@ node_modules
     2
   );
   writeFile(userConfigFilePath, userConfigFileContent);
+
+  await printNextSteps();
 };
 
 const writeFile = (path: string, content: string) => {
+  console.log(`  Creating ${path}`);
   if (!fs.existsSync(path)) {
     fs.writeFile(path, content, { encoding: "utf8" }, (err) => {
       if (err) throw err;
-      console.log(`Create ${path}`);
     });
+    console.log(`     Created!\n`);
   } else {
-    console.log(`${path} is already exist`);
+    console.log(`     Already exists.\n`);
   }
 };
+
+const printNextSteps = async () => {
+  const chalk = (await import("chalk")).default;
+  console.log(`Success! ✨
+
+次のステップ:
+
+  1. トークンを作成してログインをしてください。
+    ${chalk.bold("npx qiita login")}
+
+  2. 記事のプレビューができるようになります。
+    ${chalk.bold("npx qiita preview")}
+  `);
+};
diff --git a/src/commands/login.ts b/src/commands/login.ts
@@ -13,7 +13,14 @@ export const login = async (argv: string[]) => {
     output: process.stdout,
   });
 
-  const token = await rl.question("Enter your token: ");
+  const chalk = (await import("chalk")).default;
+  console.log(`
+以下のURLにアクセスしてトークンを発行してください。（「read_qiita」と「write_qiita」にチェックを入れてください）
+  ${chalk.bold(
+    "https://qiita.com/settings/tokens/new?read_qiita=1&write_qiita=1&description=qiita-cli"
+  )}
+  `);
+  const token = await rl.question("発行したトークンを入力: ");
   rl.close();
 
   const qiitaApi = await getQiitaApiInstance({ token });
@@ -24,5 +31,26 @@ export const login = async (argv: string[]) => {
     accessToken: token,
   });
 
-  console.log(`Hi ${currentUser.id}!`);
+  console.log(`Hi ${currentUser.id}!\n`);
+
+  await printAvailableCommands();
+};
+
+const printAvailableCommands = async () => {
+  const chalk = (await import("chalk")).default;
+  console.log(`ログインが完了しました 🎉
+以下のコマンドを使って執筆を始めましょう！
+
+🚀 コンテンツをブラウザでプレビューする
+  ${chalk.bold("npx qiita preview")}
+
+🚀 新しい記事を追加する
+  ${chalk.bold("npx qiita new (記事のファイルのベース名)")}
+
+🚀 記事を投稿、更新する
+  ${chalk.bold("npx qiita publish (記事のファイルのベース名)")}
+
+💁 コマンドのヘルプを確認する
+  ${chalk.bold("npx qiita help")}
+  `);
 };
