-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathprepare-for-your-training.html
6 lines (6 loc) · 13 KB
/
prepare-for-your-training.html
1
2
3
4
5
6
<!doctype html><html lang=en><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=description content="Attending one of our workshops? This guide will help you setting up your machine, so you're all set up!"><meta name=viewport content="width=device-width,initial-scale=1"><title>Prepare for your training</title><meta name=google-site-verification content=o9eGPEgIETEqYGombq7NiQuBIB_qa6gz1yAL7PxKyK0><meta name=mobile-web-app-capable content=yes><meta name=theme-color content=#384c54><link rel=icon sizes=192x192 href=assets/images/touch/chrome-touch-icon-192x192.png><meta name=apple-mobile-web-app-capable content=yes><meta name=apple-mobile-web-app-status-bar-style content=black><meta name=apple-mobile-web-app-title content=thoughtram><link rel=apple-touch-icon href=assets/images/touch/apple-touch-icon.png><meta name=msapplication-TileImage content=assets/images/touch/ms-touch-icon-144x144-precomposed.png><meta name=msapplication-TileColor content=#384c54><meta property=og:locale content=en_US><meta property=og:type content=website><meta property=og:description content="Attending one of our workshops? This guide will help you setting up your machine, so you're ready when the class starts."><meta property=og:url content=http://thoughtram.io><meta property=og:image content=http://thoughtram.io/assets/images/background-ng-connect_desktop.jpg><meta property=twitter:card content=summary_large_image><meta property=twitter:title content="Prepare for your training"><meta property=twitter:site content=thoughtram.io><link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel=stylesheet><link rel=stylesheet href=styles/main.css><body id=debug class=thtrm-page itemscope itemtype=http://schema.org/WebPage><noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-PMLVSW" height=0 width=0 style=display:none;visibility:hidden></iframe></noscript><script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-PMLVSW');</script><header class=thtrm-banner role=banner><a href=/ title=Home><img src=images/next/logo.svg alt=thoughtram class=thtrm-logo title="The thoughtram logo"></a><nav id=thtrm-nav-main class=thtrm-nav role=navigation itemscope itemtype=http://www.schema.org/SiteNavigationElement><button class="thtrm-button--ghost thtrm-nav__button" id=thtrm-nav-button aria-expanded=false aria-label=Menu aria-controls=thtrm-nav-main-list><span aria-hidden=true>Menu <svg class=thtrm-icon><use xlink:href=#icon--chevron-down /></svg></span></button><ul id=thtrm-nav-main-list class=thtrm-nav__list><li><a title=Training href=/training.html>Training</a><li><a title=Consulting href=/code-review.html>Consulting</a><li><a title=Blog href=https://blog.thoughtram.io>Blog</a></ul></nav></header><main class=thtrm-main role=main><section class="thtrm-section u-flex--nowrap"><div class=thtrm-section__item--halfpadded><h1 class=thtrm-section__heading>Prepare for your training</h1><p class=thtrm-section__paragraph>This preparation guide helps you setting up your machine so you're ready for your upcoming training!</div><div class=thtrm-section__item--flushright><div class="thtrm-section__image thtrm-ratio--landscape"><img srcset="images/next/prepare.jpg 600w" sizes="(min-width: 700px) 40vw,
90vw" src=images/next/prepare.jpg alt=""></div></div></section><section class="thtrm-section--fullbleed-intrinsic u-bg-lightgray"><div class="thtrm-section__heading u-max-width--half"><h2 class=thtrm-section__subheading>Preparation Guide</h2><p>This is the <i>thougtram Preparation Guide</i> to get you and your machine ready for your next training. Depending on what training you'll attend, the setup and prerequisites might be different, as we're using different tools to give you the best experience possible. Some tools are also rather optional as they'd ease the overall training flow but aren't necessary to attend or follow our training.</p><br><p>Please read the following guides depending on which class you're going to join:</p><br><h3>Git Master Class</h3><br><ol><li><a href=#github-account title="Create a GitHub Account">Create a GitHub account</a><li><a href=#git title="Git guide">Git</a></ol><br><h3>Angular Master Class</h3><br><ol><li><a href=#github-account title="Create a GitHub Account">Create a GitHub account</a><li><a href=#git title="Git guide">Git</a><li><a href=#node title="Node guide">Node.js/npm</a><li><a href=#ng-cli title="Angular CLI guide">Angular CLI</a><li><a href=#a2mc-starter title="Angular Master Class Starter Kit">Angular Master Class Starter Kit</a></ol><br><hr><br><h2 id=github-account>Create a GitHub account</h2><br><p>To provide you the best experience possible, we're using Git repositories that you can easily clone and review during the classes but also once the class is over. Our respositories are hosted on <a href=http://github.com title=GitHub.com>GitHub</a> and are private. To give you access to these repositories we'll ask you for your GitHub username, so please go ahead and create a GitHub account.</p><br><hr><br><h2 id=git>Git</h2><br><p>Git is a version control system that we use to manage and maintain the code of our entire training material, including slides, exercises, exercise descriptions and solutions. Thus, there are a couple of repositories for each training class you might want to install on your machine to have a smooth experience.</p><br><h3 id=installing-git>Installing Git</h3><br><p>Installing Git is easy. Simply head over to <a href=http://git-scm.com/download title="Git downloads">git-scm.com/download</a> and download the latest binary for your platform.</p><br><img src=assets/images/guide-git-1.png alt="Git download page"><p>Once you've downloaded the binary, execute the installer so Git will be installed on you machine. This will set up the command line tool for Git. After the installation is finished, open your terminal (for Windows users we recommend <strong>Git Bash</strong> which comes with the dedicated installer) and type <code>git --help</code>. This will output the help for Git's most common commands. If you see the same as what is shown in the following figure, Git is installed on your machine and runs properly.</p><br><img src=assets/images/guide-git-2.png alt="Git in the terminal"><hr><br><h2 id=node>Node.js/npm</h2><br><p>Node.js is JavaScript runtime built on Chrome's V8 JavaScript engine. npm is the largest package ecosystem of open source libraries in the world. We use node to run webservers and build scripts, as those are written in JavaScript, and npm to install needed dependencies for our exercises.</p><br><h3 id=installing-git>Installing Node.js and npm</h3><br><p>To install Node and npm on your machine, grab the latest binary from <a href=https://nodejs.org/en/download/ title="Nodejs downloads">nodejs.org/en/download</a> and execute the installer. Follow the assistent's instructions, the installation process might take a while.</p><br><img src=assets/images/guide-node-1.png alt="Node.js download page"><p><strong>Make sure you have a version installed that is >= 9.x</strong> to avoid weird problems during the training (we know, the screenshot shows <code>4.x</code> but we really need <code>>=9.x</code>). To check your node version, simply run <code>node -v</code> in your terminal.</p><br><img src=assets/images/guide-node-2.png alt="Node.js version"><p>You should now have also npm installed. To double check, run <code>npm -v</code> in your terminal (<strong>this should be >=5.x</strong>).</p><br><img src=assets/images/guide-node-3.png alt="npm version"><p>Cool, Node and npm are running on your machine!</p><br><hr><br><h2 id=ng-cli>Angular CLI</h2><br><p>For this guide, you need to have Node.js installed first. If you don't have it yet, go and read our guide on <a href=#installing-node title="Installing Node">installing Node</a>.</p><br><p>Throughout the Angular Master Class, we use the official Angular command line interface to scaffold the application, generate components, services and compile and run the code. We think it's the best experience you can get when devolping Angular application, as it takes a lot of hassle away from you by providing many powerful tools and an optimized build process which even lets you easily deploy your application on GitHub.<h3>Installing Angular CLI</h3><p>To install Angular CLI on your machine, execute <code>npm install -g @angular/cli</code> in your terminal of choice.</p><br><h2 id=a2mc-starter>Angular Master Class Starter Kit</h2><br><p>For this guide, you need to have Git installed first. If you don't have it yet, go and read our guide on <a href=#installing-git title="Installing Git">installing Git</a>.</p><br><p>To get started quickly at our training, we've prepared a starter kit repository that you'll use to build your application during the class. You can download or <code>git clone</code> the repository from <a href=https://github.com/thoughtram/angular-master-class-starter title="Angular Master Class Starter Kit">github.com/thoughtram/angular-master-class-starter</a>.</p><br><img src=assets/images/guide-a2mc-starter-1.png alt="Terminal that shows how to clone the starter kit repository"><p>The repository comes with a scaffolded Angular application structure that was generated using Angular CLI, hence, this application can be run using the usual Angular CLI commands like <code>ng serve</code>. However, make sure to install its dependencies first by running <code>npx yarn install</code>.</div></section></main><aside class=thtrm-aside role=complementary><section class="thtrm-section--centered thtrm-section--unpadded-bottom u-flex--justify-center"><h1 class=thtrm-section__heading--small>Get notified about upcoming classes and news</h1><form class=thtrm-form action="//thoughtram.us8.list-manage.com/subscribe/post?u=dfbb1507fbced5a20d9dc5698&id=731f22cdca" method=post id=mc-embedded-subscribe-form name=mc-embedded-subscribe-form target=_blank novalidate><label class=thtrm-form__label for=thtrm-newsletter aria-hidden=true>Your email</label> <input type=email class=thtrm-form__input--text id=thtrm-newsletter name=EMAIL placeholder="Your email address..." required><div class=u-offscreen-text><label class=thtrm-form__label for=thtrm-newsletter-text aria-hidden=true>Your email</label> <input id=thtrm-newsletter-text placeholder="Your email …" name=b_dfbb1507fbced5a20d9dc5698_731f22cdca tabindex=-1></div><input type=submit value="Notify me" name=subscribe class="thtrm-form__button thtrm-button" aria-label="Notify me"><p class=thtrm-form__info-text>Information on the performance measurement included in the consent, the use of the mail service provider MailChimp and on the logging of the registration and your rights of revocation can be found in our <a href=/imprint.html title="Privacy Statement">data protection declaration</a>.</form></section></aside><footer class=thtrm-footer role=contentinfo><section class=thtrm-sitemap><div class=thtrm-sitemap__item><h2 class=thtrm-sitemap__heading>Company</h2><nav class=thtrm-sitemap__nav role=navigation><ul><li><a title="Read our high quality articles" href=https://blog.thoughtram.io>Blog</a><li><a title="Learn more about thoughtram training" href=/training.html>Training</a><li><a title="Learm more about Angular Master Class" href=/angular-master-class.html>Angular Master Class</a><li><a title="Learn more about Git Master Class" href=/git-master-class.html>Git Master Class</a><li><a title="Learn more about RxJS Master Class" href=/rxjs-master-class.html>RxJS Master Class</a><li><a title="Learn more about Consulting and Code Review" href=/code-review.html>Consulting and Code Review</a><li><a title="Read our Code of conduct" href=/code-of-conduct.html>Code of Conduct</a></ul></nav></div><div class=thtrm-sitemap__item><h2 class=thtrm-sitemap__heading>Community</h2><nav class=thtrm-sitemap__nav role=navigation><ul><li><a title="thoughtram on Twitter" href=https://twitter.com/thoughtram>Twitter</a><li><a title="thoughtram on Facebook" href=https://facebook.com/thoughtram>Facebook</a><li><a title="thoughtram on GitHub" href=https://github.com/thoughtram>Github</a></ul></nav></div></section><div class=thtrm-copyright><a href=/imprint.html>Legal Notice</a><p>© 2014-2020 thoughtram GmbH</div></footer><svg xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink style=display:none><symbol viewBox="0 0 24 24" id=icon--chevron-right><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"/><path d="M0 0h24v24H0z" fill=none /></symbol><symbol viewBox="0 0 24 24" id=icon--chevron-down><path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z"/><path d=M0-.75h24v24H0z fill=none /></symbol><symbol viewBox="0 0 24 24" id=icon--menu><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/><path d="M0 0h24v24H0z" fill=none /></symbol></svg><script src=https://cdnjs.cloudflare.com/ajax/libs/object-fit-images/3.2.3/ofi.min.js></script><script src=scripts/main.min.js></script>