Posts

Shapes in Photoshop

Image
  How to Draw Shapes in Photoshop using Shape Tool shape layer also uses Photoshop vector technology. You will get shape layer tool right here in toolbar. Now click on that and you can see various Shapes like; Ractangle Tool Rounded Rectangle Tool Elipse Tool Polygan Tool Line Tool Custom Shape Tool By selecting these items you can draw them as regular path or as a shape layer. See in the options bar, on the second position you can see a menu. It will show you 3 options to draw your shape like “Path” , “Shape” and “Pixels”. Now pixel fills the drawn path with pixels, this option does not use vector technology.   And path will draw only path of the shape, it will not fill any color in path. But here I select shape option and you can see some various options here. I can select “fill color, stroke color, stroke type” and much more options here.     Now draw the shape and see in layer panel a new layer created there.   You can see a small path icon on the layer. i...

Layers in Photoshop

Image
  What is Photoshop? Photoshop is a photo editing and raster graphic design software that allows users to create, edit, and manipulate various graphics as well as digital art. It also allows to the creation and edits raster images with multiple layers and the import of the images in various file formats. Photoshop is developed by Adobe Systems for both Windows and macOS. What are Layers in Photoshop? Layers in Photoshop allow you to work non-destructively by stacking images on top of other images without interacting and mixing the pixels of images. “Layer” is the only thing that makes Photoshop an amazing photo editing and compositing tool. Layers can be used to stack multiple images, add text to an image, add vector graphics, etc. Step 1) Invisible Layer Now when you create an image or open an image in photoshop it’s visible in the layer panel. Let me drag out the layer panel. You can see by default a background layer. Step 2) Unlock Layer You can notice a lock symbol on it. ...

React Introduction

Image
  What is React? React is a JavaScript library (not a framework) that creates user interfaces (UIs) in a predictable and efficient way using declarative code . You can use it to help build single page applications and mobile apps, or to build complex apps if you utilize it with other libraries   React.JS History Facebook Software Engineer, Jordan Walke, created it. React.JS was first used in 2011 for Facebook's News feed feature. The create-react-app version 2.0 package was released in October 2018. Initial Release to the Public (V0.3.0) was in July 2013. Create-react-app version 2.0 supports Babel 7, webpack 4, and Jest23. Current version of React.JS is 17.0.1 (October 22, 2020).   Setting up a React Environment Install create-react-app by running this command in your terminal: sudo wget -qO- https://deb.nodesource.com/setup_14.x | sudo -E bash sudo apt-get install -y nodejs node -v npm -v Run this command to create a React application na...

JavaScript While Loop

Image
  The While Loop The while loop loops through a block of code as long as a specified condition is true. Syntax while ( condition ) { // code block to be executed } < !DOCTYPE html > < html > < p id ="demo" > JavaScript While Loop < /p > < script > var txt = "" ; var i=0; while (i < 10 ) {   text += "The number is " + i;   i++; } document.getElementById( "demo" ).innerHTML = text; < /script >     < /body > < /html >     The Do/While Loop The do/while loop is a variant of the while loop. This loop will execute the code block once, before checking if the condition is true, then it will repeat the loop as long as the condition is true. Syntax do { // code block to be executed } while ( condition ); < !DOCTYPE html > < html > < p id ="demo" > JavaScript Do/While Loop < /p > < script > var txt = ...

JavaScript For Loop

Image
  JavaScript Loops Loops are handy, if you want to run the same code over and over again, each time with a different value. Often this is the case when working with arrays: text += cars[ 0 ] + "<br>" ; text += cars[ 1 ] + "<br>" ; text += cars[ 2 ] + "<br>" ; text += cars[ 3 ] + "<br>" ; text += cars[ 4 ] + "<br>" ; text += cars[ 5 ] + "<br>" ; < !DOCTYPE html > < html > < p id ="demo" > JavaScript can change HTML content. < /p > < script >  var cars = [ "BMW" , "Volvo" , "Saab" , "Ford" , "Fiat" , "Audi" ]; var text = "" ; var i; for (i = 0 ; i < cars. length ; i++) {   text += cars[i] + "<br>" ; }  document. getElementById ( "demo" ). innerHTML = text;   < /script >     < /body > < /html >   ...