Vasanth Srivatsa Profile picture
Apr 26, 2021 β€’ 10 tweets β€’ 6 min read β€’ Read on X
Here's an marvelous 🧡 thread on ⧩

Beginners πŸ“– Guide To ✨ Publishing JavaScript Projects 🍟 On @npmjs

#100DaysOfCode #JavaScript #TypeScript #CodeNewbie

Continue reading πŸ‘‡ Image
ᐉ Deciding Package Name

Finding the right name for your project plays a key role in making it discoverable

It should be πŸ‘‡

πŸ”Ή Available on GitHub & NPM
πŸ”Έ Short and rememberable
πŸ”Ή Relevant to the purpose

For the purpose of this thread, I am using a random word "integrated" Image
ᐉ Creating package.json

Create a new directory and run "npm init -y" in it. This will create a basic package.json file.

Open this file in your favorite code editor and fill in the license, description, and author fields.

πŸ‘‡ Image
ᐉ During Development

While you're working on making your project come to life, keep the version to 0.x.x.

This will πŸ‘‡

πŸ”Ή Indicate that it's in development
πŸ”Έ Lets you push breaking changes Image
ᐉ Writing Code

You can make a cli app or, a library that runs in the browser or Node.js.

For example, I'll make an app.js and module.export a simple console.log.

Whatever you export from this app.js (or so-called entryfile) will be accessible to users of your library.

πŸ‘‡ Image
ᐉ Setting Project Type

We need to tell npm where is code for our project.

To do that πŸ‘‡

πŸ”Ή Open package.json
πŸ”Έ For lib, add a key "main" and set it to the path of entryfile
πŸ”Ή For cli, add a key "bin" and set it to the path of executable
πŸ”Έ Adding both is also supported

πŸ‘‡ Image
ᐉ Login To npmjs

It's time that we publish our project to @npmjs πŸ™Œ

Run "npm login" and put in your username, password, and public email address.

This will link npm cli with your npmjs account.

If you don't have an account, creating one is pretty easy!

πŸ‘‡ Image
ᐉ First Publish

Let's do it! 🀘 Run the command "npm publish".

This will publish your JavaScript project to npm.

Now anyone can use your project by running πŸ‘‡
npm install <project_name>

You'll also get a lovely πŸ’– email from npm that it's published.

πŸ‘‡ ImageImage
ᐉ Adding Keywords

Once your project is πŸ₯³ published. Time to spread the word about your project!

Re-open package.json & fill the keywords from similar packages. That will get let your project come on searches πŸš€

Keywords show during searches & on your package page on npm

πŸ‘‡ ImageImage
Special ✨ thanks to @AyushCodes for giving me the idea πŸ’‘

Thank you so much! πŸ™ for reading. If you can follow me, and retweet πŸ”„ this thread to your developer gang, it would be impressive 🀩

πŸ‘‡ Image

β€’ β€’ β€’

Missing some Tweet in this thread? You can try to force a refresh
γ€€

Keep Current with Vasanth Srivatsa

Vasanth Srivatsa Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @vsnthdev

Oct 8, 2021
Beginners Guide To Domain Name System | DNS Explained

#100DaysOfCode #WebDev @Cloudflare

🧡 πŸ‘‡
ᐉ What is DNS?

DNS or Domain Name System is a service that takes an IP address like 76.​76.​21.​21 and converts it into a human readable address like vercel.​com

Servers around the world offer a database from where we can fetch DNS records
The server that declares & controls a DNS record is called a nameserver, while other servers sync from it

There are different types of DNS records for different purposes. Let's look at each type of record and what it does
Read 12 tweets
Jan 3, 2021
Here's an informative 🧡 thread on ⧩

6 Databases For The Frontend

#100DaysOfCode #freeCodeCamp

Continue reading πŸ‘‡
ᐉ PouchDB

PouchDB is a 99% JavaScript database inspired by CouchDB. It enables applications to store data locally while offline, then synchronize it with CouchDB when the application is back online, keeping the user's data in sync.

Link πŸ‘‰ pouchdb.com
ᐉ AlaSQL

Focuses on query execution speed, supports both relational as well as schemaless data, works in Node.js, mobile apps as well as in the browser. Data can also be imported from Excel, IndexedDB, Localstorage, JSON, etc.

Link πŸ‘‰ github.com/agershun/alasql
Read 8 tweets
Nov 29, 2020
Here's a new 🧡 thread on ⧩

10 Google Chrome Extensions Every Developer MUST Have

#100DaysOfCode @googlechrome #Chrome

Continue reading πŸ‘‡
ᐉ Markdown Viewer

An extension that renders Markdown files as GitHub does. Extremely useful when writing readme files, licenses, and other documentation for your project on @GitHub. Other than that, the extension also has multiple themes.

chrome.google.com/webstore/detai…
ᐉ What Font

What Font is an extension that tells you what fonts a web page is being used. Clicking on some text reveals extended information like text color, font-weight, font-variant, along with sample characters in that font.

chrome.google.com/webstore/detai…
Read 11 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(