Skip to main content

Posts

creating reusable component is reactjs how to create a button class and use it for different project as a reusable component

working link https://stackblitz.com/edit/react-qjonsv?file=index.js code is below:-- import React , { Component } from 'react' ; import { render } from 'react-dom' ; import Hello from './Hello' ; import './style.css' ; //a button class class GTbutton extends Component { constructor ( props ) { super ( props ); } PointerDown () { this . props . buttonClick (); } render () { return ( < div > < button class = "button" onClick ={ this . click =()=> { this . PointerDown (); }} style ={{ background : this . props . color }}>{ this . props . label }</ button > </ div > ); } } class App extends Component { constructor () { super (); this . state = { name : 'React' }; } handleClick () { console...

understanding promise and async function using example

working link-> https://stackblitz.com/edit/js-it5ura?file=index.js //passing value to a promise using arrow function let numberSlover =( x )=> new Promise (( resolve , reject )=>{ if ( typeof x == "number" ) { resolve ( "Pass" ) } else { reject ( "Fail" ) } }) numberSlover ( 22 ). then (( data )=> { console . log ( data ); },( data )=>{ console . log ( data ); } ) //now even better than above using async function which return a promise async function add ( op , one , two ) { let result ; if ( op === "+" ) { result = one + two ; } else if ( op === "/" ) { result = one / two ; } else if ( op === "*" ) { result = one * two ; } else if ( op === "-" ) { result = Math . max ( one , two )- Math . min ( one , two ); } return result ; } add ( ...

Call and apply with classes and what how can you use in in a best way

working link=> https://stackblitz.com/edit/js-ms1npr function emp () { console . log ( "called" ); } emp . prototype . getEmpSalary = function ( salary ) { const totalSalary = salary * 12 ; return totalSalary ; } emp . prototype . empType = function ( salary , type ) { let salaryObject ={}; switch ( type ) { case "it" : salaryObject . type = "it emp" ; salaryObject . salary = salary * 12 ; break ; case "others" : salaryObject . type = "others emp" ; salaryObject . salary = salary * 12 ; break ; } return salaryObject ; } var manish = new emp (); function callEmp ( s ) { //invoke a function emp using call console . log ( emp . prototype . getEmpSalary . call ( this , s )); //invoke a function emp using apply console . log ( emp . prototype . empType . apply ( this ,[ 2000 , ...

how to use react Router module to create a single page application

Routing is one of the most important part of every react application especially when you have to deal with single page application.  you can add routing in react using react-router-dom package key features and some points to remember about routing 1. Routing  start with Router tag and only one single html elements allowed inside Router tag. 2. Routing history manage by history module  more about routing history    https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/history.md 3. there are two type of routing in react js HashRouter and BrowserRouter.In most cases BrowserRouter  is ok when you have to deal with dynamic server side page's but HashRouter  is useful dealing with static website pages. more difference => https://stackoverflow.com/questions/51974369/hashrouter-vs-browserrouter 4. you can pass data dynamically Routing please check the below links more details below links ...

type aliases implementing your own type in typescript

 type aliases or your own type is one of the most important part of typescript see how you can implement type aliases in typescript using type . link-> https://stackblitz.com/edit/typescript-7barjt //creating your own type or type alias in typescript is very easy for example //direction type what only allowed dirction values export type Direction = "north" | "south" | "east" | "west" ; //strArray allowed only string and array where array is number of boolean type export type strArray = string | Array < number | boolean >; //an interfacce type--------- export type userdd = userDD ; interface userDD { userDirection : Direction username : string } class human { private direction : Direction ; private myarray : strArray ; private newuser : userdd ; constructor () { /* myarray is string and array type where Array is number or boolean type so any other value in myarr...

using Object.assign() copy values from one object to another

more details=> https://developer.mozilla.org/en-US/docs/Web/JavaScript /Reference/Global_Objects/Object/assign link is here:- https://stackblitz.com/edit/js-m4m1jh //using Object.assign() we can copy values from one object to aonther object form source to target object and target object return var objectA ={    "name" : "ObjectA" ,     "data" :     {        "x" : 200 ,        "y" : 300     } } var objectB ={    "name" : "ObjectB" ,     "data" :     {        "x" : 1200 ,        "y" : 1300     } } //objectB is source object //objectA is target object Object . assign ( objectA , objectB ); //other example data added from seond object source object to the target object and because the property name is dif...

How can I become a good coder when i am using c++ or swift for my gaming or interactive projects

i will talk about coding standard which i follows in c++ or swift (ios) for c++ define a class name like thats - public myGame extends baseClass checkout class name in camel case use abstract classes whenever you go for inheritance that would help you and other coders that there are some method already declare in base class and he don’t need to be redeclared it and also your base class can access child class method through pointer . overriding in bad habit when its comes to deal with a big project instead of overriding create method with optional parameter which would help you to reduce code in your project. generic templates are best way to deal with common things like defining a template which combine string as well as float and int based on parameter type. including header file in .cpp is bad habbit try to include all header file in .hpp resuse classes are good but too much reusability is another bad habbit for example button->mybutton->mymybutton->anotherbutton ...

classes in typescript

classes and object is more of the most imported part of any object oriented programming language so how to use classes in typescript i am trying to figure it out. as we know classes are blueprints which holds all properties and methods and using instance we can access those properties and methods. so lets try to create a class in typescript working link-> https://stackblitz.com/edit/typescript-yh1fpu //create a class with keyword class following class name class species { // public orign : string ; //declare a class property private specType : string ; //define constructor for your class if you don't define it typescript automatically create it for you constructor () { } //this is how you can define a function in typescipt getSpecType (): string { return this . specType ; } //this is how you can define a function in typescipt setSpecType ( type : string ) { this . specType = type ; }     } //now le...