SETUP
Tags: webdev, career, workstations
Published: 2020-03-12 13:06:19

 <p>For my second article, I decided to make a list of everything I use from hardware, software, and extensions to be as productive as possible as a UI developer.</p>
  <h2>HARDWARE:</h2>
  <ul>
    <li><a href="https://www.computeruniverse.net/de/apple-macbook-pro-154-mv902da-i7-2616256-gb-touchbar-rp555x-spacegrau">MacBook Pro 15"</a>(2019) - never leaves the office</li>
    <ul>
      <li>i7 2,66GHz 6C</li>
      <li>16 GB DDR4</li>
      <li>Radeon Pro 555X</li>
      <li>256 GB SSD</li>
    </ul>
    <li><a href="https://everymac.com/systems/apple/macbook_pro/specs/macbook-pro-core-i5-2.7-13-early-2015-retina-display-specs.html">MacBook Pro 13”</a>(2015) - in a backpack that is always with me</li>
    <ul>
      <li>i5 2,7GHz 2C</li>
      <li>16 GB DDR3</li>
      <li>Intel Iris Graphics 6100</li>
      <li>256 GB SSD</li>
    </ul>
    <li><a href="https://www.computeruniverse.net/de/lg-34uc99-w">LG 34UC99</a> UltraWide Curved monitor</li>
    <li><a href="https://www.computeruniverse.net/de/logitech-mx-master-2s-graphit">Logitech MX Master 2S</a> </li>
    <li><a href="https://satechi.net/collections/peripherals-1/products/compact-backlit-bluetooth-keyboard">SATECHI Compact Backlit Bluetooth keyboard</a></li>
    <li><a href="https://satechi.net/collections/stands-mounts/products/satechi-classic-monitor-stand">SATECHI Classic Monitor Stand</a></li>
    <li><a href="https://satechi.net/collections/stands-mounts/products/satechi-lightweight-aluminum-portable-laptop-stand-for-laptops-notebooks-and-tablets?variant=27141044489">SATECHI Aluminium Laptop Stand</a></li>
    <li><a href="https://www.workbrands.com/en/herman-miller-refurbished-herman-miller-mirra-grap.html">Herman Miller Mirra | Graphite</a></li>
  </ul>
  <h2>SOFTWARE:</h2>
  <ul>
    <li><a href="https://www.google.com/chrome/">Chrome</a></li>
    <li><a href="http://compass-style.org/">Compass</a></li>
    <li><a href="https://www.dropbox.com/">Dropbox</a></li>
    <li><a href="https://justgetflux.com/">f.lux</a></li>
    <li><a href="https://filezilla-project.org/">FileZilla</a></li>
    <li><a href="https://www.figma.com/">Figma</a></li>
    <li><a href="https://www.mozilla.org/en-US/">Firefox</a></li>
    <li><a href="https://giphy.com/apps/giphycapture">GIPHY Capture</a></li>
    <li><a href="https://app.grammarly.com/">Grammarly</a></li>
    <li><a href="https://www.iterm2.com/">iTerm2</a></li>
    <ul>
      <li><a href="https://ohmyz.sh/">zsh</a></li>
    </ul>
    <li><a href="https://www.libreoffice.org/download/download/">LibreOffice</a></li>
    <li><a href="https://app.prntscr.com/en/index.html">LightShot</a></li>
    <li><a href="https://localwp.com/">Local By Flywheel</a></li>
    <li><a href="https://www.logitech.com/en-us/product/options">Logi Options</a></li>
    <li><a href="https://www.opera.com/">Opera</a></li>
    <li><a href="https://www.adobe.com/products/photoshop.html">Photoshop</a></li>
    <li><a href="https://www.postman.com/">Postman</a></li>
    <li><a href="https://www.apple.com/safari/">Safari</a></li>
    <li><a href="https://www.skype.com/en/">Skype</a></li>
    <li><a href="https://slack.com/intl/en-hr/">Slack</a></li>
    <li><a href="https://www.spectacleapp.com/">Spectacle</a></li>
    <li><a href="https://trello.com/">Trello</a></li>
    <li><a href="https://www.viber.com/download/">Viber</a></li>
    <li><a href="https://code.visualstudio.com/">Visual Studio Code</a></li>
    <li><a href="https://www.whatsapp.com/">WhatsApp</a></li>
    <li><a href="https://zeplin.io/">Zepelin</a></li>
    <li><a href="https://www.zoolz.com/">Zoolz</a></li>
    <li><a href="https://zoom.us/">Zoom</a></li>
  </ul>
  <h2>VISUAL STUDIO CODE EXTENSIONS:</h2>
  <ul>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=bierner.emojisense">:emojisense:</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag">Auto Rename Tag</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify">Beautify</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=wmaurer.change-case">change-case</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=anseki.vscode-color">Color Picker</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig">EditorConfig for VS Code</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint">ESLint</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens">GitLens</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css">HTML CSS Support</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion">IntelliSense for CSS class name</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass">Live Sass Compiler</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer">Live Server</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=brapifra.phpserver">PHP Server</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=alefragnani.project-manager">Project Manager</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=Syler.sass-indented">Sass</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=adamwalzer.scss-lint">scss-lint</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync">Settings Sync</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=jock.svg">SVG</a></li>
    <li><a href="https://marketplace.visualstudio.com/items?itemName=cssho.vscode-svgviewer">SVG Viewer</a></li>
  </ul>
  <h2>BROWSER EXTENSIONS:</h2>
  <ul>
    <li><a href="https://chrome.google.com/webstore/detail/fonts-ninja/eljapbgkmlngdpckoiiibecpemleclhh">Fonts Ninja</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/adblock-plus-free-ad-bloc/cfhdojbkjhnklbpkdaibdccddilifddb">Adblock Plus - free ad blocker</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/code-formatter/deecjbhfakhcegonhediiniinjdgmfie">Code Formater</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/eye-dropper/hmdcmlfkchdmnmnmheododdhjedfccka">Eye Dropper</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/fonts-ninja/eljapbgkmlngdpckoiiibecpemleclhh">Fonts Ninja</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/grammarly-for-chrome/kbfnbcaeplbcioakkpcpgfkobkghlhen">Grammarly for Chrome</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/privacy-pass/ajhmfdgkijocedmfjonnpjfojldioehi">Privacy Pass</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/quick-source-viewer/cfmcghennfbpmhemnnfjhkdmnbidpanb">Quick source viewer</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/svg-grabber-get-all-the-s/ndakggdliegnegeclmfgodmgemdokdmg">svg-grabber</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/stylish-custom-themes-for/fjnbnpbmkenffdnngjfgmeleoegfcffe">Stylish</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/visbug/cdockenadnadldjbbgcallicgledbeoc">VisBug</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg">Wappalyzer</a></li>
    <li><a href="https://chrome.google.com/webstore/detail/zoom-scheduler/kgjfgplpablkjnlkjmjdecgdpfankdle">Zoom Scheduler</a></li>
  </ul>