feat: 🎸 Add how-to-use in template and litle changes in badges

Add how-to-use in template, create element with align center in template,
create function to view if badge has selected and removed awesome and open-source badge

package.json

@@ -1,6 +1,6 @@
 {
   "name": "readme-template-generator",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "description": "CLI to help create readme file to document your project",
   "private": false,
   "repository": {

src/commands/readme-template-generator.ts

@@ -42,8 +42,7 @@ const command: GluegunCommand = {
 
     const packageJson = (() => {
       const packageJsonFile = read('package.json')
-      const packageJson = packageJsonFile !== undefined ? JSON.parse(packageJsonFile) : {}
-      return packageJson
+      return packageJsonFile !== undefined ? JSON.parse(packageJsonFile) : {}
     })()
 
     githubRepository.url = await question({
@@ -68,10 +67,14 @@ const command: GluegunCommand = {
       validate: (value: string) => value === '' ? 'Description its necessary' : true
     })
 
-    const badgeChoices = ['Open Source', 'Awesome']
+    const badges: Types.Badges = {
+      toSelect: [],
+      selected: [],
+      exists: (badgeName) => badges.selected.indexOf(badgeName) !== -1
+    }
 
     if (githubRepository.url) {
-      badgeChoices.push(
+      badges.toSelect.push(
         'Language Most Used',
         'Implementations',
         'Gitpod',
@@ -83,33 +86,36 @@ const command: GluegunCommand = {
     }
 
     if (packageJson.name) {
-      badgeChoices.push('NPM Version', 'NPM Monthly Downloads')
+      badges.toSelect.push('NPM Version', 'NPM Monthly Downloads')
     }
 
     const herokuUrl: string = await question({
       message: 'Heroku URL (use empty value to skip):',
-      validate: (value: string) =>
-        isWebUrl(`https://${value}`) || value === ''
-          ? value === '' ? true : !!(badgeChoices.push('Heroku') + 1)
-          : 'Invalid URL',
+      validate: (value: string) => {
+        if (value === '') return true
+        if (!isWebUrl(value)) return 'Invalid URL'
+        badges.toSelect.push('Heroku')
+        return true
+      },
       customReturn: (value: string) => value !== '' ? `https://${value}` : value
     })
 
     const replitUrl: string = await question({
       message: 'Repl.it URL (use empty value to skip):',
-      validate: (value: string) =>
-        isWebUrl(`https://${value}`) || value === ''
-          ? value === '' ? true : !!(badgeChoices.push('Repl.it') + 1)
-          : 'Invalid URL',
-      customReturn: (value: string) =>
-        value !== '' ? `https://${value}.repl.run` : value
+      validate: (value: string) => {
+        if (value === '') return true
+        if (!isWebUrl(value)) return 'Invalid URL'
+        badges.toSelect.push('Repl.it')
+        return true
+      },
+      customReturn: (value: string) => value !== '' ? `https://${value}.repl.run` : value
     })
 
     const logo: string = await question({
       message: 'Logo image URL or path (use empty value to skip):',
       validate: (value: string) => {
         if (value === '') return true
-        if (!isWebUrl(value) && !existingFiles(value).length) return 'Value informed not is URL/Path'
+        if (!isWebUrl(value) && !existingFiles(value).length) return 'Value informed not is URL/Path valid'
         return true
       }
     })
@@ -124,7 +130,7 @@ const command: GluegunCommand = {
         message: 'GIF/image URL or path for screenshots (use empty value to skip):',
         validate: (value: string) => {
           if (value === '') return true
-          if (!isWebUrl(value) && !existingFiles(value).length) return 'Value informed not is URL/Path'
+          if (!isWebUrl(value) && !existingFiles(value).length) return 'Value informed not is URL/Path valid'
           return true
         }
       })
@@ -137,6 +143,18 @@ const command: GluegunCommand = {
       message: 'Write about project (use empty value to skip):'
     })
 
+    const howToUse = await question({
+      type: 'editor',
+      message: 'Inform how to use project:',
+      defaultValue: '#### 💻 Desktop\n\n\n#### 🌐 Online',
+      validate: (value) => {
+        if (value === '#### 💻 Desktop\n\n\n#### 🌐 Online' || value === '') {
+          return 'Information how to use its necessary'
+        }
+        return true
+      }
+    })
+
     const technologies: string[] = []
 
     while (true) {
@@ -178,7 +196,7 @@ const command: GluegunCommand = {
     author.twitter = await question({
       message: 'Author twitter username (use empty value to skip):',
       validate: (value: string) => {
-        if (value !== '') badgeChoices.push('Author Twitter')
+        if (value !== '') badges.toSelect.push('Author Twitter')
         return true
       }
     })
@@ -197,22 +215,20 @@ const command: GluegunCommand = {
 
     if (author.name || author.website || author.twitter || author.github || author.linkedin) author.exists = true
 
-    const useBadges: string[] = await question({
+    badges.selected = await question({
       type: 'checkbox',
       message: 'Select badges for use:',
-      choices: badgeChoices,
+      choices: badges.toSelect,
       customReturn: (value: string[]) =>
         value.map((badge) => badge.toLowerCase().replace(/\s/g, ''))
     })
 
     const license = {
       name: read('LICENSE')?.split('\n')[0]?.toUpperCase()?.replace('LICENSE', '')?.trim() ||
       packageJson?.license,
-      url: githubRepository.url && read('LICENSE') && `https://${githubRepository.url}/blob/master/LICENSE`
+      url: githubRepository.url && read('LICENSE') && `${githubRepository.url}/blob/master/LICENSE`
     }
 
-    console.table(license)
-
     license.name = await question({
       message: `Project license name${!license.name ? ' (use empty value to skip)' : ''}:`,
       defaultValue: license.name
@@ -230,14 +246,15 @@ const command: GluegunCommand = {
       target: 'README.md',
       props: {
         projectName,
-        useBadges,
+        badges,
         githubRepository,
         herokuUrl,
         replitUrl,
         packageJson,
         images,
         description,
         about,
+        howToUse,
         technologies,
         contributeInformation,
         author,

src/templates/README.md.ejs

@@ -1,37 +1,38 @@
-<% if (props.useBadges.indexOf('opensource') !== -1) {%><%= '[![Open Source](https://badges.frapsoft.com/os/v1/open-source.svg?v=103)](https://opensource.org/)' %><% } %> <% if (props.useBadges.indexOf('awesome') !== -1) {%><%= '[![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)' %><% } %>
+<header align="center">
 
-<% if (props.useBadges.indexOf('gitpod') !== -1) {%><%= `[![Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#${props.githubRepository.url})` %><% } %>
+<% if (props.badges.exists('gitpod')) {%><%= `[![Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#${props.githubRepository.url})` %><% } %>
 
-<% if (props.useBadges.indexOf('heroku') !== -1) {%><%= `[![Heroku](https://img.shields.io/badge/CI-%E2%9C%93-green.svg?logo=heroku&colorA=79589f&logoColor=white&style=flat-square)](${props.herokuUrl})` %><% } %> <% if (props.useBadges.indexOf('repl.it') !== -1) {%><%= `[![Repl.it](https://repl.it/badge/github/${props.githubRepository.author}/${props.githubRepository.name})](${props.replitUrl})` %><% } %>
+<% if (props.badges.exists('heroku')) {%><%= `[![Heroku](https://img.shields.io/badge/CI-%E2%9C%93-green.svg?logo=heroku&colorA=79589f&logoColor=white&style=flat-square)](${props.herokuUrl})` %><% } %> <% if (props.badges.exists('repl.it')) {%><%= `[![Repl.it](https://repl.it/badge/github/${props.githubRepository.author}/${props.githubRepository.name})](${props.replitUrl})` %><% } %>
 
-<% if (props.useBadges.indexOf('npmversion') !== -1) {%><%= `[![NPM Version](https://img.shields.io/npm/v/${props.packageJson.name}.svg?style=flat-square)](https://www.npmjs.com/package/${props.packageJson.name})`%><% } %> <% if (props.useBadges.indexOf('npmmonthlydownloads') !== -1) {%><%= `[![NPM Monthly Downloads](https://img.shields.io/npm/dm/${props.packageJson.name}.svg?style=flat-square)](https://npmjs.org/package/${props.packageJson.name})`%><% } %>
+<% if (props.badges.exists('npmversion')) {%><%= `[![NPM Version](https://img.shields.io/npm/v/${props.packageJson.name}.svg?style=flat-square)](https://www.npmjs.com/package/${props.packageJson.name})`%><% } %> <% if (props.badges.exists('npmmonthlydownloads')) {%><%= `[![NPM Monthly Downloads](https://img.shields.io/npm/dm/${props.packageJson.name}.svg?style=flat-square)](https://npmjs.org/package/${props.packageJson.name})`%><% } %>
 
-<% if (props.useBadges.indexOf('license') !== -1) {%><%= `[![License](https://img.shields.io/github/license/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)](LICENSE.md)`%><% } %> <% if (props.useBadges.indexOf('lastcommit') !== -1) {%><%= `[![Last Commit](https://img.shields.io/github/last-commit/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)](${props.githubRepository.url}/commits/)`%><% } %> <% if (props.useBadges.indexOf('languagemostused') !== -1) {%><%= `![Language Most Used](https://img.shields.io/github/languages/top/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)` %><% } %> <% if (props.useBadges.indexOf('implementations') !== -1) {%><%= `[![Implementations](https://img.shields.io/badge/%F0%9F%92%A1-implementations-8C8E93.svg?style=flat-square)](${props.githubRepository.url}/issues)` %><% } %> <%if (props.useBadges.indexOf('repositorysize') !== -1) {%><%= `![Repository Size](https://img.shields.io/github/repo-size/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)`%><% } %>
+<% if (props.badges.exists('license')) {%><%= `[![License](https://img.shields.io/github/license/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)](LICENSE.md)`%><% } %> <% if (props.badges.exists('lastcommit')) {%><%= `[![Last Commit](https://img.shields.io/github/last-commit/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)](${props.githubRepository.url}/commits/)`%><% } %> <% if (props.badges.exists('languagemostused')) {%><%= `![Language Most Used](https://img.shields.io/github/languages/top/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)` %><% } %> <% if (props.badges.exists('implementations')) {%><%= `[![Implementations](https://img.shields.io/badge/%F0%9F%92%A1-implementations-8C8E93.svg?style=flat-square)](${props.githubRepository.url}/issues)` %><% } %> <%if (props.badges.exists('repositorysize')) {%><%= `![Repository Size](https://img.shields.io/github/repo-size/${props.githubRepository.author}/${props.githubRepository.name}?style=flat-square)`%><% } %>
 
-<% if (props.useBadges.indexOf('repositorysocialstatus') !== -1) {%><%= `[![Forks](https://img.shields.io/github/forks/${props.githubRepository.author}/${props.githubRepository.name}?style=social)](${props.githubRepository.url}/network/members) [![Stars](https://img.shields.io/github/stars/${props.githubRepository.author}/${props.githubRepository.name}?style=social)](${props.githubRepository.url}/stargazers) [![Watches](https://img.shields.io/github/watchers/${props.githubRepository.author}/${props.githubRepository.name}?style=social)](${props.githubRepository.url}/watchers)` %><% } %>
+<% if (props.badges.exists('repositorysocialstatus')) {%><%= `[![Forks](https://img.shields.io/github/forks/${props.githubRepository.author}/${props.githubRepository.name}?style=social)](${props.githubRepository.url}/network/members) [![Stars](https://img.shields.io/github/stars/${props.githubRepository.author}/${props.githubRepository.name}?style=social)](${props.githubRepository.url}/stargazers) [![Watches](https://img.shields.io/github/watchers/${props.githubRepository.author}/${props.githubRepository.name}?style=social)](${props.githubRepository.url}/watchers)` %><% } %>
 
-<% if (props.useBadges.indexOf('authortwitter') !== -1) {%><%= `[![Author Twitter](https://img.shields.io/twitter/follow/${props.author.twitter}.svg?style=social)](https://twitter.com/${props.author.twitter})`%><% } %>
+<% if (props.badges.exists('authortwitter')) {%><%= `[![Author Twitter](https://img.shields.io/twitter/follow/${props.author.twitter}.svg?style=social)](https://twitter.com/${props.author.twitter})`%><% } %>
 
-<h1 id="title" align="center">Welcome to <%= props.projectName %> 👋</h1>
+<h1 id="title">Welcome to <%= props.projectName %> 👋</h1>
 
-<% if (props.images.logo) {%><%- `<p align="center">
+<% if (props.images.logo) {%><%- `<p>
 <img src="${props.images.logo}">
 </p>`%><% } %>
 
 <%- `> ${props.description}`%>
+</header>
 
 <% if (props.images.screenshots.length) {%><%- '<details>\n<summary>Screenshots</summary>'%><% } %>
 <%= props.images.screenshots.map(screenshot => `<img src="${screenshot}">`)%>
 <% if (props.images.screenshots.length) {%><%- '</details>'%><% } %>
 
 ### 🔖 Table Of Contents
-<% if (props.about) {%><%= '\n- 📃 [About](#about)'%><% } %><% if (props.technologies.length) {%><%= '\n- 🚀 [Technologies](#technologies)'%><% } %><% if (props.contributeInformation) {%><%= '\n- 💡 [How To Contribute](#contribute)'%><% } %><% if (props.author.exists) {%><%= '\n- 👤 [Author](#author)'%><% } %><% if (props.license.name) {%><%= '\n- 🔏 [License](#license)'%><% } %>
+<% if (props.about) {%><%= '\n- 📃 [About](#about)'%><% } %><% if (props.technologies.length) {%><%= '\n- 🤔 [How To Use](#how-to-use)'%><%= '\n- 🚀 [Technologies](#technologies)'%><% } %><% if (props.contributeInformation) {%><%= '\n- 💡 [How To Contribute](#contribute)'%><% } %><% if (props.author.exists) {%><%= '\n- 👤 [Author](#author)'%><% } %><% if (props.license.name) {%><%= '\n- 🔏 [License](#license)'%><% } %>
 
 ---
 
-<% if (props.about) {%><%- '<h2 id="about">📃 About</h2>\n'%><% } %>
-<% if (props.about) {%><%- props.about%><% } %>
-<% if (props.about) {%><%= '\n\n[Back To The Top](#title)\n\n---\n'%><% } %>
+<% if (props.about) {%><%- `<h2 id="about">📃 About</h2>\n\n${props.about}\n\n[Back To The Top](#title)\n\n---\n`%><% } %>
+
+<%- `<h2 id="how-to-use">🤔 How To Use</h2>\n\n${props.howToUse}\n\n[Back To The Top](#title)\n\n---\n`%>
 
 <% if (props.technologies.length) {%><%- '<h2 id="technologies">🚀 Technologies</h2>\n'%><% } %>
 <% for (tech of props.technologies) {%><%= `\n- ${tech}`%><% } %>
@@ -48,7 +49,7 @@
 \n\n[Back To The Top](#title)\n\n---`%><% } %>
 
 <% if (props.author.exists) {%><%- '<h2 id="author">👤 Author</h2>\n\n'%><% } %>
-<% if (props.author.name) {%><%- `**${props.author.name}**\n`%><% } %>
+<% if (props.author.name) {%><%- `🤓 **${props.author.name}**\n`%><% } %>
 <% if (props.author.website) {%><%= `- Website: [${props.author.website}](${props.author.website})`%><% } %>
 <% if (props.author.twitter) {%><%= `- Twitter: [@${props.author.twitter}](https://twitter.com/${props.author.twitter})`%><% } %>
 <% if (props.author.github) {%><%= `- Github: [@${props.author.github}](https://github.com/${props.author.github})`%><% } %>

src/types.ts

@@ -2,3 +2,9 @@ export type Images = {
   logo: string,
   screenshots: string[]
 }
+
+export type Badges = {
+  toSelect: string[],
+  selected: string[],
+  exists: (badgeName: string) => boolean
+}