Posts

Recently uploaded post

Insta4, React Native Icons

Image
   For developing mobile application like Instagram with react native and typescript,  this writing explains how to use React Native Icons. This article is continued one from previous article. 1. Install and set up for icons Refer to official document for icons:  https://github.com/oblador/react-native-vector-icons/tree/10.x?tab=readme-ov-file Install following packages and link it to CocoaPod. $ cd InstaTest $ npm i react-native-vector-icons $ npm i -D @types/react-native-vector-icons $ cd ios $ npx pod-install $ cd .. If your Metro server is running, you need to escape from it first by ctrl + c. When Metro is running, packages are locked so other package cannot be added. Set up for iOS : Edit the ios/projectName/Info.plist Below <key>UIAppFonts</key> should be added. ios/InstaTest/Info.plist ... < key > UIViewControllerBasedStatusBarAppearance < /key> < false /> < key > UIAppFonts < /key> < ...

How to publish your pakcage

    This writing explains How to publish your own pakcages 1. Make your account and login  Make an account in npm website. ( https://www.npmjs.com/ ) Login to your account with: npm login $ npm login It will redirect to the browser and you can login there. 2. Make your own source code Make your own source code. File name should be same as in the main property of package.json so that npm know this file is the entry point of your package. package.json { "name": "npmtest" , ... "main": "index.js" , ... } index.js module.exports = () => { return 'hello package' ; }; 3. Publish your package You can publish your package with following command. $ npm publish It will show some error because the name npmtest is already being used by others.  $ npm publish ... npm error code E403 npm error 403 403 Forbidden - PUT https://registry.npmjs.org/npmtest - You do not have permission to publish ...

About node package version and npm commands

   This writing explains node package version and some of npm commands. 1. Node package version Node packages always have three-digit versions. The reason for the three-digit version numbering is that it follows the SemVer (Semantic Versioning) version numbering scheme. If the version is 1.3.4, The first digit 1 is major version. If it is 0 it means it is under initial development. From 1 it means official version. A major version is released when the contents of a package have been modified to the point where they are no longer backward compatible. The second digit 3 is minor version. Minor versions are updated when it is backward compatible. The third digit 4 is patch version. A patch version is released when a problem with an existing feature has been fixed rather than when a new feature has been added. If the major version of a package you depend on has been updated, you should be careful as there is a high possibility that it will be incompatible with your exist...

How to manage packages with package.json

Image
  This writing explains how to manage packages with package.json. It includes dependencies between packages, package-lock.json, devDependencies, peerDependencies etc. 1. Dependencies If you install some packages, you will see the name of package will be listed in dependencies in package.json. For example if you install Express; $ npm install express { "name": "npmtest" , ... "license": "ISC" , "dependencies": { "express": "^4.21.2" } } In addition, folder named node_modules is created. There are the installed packages. You clearly only installed Express, but it contains multiple packages. These are the packages that Express depends on. Even a single package depends on many other packages, and those packages depend on yet more packages. This complex dependency relationship is why package.json is needed. 2. Package-lock.json Package-lock.json is also created when you install some packages. In...

Making package.json and installing some package

  This writing explains about package.json, how to make package.json and installing some package to it. It will explain vulnerability when installing some package. 1. What is package.json? If you add packages needed for services or applications one by one, you will soon have hundreds of packages. And each package you use has its own version, so you need to record it somewhere. Even for the same package, functions may differ depending on the version, so if you do not install the same version of the package when installing the project, problems may occur. The file that manages the version of the installed package is package.json. Therefore, before starting a node project, you must always start by creating a package.json file inside the folder. 2. Making package.json Make the package.json by entering this command in the console: npm init $ npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible d...

Node and npm introduction

Image
  This writing provides an overview of Node and npm introduction, concept etc.  Some of contents are referred from Node.js books, official webpage for node and npm. To develop the mobile application with ReactNative, this node and npm are the must-to-know things. 1. What is Node? There are many opinions about what a node is, but no explanation is more accurate than the one on the official Node website. ( https://nodejs.org/en)  Node.js is JavaScript runtime environment that lets developers create servers, web apps, command line tools and scripts. Node is used when executing various JavaScript application but it is used mostly for server application. In addition to server, Node is used Web with Angular, React, Vue, and also for the mobile application with ReactNative that I'm using. 2. What is "Runtime environment"? Runtime, specifically, refers to the period or time during which a program is running. The runtime environment is the environment in which a program is running...