Best Shortcut You Didn’t Know!!
By codeSTACKr
Published: Feb 15, 2023“
Code Tip of the Day
Do you ever need to go back up to some code you wrote earlier to copy a piece of it, then have to figure out where you were at just before that?Just press Alt+LeftArrow, you’ll go right back to that previous cursor location.
You’re welcome!
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZ
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”
Tag: IDE
[#Script #Coding] Best VS Code Extension for REST API – No More Postman
Best VS Code Extension for REST API – No More Postman
By codeSTACKr
Published: Dec 23, 2022“
Thunder Client is a lightweight Rest API for VS Code.
It’s a great alternative to Postman or Insomnia since you can run your queries directly from VS Code instead of yet another application.
After you install the extension, you’ll see a new tab on the sidebar.
From there, you can create a new request. Enter the URL along with any the type of request it is and any payloads. Then run it.
You’ll see the results right here inside VS Code!
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZ
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”
[#Script #Coding] STOP Renaming Things in VS Code This Way!
STOP Renaming Things in VS Code This Way!
By codeSTACKr
Published: Feb 06, 2023“
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZ
VS Code Tip of the Day
How do you rename functions, variables, classes, and other symbols in visual studio code?
Do you go one by one renaming them? I hope not.
Do you use the find and replace menu to replace them all? That’s better.
Maybe you use Ctrl+D or Ctrl+Shift+L to select all occurrences of that word. That could work, but it’s still not the easiest way.
All you have to do is put your cursor on the symbol that you want to rename and press F2, then rename it. That’s it. It will automatically be renamed everywhere that it’s referenced.
You’re welcome!
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”
[#Script #Coding] Pro Tip – Code from Any Device with Remote Tunnels in VS Code
Pro Tip – Code from Any Device with Remote Tunnels in VS Code
By codeSTACKr
Published: Jan 25, 2023VS Code Tip of the Day
- Do you know how easy it is to code on any device?
- Account menu – Turn on remote tunnel access.
- Sign in with GitHub if prompted.
- Creates a secure tunnel directly to your machine.
- Copy / Paste this URL anywhere!
- Literally, anything with a browser.
- Access your local machine as if you were at it.
- You can even run terminal commands!
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZ
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”
[#Script #Coding] A Visual IDE for React?!? The Future of Web Development
A Visual IDE for React?!? The Future of Web Development
By codeSTACKr
Published: Jan 02, 2023“
Download Codux Free at https://codux.hopp.to/codeSTACKr
Codux is a visual IDE, or graphical editor, that allows you to build and edit React components like you’re drawing on a canvas.
You’ll see and have access to the code right inside Codux, but it shouldn’t replace your existing IDE. In fact, the goal of Codux is not to replace your existing IDE, but to turbo charge your React workflow by giving you the ability to visually edit as well. As you make changes in Codux you’ll see the updates happen in real time in your existing IDE.
Codux supports any React project built using TypeScript with styling in CSS, Sass, or CSS Modules, and has full Git integration.
Another great feature is the ability to develop components in isolation. That’s generally how we build in React. We build components. But we usually can’t see each component rendered in isolation. With Codux, you can work on each component individually, see each component in various states, then bring them all together where needed.
Because this is a graphical user interface, even someone with little to no React experience can easily update and edit components visually and be confident that the updates reflected in the code will be accurate.
Just like in your browser’s dev tools, you’ll see all of the CSS styles for each element and you can edit them. This makes memorizing every CSS property name and value a thing of the past. Every property is visually available to edit. And these changes take place immediately in your code base.
To get started, you can import almost any existing React project or create a new project from scratch.
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZ
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Timestamps
00:00 – Intro 02:25 – Building a YouTube Clone from scratch using Codux 02:42 – Create a new project 05:51 – Building the header component 07:23 – Building the side menu bar component 08:19 – Building the filters bar component 09:33 – Building the video card component 10:42 – Defining TypeScript props for your video card component 11:39 – Putting it all together in our App component 13:20 – Run the application locally to test 13:34 – Giving the YouTube clone a new name 13:49 – Commit our changes and publish to GitHub
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”
[#Script #Coding] Pimp my Cursor – VS Code Style
Pimp my Cursor – VS Code Style
By codeSTACKr
Published: Feb 03, 2023“
VS Code Tip of the Day
I get tons of questions about my vs code cursor settings. So, let’s take a look..
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZ
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”
[#Script #Coding] Top 10 VS Code Themes 2023
Top 10 VS Code Themes 2023
By codeSTACKr
Published: Jan 27, 2023“
Become A VS Code SuperHero Today: https://vsCodeHero.com
Join my Discord developer community: https://discord.gg/A9CnsVzzkZVS Code Tip of the Day
Here are the top 10 vs code themes in my opinion in less than 60 seconds:
– Good ‘ol VS Code Default Dark
– One Dark Pro
– GitHub Theme
– Winter is Coming
– Synthwave ‘84
– Coder Coder Dark
– Level Up Theme
– Cobalt 2
– Night Owl
– codeSTACKr
Tools I use:
- codeSTACKr VS Code Theme: https://marketplace.visualstudio.com/…
- STACKr Code Font (Exclusive to my VS Code Course – https://vsCodeHero.com)
- SuperHero Extension Pack: https://marketplace.visualstudio.com/…
Show support!
- PayPal: https://paypal.me/codeSTACKr
Watch Next:
- Playlist: Web Development For Beginners – https://www.youtube.com/watch?v=Ez4yH…
Connect With codeSTACKr:
- Website: https://www.codestackr.com
- Twitter: https://twitter.com/codeSTACKr
- Instagram: https://instagram.com/codeSTACKr
- Facebook: https://facebook.com/codeSTACKr
”