Hypertechblog

Show Escape or Enter and tab in column or row in Rails @users.each do |user|      raw(user.address.gsub(/\n/, '<br>'))   end //assuming you have \n or enter in your record and if you have another Special character then replace that character wiht respective html tag

Generate Controller, views into specific folder rails generate scaffold_controller api/v1/users

Searching on Select Box and Check Box Searching on List <input type="text" id="myInput" onkeyup="filterFunction()" placeholder="Search.." > <ul id="myulli">   <li><a href="#">abc</a></li>   <li><a href="#">xyz</a></li>  <li><a href="#">demo</a></li> <li><a href="#">testing</a></li> </ul> <script> function filterFunction(){    var input, filter, ul, li, a, i;    input = document.getElementById("myInput");    filter = input.value.toUpperCase();    div = document.getElementById("myulli");    a = div.getElementsByTagName("li");    console.log(a);    for (i = 0; i < a.length; i++) {        if (a[i].innerHTML.toUpperCase().indexOf(filter) > -1) {            a[i].style.display = "";        }

DML Command Insert Command Its used to insert the record into table example- Command for inserting single record insert into <table name> values(value1, value2...) Command for inserting multiple command at a time insert into <table name> values(&col1, &col2...., &coln); whenever you enter query like this it will ask you to like this - enter a value for column1- value1.. and then hit enter  - enter a value for column2- value2.. and then hit enter - enter a value for column3- value3.. and then hit enter Now it will show 1 row created  if you want to create more record use / and hit enter SQL> /   hit enter // it will Execute most recent query again //this will so again and so on... - enter a value for column1- value1..  and then hit enter  - enter a value for column2- value2..  and then hit enter - enter a value for column3- value3..  and then hit enter // if you will miss any value here that will be inserted as NULL value Update command Used to upda

DDL Command CREATE Command It is used to create any data base object like tables, views, indexes, sequences, synonyms , users, functions, procedures, triggers, packages and so on. HOW TO CREATE A TABLE?            syn: CREATE TABLE <table_name>             (              <colname1> DATATYPE (size),               <colname2> DATATYPE (size),                : : : :,                : : : :,             ); INSERT Command This command is used for inserting new records into the tables          Syntax:           INSERT INTO <table_name>[(col1, col2,...., col n)]           VALUES(val1, val2,.....,val n);                  NOTE:  i) If number of columns in the table and number of values inserting in to the table      are equal, then no need to specify column names while inserting records.            ii) Char, Varchar2 and date type values should be enclosed in Single Quotes.            iii) If Number of inserting values are less than the

Naming Convention in SQL Rules to follow before specifying names(Object names, Column Names and Variable Names). Each name should begins alphabet Valid character set is a-z,A-Z,0-9,@,$,# and _ (underscore) Ex:  Emp123   Emp_o11 Names are not case sensitive Already existed names are not allowed Pre defined keywords (ReservedWords) are not allowed as names. Blankspace within a name is not allowed Max length of any name is 32 chars

Structured query language It is a collection of pre defined commands and constructs with syntactical rules. 1. Sql is a client tool to interact with ORACLE DB /any DB 2. Sql is to be installed in to the system whenever we have installed the db software. 3. Client [Technical] requests should be submitted in the form of "Queries". 4. Queries are executed by SQL STMT EXECUTOR ( Oracle Db Engine ) 5. Queries are executed against database and output will be displayed on the Sql * plus window.

 Export Import component in react See installation and configuration in my other blog Now Create a file into a public folder or anywhere into Root directory inside your project folder Create to directory into root directory         mkdir public           mkdir src Create two new into public folder index.html index.js Create two new file into src folder main.js  item.js Copy and paste code into index.html <!DOCTYPE html> <html> <head> <title>React - demo</title> </head> <body> <div id="root"></div> <script src="index.js"></script> </body> </html> Now into item.js import React from 'react'; class Item extends React.Component{ render(){ return( <div> Hello Item </div> ); } } export default Item; // you must have to make component exportable Now into main.js import React from 'react&#

