Online Resources
Mac Keyboard Shortcuts
- Screenshot: cmd+shift+4
- Emoji keyboard: cmd+ctrl+space
Sublime 4 Shortcuts
- Here is a cheatsheet with all Sublime 3 Shortcuts for Mac
- html tab: adds the entire boilerplate
- To quickly duplicate a line of code, place the cursor anywhere in the line and press cmd+shift+D
- click on line of text and type cmd+/: comments it out <!-- -->
- type any html tag (ul, li, p, etc.) → tab and will give you both open and closed tags with the cursor in the middle
- To select and replace all instances of a word:
- Place your cursor somewhere in or next to the word you wish to select
- Press cmd+ctrl+G to highlight every instance of the word in the document
- Type to replace the selected words with your change
- Then just click somewhere else on the screen to come out of the feature
- To Beautify (files saved as .html or .php)
- Select all text
- Select Edit → Line → Reindent
- To move an entire line of code: Hold ctrl+cmd+up or down
- Column selection (create multiple cursors): ctr+shift+up or down
- To create multiple cursors straight up or down of each other: alt+drag mouse up or down
- To highlight the rest of the line of code left or right of the cursor: cmd+shift+left or right
- hold cmd while → clicking mouse: gives multiple cursors so you can type/delete the same thing on multiple lines at the same time
Google Chrome Developer Tools
Debugger
In Chrome Developer Tools Console: type in
debugger; (hold Shift and Return)
and now put function or code you want to debug here
- Now above console you will see the Sources tab
- Click the down arrow with the dot, which takes you down to the next step of your code
- It will highlight where it is finding the code that matches up with your function
- It will even show the numbers passed in and how they line up with your code
Snippets
Extra Coding Practice
Practice 50 Different Languages
Code practice and mentorship for everyone. Level up your programming skills with 3,373 exercises across 50 languages, and insightful discussion with our dedicated team of welcoming mentors. Exercism is 100% free forever.
Practice UI
Daily UI: Become a Better Designer in 100 Days
- Receive challenges for 100 days (sent Mon-Fri
- Create and Share: interpret and then create your own design to share on Dribbble or Twitter with #dailyui
- Surprise Rewards: earn random surprise rewards such as premium design resources, and more!
Daily Inspiration Collected from Daily UI Archive and Beyond
Front End Design Practice
- Improve your front-end coding skills by building real projects. Solve real world HTML, CSS and JavaScript challenges while working to professional designs.
- Solve real-world HTML, CSS and JavaScript challenges whilst working to professional designs. Join over 12,000 developers building projects, reviewing code, and helping each other get better.
Favicon Shortcut
You can use a Google shortcut to access a favicon already on a website and use it as yours.
<link rel="icon" type="image/png" href="https://www.google.com/s2/favicons?domain=jacinto.design">
Possible Mentor Job in the Future
- Get paid a monthly fee to be someone's mentor
Find a Developer for live mentorship & freelance projects
- Get paid (not sure how) to be someone's mentor for a specific problem, or as a longterm mentor.
