1 of 12

EA Software Engineers

EA Hackathon

Setting Up Your Dev Environment

2 of 12

What is it?

Configuring your laptop for development

local machine

📍 http://www.linfo.org/local_machine.html

3 of 12

4 of 12

What is it… actually?

…it depends

When it comes to how you create a development

environment, it depends on the specifics of your needs,

the dependencies your code relies on, the size of your

team, the maturity of your infrastructure, and so on.

With the popularization of Docker, it became relatively easy to create on-demand, reproducible environments that you can fire up by running a single command. You could have, for instance, a setup composed of three images: one for your back-end API, another for your front-end app that consumes that API, and a third one for the database.

In its most basic form, the development environment is simply the developer’s machine itself.

When it comes to how you create a development

environment, it depends on the specifics of your needs,

the dependencies your code relies on, the size of your

team, the maturity of your infrastructure, and so on.

In its most basic form, the development environment is simply the developer’s machine itself.

With the popularization of Docker, it became relatively easy to create on-demand, reproducible environments that you can fire up by running a single command. You could have, for instance, a setup

composed of three images: one for your back-end API, another for your front-end app that consumes that API, and a third one for the database.

5 of 12

Where to write your code

6 of 12

IDE (integrated development environment)

lots of options – which is best?

7 of 12

https://code.visualstudio.com/download

8 of 12

Integrated Terminal

Helpful toolbar

files

tabs containing open files

Helpful tools (e.g., universal search)

Code (e.g., JavaScript)

Code previewer

9 of 12

Shortcuts

Extensions

Cmd+I – show autocomplete options

Cmd+Shift+P – open Command Palette (>)

Cmd+P – open file

Cmd+, – open Settings

Cmd+K O – open current file in its own window

Cmd+K R – show where current file is located in Explorer

Cmd+K P – copy path of active file

Cmd+Shift+T – reopen a closed tab

You can add your own!!

Cmd+K Cmd+S – open Keyboard Shortcuts

Snippets – shortcuts, press tab to expand

(i.e., globalSnippets.code-snippets)

10 of 12

Bonus!

11 of 12

Package Management

12 of 12

Stack Overflow