Install Webpack and configure it first See installation and configuration in my other blog Now Create a file into a public folder or anywhere into Root directory inside your project folder Create to directory into root directory         mkdir public           mkdir src Create two new into public folder index.html index.js Create a new file into src folder main.js Copy and paste code into index.html <!DOCTYPE html> <html> <head> <title>React - demo</title> </head> <body> <div id="root"></div> <script src="index.js"></script> </body> </html> Now into main.js import React from 'react'; import ReactDOM from 'react-dom'; function Welcome() { return (<div> Hello </div>) } const root = document.getElementById('root');  ReactDOM.render(<Welcome />, root); Project Structure will be like this

Install Webpack and configure it first See installation and configuration in my other blog Now Create a file into a public folder or anywhere into Root directory inside your project folder Create to directory into root directory         mkdir public           mkdir src Create two new into public folder index.html index.js Create a new file into src folder main.js Copy and paste code into index.html <!DOCTYPE html> <html> <head> <title>React - demo</title> </head> <body> <div id="root"></div> <script src="index.js"></script> </body> </html> Now into main.js import React from 'react'; import ReactDOM from 'react-dom'; class Welcome extends React.Component{ render(){ return( <div> Hello  </div> ); } } const root = document.getElementById('root');  ReactDOM.render(<Welcome />, root);

WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/ module.exports = {   mode: "development", // Add mode here to solve this warning    entry: './src/main.js', // Bundle all assets from this location together    output: {        filename: 'index.js', // Output to this file        path: path.resolve( __dirname, 'public' ), // In this location    }

Run this commands form terminal or cmd npm init npm i webpack --save-dev npm i webpack-cli --save-dev  npm install -D babel-loader @babel/core @babel/preset-env webpack  npm i @babel/preset-react --save-dev npm i babel-core --save-dev npm i babel-preset-env --save-dev npm i babel-preset-es2015 babel-preset-react babel-preset-stage-0 --save-dev npm i react react-dom --save-dev npm install webpack-dev-server -g   // In window and mac os this command will not work then use this npm i webpack-dev-server --save-dev Create a new file named Webpack.config.js into root directory copy and paste this code into webpack.config.js file var path = require('path'); module.exports = {    entry: './src/main.js', // Bundle all assets from this location together    output: {        filename: 'index.js', // Output to this file        path: path.resolve( __dirname, 'public' ), // In this location    },    module: {        rules: [        

Create a directory into your local         for windows            mkdir react-demo         for linux                       mkdir react-demo Go to directory             cd react-demo Type npm init            for installing node and creating package.json file npm i webpack --save-dev           create dependency by webpack npm i webpack-cli --save-dev           This cmd is used to create dependency for webpack-cli in package.json file.           Like -             "devDependencies": {            "webpack": "^4.16.2",            "webpack-cli": "^3.1.0"             } npm install -D babel-loader @babel/core @babel/preset-env webpack "devDependencies": {    "babel-core": "^6.26.3",    "babel-loader": "^7.1.5",    "babel-preset-env": "^1.7.0",    "webpack": "^4.16.2",    "webpack-cli":

Webpack is a tool that puts all your assets including images,javascript ,fonts and css in a dependency graph entry point: is the file webpack looks for to start building your Javascript bundle webpack’s main strength is code splitting. It introduce a production mode and development mode. As ,, Syntax of  ReactJS is based on ES6. old browsers doesn’t understand ES6. So , to run JS we need something which transform our ES6 code to browser understand language , the same thing is done by babel-loader. Babel-loader is a webpack loader for transpiling ES6 and above , down to ES5. For this, you need three things - babel-core, babel-loader, babel-preset-env   Commands- 1. npm init: This cmd create a package.json file . 2.npm i webpack --save-dev: This cmd generate dependencies for webpack in package.json file. Like "devDependencies": {    "webpack": "^4.16.2"  } 3. npm i webpack-cli --save-dev : This cmd is