Nov 10, 2016 One of the very best web development tools out there, this is a must-have for anyone working in web development. HTML Entity Character Lookup. HTML Entity Character Lookup helps you ensure all the characters on your page are validated. Using HTML entities is essential to ensure all the characters on your page are validated. Find out why you need a Mac for iOS development and the minimum Mac you need for programming your next app. Wondering if the MacBook Pro, MacBook Air, or even Mac mini are good enough for. Jun 22, 2017 5. KodeWeave is a newer project that looks a lot like CodePen, because it basically serves the same purpose: experiment with bits of front-end code. The big difference is that in addition to using it as a web app, you can download it as a standalone app for Windows, Mac, Linux, ChromeOS, and Android.
- Web App Developer Salary
- Essential Mac Apps For Web Developers Free
- Mobile App Developer
- Essential Mac Apps For Web Developers Software
- Essential Mac Apps For Web Developers Windows
I have to set up a MacBook Pro fairly often - when starting a new job and when buying a new personal computer. I created this article back in 2015 when I got my first Mac and have been updating it ever since with whatever I need as my job evolves. I'm primarily a full-stack web developer, so most of my needs will revolve around JavaScript/Node.js.
Web App Developer Salary
Getting Started
The setup assistant will launch once you turn the computer on. Enter your language, time zone, Apple ID, and so on. The first thing you should do is update macOS to get the latest security updates and patches.
Homebrew
Install the Homebrew package manager. This will allow you to install almost any app from the command line.
Make sure everything is up to date.
Install Apps
Here are some the programs I always install.
Don't install Node.js through Homebrew. Use nvm (below).
Program | Purpose |
---|---|
Visual Studio Code | text editor |
Google Chrome | web browser |
Firefox | web browser |
Opera | web browser |
Rectangle | window resizing |
iTerm2 | terminal |
Docker | development |
VLC Media Player | media player |
Slack | communication |
Keybase | security |
Spotify | music |
Postgres | database |
Postico | database UI |
Postman | API tool |
Shell
Catalina comes with zsh as the default shell. Install Oh My Zsh for sensible defaults.
Node.js
Use Node Version Manager (nvm) to install Node.js. This allows you to easily switch between Node versions, which is essential.
Install
Install the latest version.
Restart terminal and run the final command.
Confirm that you are using the latest version of Node and npm.
Update
For later, here's how to update nvm.
Change version
Here's how to switch to another version and use it.
And to set the default:
Essential Mac Apps For Web Developers Free
Git
The first thing you should do with Git is set your global configuration.
Input your config and create some aliases.
With the above aliases, I can run
git s
instead of git status
, for example. The less I have to type, the happier I am.SSH
Simplify the process of SSHing into other boxes. Create an SSH config file.
Add the following contents, changing the variables for any hosts that you connect to. Using the below will be the same as running
ssh -i ~/.ssh/key.pem [email protected]
..ssh/config
Now just run the alias to connect.
![Web Web](/uploads/1/2/6/2/126248407/397196833.gif)
Generate SSH key
You can generate an SSH key to distribute.
Add key.
Settings
I don't like a lot of the Apple defaults so here are the things I always change.
To get the Home folder in the finder, press
CMD + SHIFT + H
and drag the home folder to the sidebar.General
- Set Dark mode
- Make Google Chrome default browser
Dock
- Automatically hide and show Dock
- Show indicators for open applications
Keyboard
- Key Repeat -> Fast
- Delay Until Repeat -> Short
- Disable 'Correct spelling automatically'
- Disable 'Capitalize words automatically'
- Disable 'Add period with double-space'
- Disable 'Use smart quotes and dashes'
Security and Privacy
- Allow apps downloaded from App Store and identified developers
- Turn FileVault On (makes sure SSD is securely encrypted)
- Turn Firewall On (extra security measure)
Sharing
- Change computer name
- Make sure all file sharing is disabled
Users & Groups
- Add 'Rectangle' to Login items
Defaults
A few more commands to change some defaults.
Application Settings
Chrome
- Turn off 'Warn before quitting'
- Install uBlock Origin
- Install React DevTools
- Install Redux DevTools
- Install JSONView
- Install DevTools Theme - New Moon
- Settings
- Set theme to 'Dark'
- Go to
chrome://flags
and set Developer Tools Experiments to 'Enabled' - Go to Experiments and select 'Allow custom UI themes'
Visual Studio Code
- Press
CMD + SHIFT + P
and click 'Install code command in PATH'. - Install Prettier
- Install New Moon Theme
- Install GitLens
- Install Highlight Matching Tag
- Keyboard Shortcuts
- Copy Line Down -
CMD + SHIFT + E
- Delete Line -
CMD + SHIFT + D
- Reload Window - Remove Development Mode from When
- Format Document -
CMD + SHIFT + L
- Copy Line Down -
Mobile App Developer
Rectangle
- Full Screen:
CMD + SHIFT + '
(prevents messing with other commands) - Left Half:
CMD + OPTION + LEFT
- Right Half:
CMD + OPTION + RIGHT
iTerm2
- Set tab to open in same location
Essential Mac Apps For Web Developers Software
Conclusion
That sums it up for my current preferences on setting up a MacBook Pro. I hope it helped speed up your process or gave you ideas for the next time you're setting one up.
- AppWage: iTunes Connect reporting tool. http://appwage.com
- BetterSnapTool: Window snapping. https://itunes.apple.com/us/app/bettersnaptool/id417375580?mt=12
- Caffeine: Prevent auto sleep. http://lightheadsw.com/caffeine/
- Coda: Web IDE. https://panic.com/coda/
- ClipMenu: Clipboard management. http://www.clipmenu.com/
- Cyberduck: FTP/SFTP/WebDav/S3/Google Cloud GUI. http://cyberduck.io/
- Dash: API Doc Browser and Code Snippet Manager. http://kapeli.com/dash
- Disk Diag: Cleanup unneeded files. https://itunes.apple.com/us/app/disk-diag/id672206759?mt=12
- FileZilla: FTP GUI client. https://filezilla-project.org/
- F.lux: Adjusts the color of your screen to match the time of day. http://justgetflux.com
- Fugu SSH: Easy file transfers between machines. http://sourceforge.net/projects/fugussh/files/
- gfxCardStatus: Monitor battery life affected by graphics. http://gfx.io/
- Growl: Notification system. http://growl.info/
- Go2Shell: Go to terminal from finder. https://itunes.apple.com/us/app/go2shell/id445770608?mt=12
- Homebrew: Package management. http://brew.sh/
- iStat Menus: Mac monitoring in menu bar. http://bjango.com/mac/istatmenus/
- iTerm2: Alternative to Terminal. http://www.iterm2.com/
- JD-GUI: Java decompiler. http://jd.benow.ca/
- Kaleidoscope: File comparison. http://kaleidoscopeapp.com/
- LittleIpsum: Fast lorem ipsum text generation. http://littleipsum.com/
- MAMP: Run a local server on OS X. http://www.mamp.info/en/index.html
- MenuMeters: CPU and Mem monitor in menu bar. http://www.ragingmenace.com/software/menumeters/
- Navicat Premium Essentials: Multi-Database GUI. https://itunes.apple.com/us/app/navicat-premium-essentials/id466416967?mt=12
- Quicksilver: Application launcher. http://qsapp.com/
- SelfControl: Block distractions for a set amount of time. http://selfcontrolapp.com/
- Sip: Get the Hex Code for any color you need. https://itunes.apple.com/us/app/sip/id507257563?mt=12
- Skitch: Screenshot and annotation tool. http://evernote.com/skitch/
- SourceTree: Git and Mercurial GUI client. http://www.sourcetreeapp.com/
- SQLite Professional: SQLite and Core Data UI. https://itunes.apple.com/us/app/sqlite-professional/id586001240?mt=12
- Sublime Text: Sophisticated text editing. http://www.sublimetext.com/
- The Unarchiver: Replacement for Archive Utility. https://itunes.apple.com/us/app/the-unarchiver/id425424353?mt=12
- Total Finder: Tabs, Dual Pane, Cut and Paste, etc. http://totalfinder.binaryage.com/
- VirtualBox: Parallel virtualization. https://www.virtualbox.org/
- XCode: IDE for creating apps for Mac, iPhone, and iPad. https://developer.apple.com/xcode/
- Xee: Image viewer for a bunch of image formats. http://xee.c3.cx/
- XQuartz: X-windowing on OS X. https://xquartz.macosforge.org/landing/
How to Contribute:
- Edit