Posts

Your app currently targets API level 26 and must target at least API level 28 to ensure it is built on the latest APIs optimized for security and performance in ionic

Image
How to upgrade android sdk target to android-28 in ionic - (play store). Let's Follow me instructions We need to run the following command given below. ionic cordova platform rm android  ionic cordova platform add android@latest ionic cordova build android --aot  --prod  ionic cordova build  android --prod  --release Note , In case ,  you will catch error like "ENOENT: no such file or directory, open ‘platforms/android/AndroidManifest.xml’",   So go to project directory in " config.xml " paste given below code  Now you can run last two command  ionic cordova build android --aot  --prod  ionic cordova build  android --prod  --release

How to display html code on website.

Image
Concept to display HTML code on the website. The HTML code is started from a tag that is '<' (less than )  and closed with  '>'  greater than. Let's come to the point, you need to convert. '<'  to &lt;     (we write less than tag (<) as &lt; ) '>' to &gt;  (we write greater than tag (>) as &gt; ) <pre> &lt;div class="html"&gt; &lt;html&gt; &lt;head&gt;&lt;title&gt;Title&lt;/title&gt;&lt;/head&gt; &lt;body&gt; &lt;p&gt;Unrendred html&lt;/p&gt; &lt;/body&gt; &lt;/html&gt; &lt;/div&gt; </pre> simply copy above snippet and paste in html page

How to access local file path in ionic 4

Image
Add Image Using Local File Path in ionic 4 Currently, the Ionic 4 version has lots of changes to access the file, you can't access the local file directly.  you need to follow current changes Webview  and also add Domsanitizer helps to prevent Cross-Site Scripting bugs. Common Problem observing that user use camera method to access the local file in ionic - It returns three types of destination   1. DATA_URL 2. FILE_URI 3. NATIVE_URI I recommend using FILE_URI to get the image path. After getting Image Let's Follow My Step. 1.  import two modules in component or page (e.g image-modal.component.ts) import { DomSanitizer } from '@angular/platform-browser'; import { WebView } from '@ionic-native/ionic-webview/ngx'; Now Assign Webview & DomSanitizer in the component constructor. constructor(private sanitizer: DomSanitizer, public webview: WebView){ console.log("constructor gitsof.com")} Add Im...

How to use set interval in Typescript

set interval in Typescript The set interval function is important role to execute the program in certain interval of time. Whatever code is written in setInterval function that execute at a fixed time. The time range is started from millisecond. Syntax : setInterval( callback ,  time) callback:-  ()=> time:-  We take time in millisecond  E.g(2000) The example is given below that execute the code on every 2 seconds (2000ms) setInterval(()=>{ console.log("Hello world") //2000 is millisecond it means this program print hello world every 2 second } , 2000) Try other set interval code with a function call setInterval(()=>{ //call other function whatever you want to execute intervalcall() } , 2000) function intervalcall(){ console.log("Hello Fellow user") } Try other set interval code with a time to start trigger setInterval(()=>{ if(new Date().getSeconds() == 20...

How to open blocked sites using google chrome extension

Image
Open the blocked website using google chrome extension There is numerous way of visiting block website, but I will try to give you a better solution to visit the website.   Now Follow the steps to get access the block sites.  1. Simply go  to link https://chrome.google.com/webstore/category/extensions 2. Search  "betternet" and  click on " Add to chrome "  Betternet Vpn 3. We get  a popup and click on"Add Extension"  Finally, go to "betternet extension icon" click it, then  click on  connect

How to use set interval in Javascript

set interval in js setInterval(function google(){ console.log("Hello world") //2000 is millisecond it means this program print hello world every 2 second } , 2000) Try other set interval code with a function call setInterval(function google(){ //call other function whatever you want to execute intervalcall() } , 2000) function intervalcall(){ console.log("Hello Fellow user") } Try other set interval code with a time to start trigger setInterval(function google(){ if(new Date().getSeconds() == 20){ //In case date in minute you use "new Date().getMinutes" //In case date in hours you use "new Date().getHours()" console.log("Hello Fellow users, trigger on 20 seconds") } }, 1000)

Browser module animation in ionic

The  concept of  browser module animation very useful in ionic  4 on animation point of view. The animation is apply in different  form in ionic 4 , Mainly two type of animation use in  ionic. We can  add animation  on  page push ,  and  second on specific component ,  item  , list,  card , so on  enable as animation mode.    Now Quick  start with  browser module animation Problems :-  Browser  animation module is not working after  installing  and well  import in app.module.ts. Solution:- 100% work  ,  Go  to  ionic 4 project,  run command npm i  @angular/animations@latest --save npm i angular-animations --save After  installing  two  in   ionic 4  project ,  Let's move to  integration process Follow,  Step's 1:- Go to  app.module.ts import { BrowserAnimationsModule } fr...

How to Set up the Development Environment in Angular

Image
There are three steps to set up the development environment in angular. Step: 1 Install Node.js and npm from the following link https://nodejs.org/en/download/ Verify your Node.js version. It should be Node.js version 8.x or greater and npm version 5.x or greater. Run the following command to check it. node -v npm  -v Install the Angular CLI globally. Run the following command. npm  install -g @angular/ cli Step: 2 Create a new project Open a terminal or cmd. Create a new project by running the following command. ng new new-app Step: 3 Serve the application Now go into the project directory and run the server. Run the following command. cd new-app ng serve –open ng serve command run the server and –open option will automatically open the browser on http://localhost:4200/

blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Image
CORS problem in browser /node js. By default the browser is disabled the cross-origin-resources-share for the purpose of security problem. The browser try to maintain (block) the unwanted use of syncing resouces by other end. If you run this code in browser console which is given below How to  resolve problem "blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource." If you are using google chrome browser then go to  extension of google chrome and install "cors plugin". Link given below. https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en After installing "cors plugin" then "enabled it" now you request above code, Hence we not get any error of  "blocked by cors policy". Genuine rule to bypass the problem of "blocked by cors policy"  Simply go to  function of request and response block an...

nvm command is not recognized in ubuntu

Image
How to install nvm packages in linux (ubuntu)  The nvm is stands on "node version manager". The NVM is used as to install the node packages, either upgrade or downgrade. Steps for installing nvm packages Go to terminal dialog box write After complete above process type.  Again type Type the node installation command

How to resolve the ionic problem "is not valid JSON format"

Image
The config file (~\.ionic\config.json) is not valid JSON format.   The ionic is mobile app framework which is used to create apps for ios, android, and windows phone. Whenever you are developing an app, The JSON errors in the file and ionic serve is not starting your project. Steps To Remove the "not Valid JSON format".   Go  to  "C:\Users\Pc username\.ionic". Simply Delete all files. Now start is again in the project directory - command is  "ionic serve".

Which code editor is best for developing programming application .

Image
Top Code Editor which is mostly used by the programmer. According to Google Trend report the visual studio code is highest used in the market to develop the program. The Code Editor is used to write the code in an efficient manner. The visual studio code have so many features such as:- Auto maintenance of “Indentation”. Give the plugin option to add some extra tools according to your programming languages. Autocomplete code. The color effect gives the better visibility. The visual studio is best one for making large project or corporate app developer. The visual studio code editor is written in TypeScript, JavaScript, and CSS. The Visual Studio Code is free and open sources, currently, it has great community support.   The sublime text code editor is also good for developing App which is lightweight and take less time to opening project module but it is not free to use. If you want to use Sublime text with full feature so you must to buy this app. ...