generator-website-starter

This project is about learning how to build an npm package file using website starter files created in my previous repo and generate it using yeoman tool.

$3

If you want to use this generator, below are the steps.

1. Install yeoman globally if you haven't installed it before
npm install -g yo

2. Install your created generator globally if you haven't installed it before
npm install -g generator-website-starter

3. Install the package file using Yeoman. You can repeat this process if you want to reuse in a new VS Workspsace
yo website-starter

4. Run gulp in your project directory terminal

If error occur its possible that gulp is not installed in your global yet. Below are steps to install

- Run gulp command utility
npm install --global gulp-cli
- Install Gulp in your project directory
npm install --save-dev gulp

> For more details on how the generated files are created, please read this repository

$3

If you want to learn how I created this generator, below are the steps

1. Create a new repository in github

2. Open a blank VS Code Workspace

3. File structure of yeoman generator

``bash
.
├── generator-generator-name # File folder has to start with generator followed by a dash then your generator name
│ │ ├── generators
│ │ │ │ ├── app # Index.js and package files are stored that Yeoman uses to generate
│ │ │ │ │ │ ├── templates # Package files saved in this folder are generated by Yeoman. Copy files in this folder, alternatively, use git submodule add 'link of repository' to load another git repository as a sub folder in the main repository. > Note: If there was a change in original repository, the files in this folder needs to be updated manually
│ │ ├── index.js #
`

> _How to update a git submodule:_ Go back to root generator folder and run this git submodule foreach git pull

4. Install _Yeoman_ in your project folder
npm install --save yeoman-generator

5. In index.js, import yeoman generator and write script files where you need to copy files that are shown in the supposedly generated package file from templates folder. Credits to _Coder Coder_'s for the script.

6. Test the package locally by running this npm link and expect a confirmation message that a package is added.

> Note: Best to test it in a new blank VS Code Workspace by running an npm init then npm install and lastly npm link "name-of-your-generator-folder" and expect to see the package installed.

7. Login to your npm account. Sign up here if you don't have one yet.
> Note: email address used in sign up is public knowledge.

$3

`
npm notice Account creation via legacy auth is unavailable. Please set your auth-type to "web" or visit https://www.npmjs.com/signup to create an account.
npm ERR! code E403
npm ERR! 403 403 Forbidden - PUT https://registry.npmjs.org/-/user/org.couchdb.user:NAME
npm ERR! 403 In most cases, you or one of your dependencies are requesting
npm ERR! 403 a package version that is forbidden by your security policy, or
npm ERR! 403 on a server you do not have access to.

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/NAME/.npm/_logs/2023-04-29T12_54_51_911Z-debug-0.log
`

It somehow resolved by doing the following:

- Added 2FA in my npm account
- Linked my github account in my npm account
- I typed the wrong username

$3

1. Push and commit files to github repository

2. Update yeoman version number in _package.json_
npm version 1.1.1

3. Update npm package files
npm publish`

4. Check udpated files in your npm account

$3

- I learned the tutorial from Coder Coder
- How to NPM Link to a local version of your dependency