MEAN.io setup with WebStorm - node.js

MEAN.io http://mean.io/#!/ is getting popular for FullStack MEAN framework (Mongo db, Express, Angular JS, Node), Im able to follow instruction and setup MEAN.io so far successfully, now I want to integrate MEAN.io with WebStorm so I can proceed further development in WebStorm.
How can I run MEAN.io project in Webstorm?

Install MEAN.io and setup your project following given instructions:
https://github.com/linnovate/mean
Watch Video
Running MEAN.io project in WebStorm:
1- Open your project in Webstorm
2- Run->Edit Configurations to provide Node path, Working directory and JavaScript file "server.js" as following:
3- Save Configurations and Run project

Related

How to run angular Application without node.js

I want to create the Angular application using Visual Studio 2019 Angular template in Asp.net core but without Node.js as External tool installation. I found that NuGet package manager also providing Node.js and NPM Packages for building Angular app.
So I created the asp.net core projected and selected Angular Template and add NuGet Node.js 5.3.0 that too is saying in readme.txt "Node.js itself is deployed by NuGet, so there is no need to install it locally on dev machines or build servers."
But when I tried to run the angular project then build is failing.
If anyone knows the solution with exact steps so please help me on this.
There is one extra step is required after the Nuget Node.js package installed in the project, which is missing in the node.js document.
Step: Add node.js installed path in PATH Environment Variable (One-time activity per dev system)
e.g: set PATH=%PATH%; C:\Program Files (x86)\Microsoft Visual Studio\2019\Professional\MSBuild\Microsoft\VisualStudio\NodeJs
or node.js install path can be set manually in the PATH Environment Variable

create a mobile app from my web site using reactjs (not native)

I need to develop a mobile application which will be same for my web site (already create with reactjs). I was researching on reactjs. Can I convert my reactjs code from web-site to reactjs for mobile application ?
need a solution please
Thanks
No bro, a PWA cannot be uploaded to the apple store, by the way you can bypass this problem using ionic capacitator!
Capacitor is a cross-platform app runtime that makes it easy to build
web apps that run natively on iOS, Android, Electron, and the web. We
call these apps “Native Progressive Web Apps” and they represent the
next evolution beyond Hybrid apps.
According with this tutorial written by Manish Mandal to do so u have to:
1 - First, go to the root of your existing react app and create a file capacitor.config.json and inside that put the below code
{
"appId": "io.ionic.yourapp",
"appName": "yourapp",
"bundledWebRuntime": false,
"npmClient": "npm",
"webDir": "build",
"cordova": {}
}
2 - Now create another file name ionic.config.json and inside that insert the below code.
{
"name": "yourapp",
"integrations": {
"capacitor": {}
},
"type": "react"
}
3 - Now we need to build our react project. To build your react app open your terminal to the root of the project and run the below-mentioned command
npm run build
Note: this will create the build folder in your root porject and the
name of the folder should match the webDir name inside
capacitor.config.json file
4 - Now we will install ionic globally in our machine. To install ionic globally in your machine open your terminal and run the below command.
npm install -g #ionic/cli
5 - Now install the capacitor core in our project.
npm install #capacitor/core --save
ANDROID
6 - After that, we will first create an android app with our existing react app. Open your terminal and type
ionic capacitor add android
This will create the android folder in your root project and install all the required dependencies.
7 - Now run the below command to open your android project in android studio.
npx cap open android
Wait some time and then it will ask you to update the Gradle. Just update the Gradle to the latest version and run the project in the emulator. You can also connect your mobile to run the project live on your mobile phone.
8 - Now open the build menu from the android studio and build your apk file.
IOS
9 - To create ios app run the below command
ionic capacitor add ios
This will install all the required dependencies and ios folder to your project.
10 - Now run the below command to open your ios project in Xcode.
npx cap open ios
11 - Now open the app in emulator or physical device and build the app.
More info about capacitator:
https://capacitorjs.com/
so you need to create progressive web app , all it takes a mainfest.json file in your meta tag WebApp Manifest
with some splash screens and icons chrome will make you install mobile app like on client devices. And try to implement a service worker to handle the offline mode Service Worker
This course from egghead is very good PWA
You could create an "app" that is really just a webview that shows your website but it won't really have the same experience as a native app.
As mentioned a PWA would be a good approach. This way you can keep all your ReactJS code and have an app-like experience.
Android even supports submitting PWAs to the store.
You can't perform code conversion from react-js to react native directly, even though there are many similarities between them. Web application built with React.js can be easily converted to a React Native mobile app, and some source code can be reused
if you want to develop a single app for both mobile and web either,
create a web app that mobile browser friendly
or
create PWA(Progressive Web app) using React, PWA can access Native Mobile api like GPS

could not open a nodejs project in intellij phpstorm and idea

Although I have installed the nodejs plugin in phpstorm IDE I cannot separately open a nodejs project.But I can open an empty project and run nodejs codes in there.
The main reason is to have the separate folder structure for nodejs project(specially when creating a nodejs express project).
Additionally, I cannot install the nodejs plugin in the IDEA too.
I have gone through their documentation but I couldn't find a solution to this.
Please help me with this.
Note:
Phpstorm version - 8.01
IDEA version - 2016.2.04

NodeJS project type is missing from PhpStorm

I am trying to setup Express.js project in PhpStorm IDE.
Here are things I've done:
Installed node and npm
Installed nodejs plugin in PhpStorm
When I try to create new project node js express app type is missing from the project list.
PhpStorm version: 10.0.0
OS: Windows 8
It's there for me:
Something must be wrong with NodeJS plugin (incompatible version, etc.). I'd suggest creating a support ticket

How does someone debug Sails.js code in Visual Studio?

I'm currently trying out Node.JS and using Visual Studio Community with Node.js Tools as my primary IDE.
If I would create an Express application using this interface:
Then I would hit F5, my Express application would start and I'd see this nice debug window:
However, if I install Sails.js using npm -g install sails, I no longer see this debug window in my test Sail.js app (if I create one in my Visual Studio), nor in Express app.
My application would start as expected, except that I can't see debug window anymore.
Debug window comes back only if I do following:
Remove Sails from my machine using npm -g uninstall sails
Reinstall node.js
How do I get debug window if I have Sails installed? I'd like to have it for both Express and Sails applications.
Ran into a similar issue of running Sails application inside Visual Studio. Here's how I got my project properly running in Visual Studio, in case any stumbles on that question.
Create Create Blank Node.JS Console Application in the VS
In another folder outside of your project initialize your sails app (if you haven't already), e.g. sails create appName. If you already know your API controllers/models, it's a good idea to create them right now. If not, you'll have to do it manually rather than using sails generate api
IMPORTANT: In Sails project folder, remove node_modules, in my case existing node modules were throwing VS npm off the track
In the visual studio, right click on your project, go to Add > Add Existing Folder...
Select your folder with Sails Application
Once it's imported, you'll notice that you have a folder with sails application that also has app.js. Select all the contents of sails project and move them a level up to your root. It should replace app.js, package.json & readme.
Right click on npm, select Install missing packages...
After that, right click on you app.js file and select it as start js file
Run/Debug the application. It should work just fine.
Hope it helps.

Resources