-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathunit2.html
More file actions
261 lines (219 loc) · 9.93 KB
/
unit2.html
File metadata and controls
261 lines (219 loc) · 9.93 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>eduPLEX: AP Computer Science Unit 2</title>
<!-- Google font -->
<link href="https://fonts.googleapis.com/css?family=Lato:700%7CMontserrat:400,600" rel="stylesheet">
<!-- Bootstrap -->
<link type="text/css" rel="stylesheet" href="css/bootstrap.min.css"/>
<!-- Font Awesome Icon -->
<link rel="stylesheet" href="css/font-awesome.min.css">
<!-- Custom stlylesheet -->
<link type="text/css" rel="stylesheet" href="css/style.css"/>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Header -->
<header id="header" class="transparent-nav">
<div class="container">
<div class="navbar-header">
<!-- Logo -->
<div class="navbar-brand">
<a class="logo" href="index.html">
<img src="./img/logo-alt.png" alt="logo">
</a>
</div>
<!-- /Logo -->
<!-- Mobile toggle -->
<button class="navbar-toggle">
<span></span>
</button>
<!-- /Mobile toggle -->
</div>
<!-- Navigation -->
<nav id="nav">
<ul class="main-menu nav navbar-nav navbar-right">
<li><a href="index.html">Home</a></li>
<li><a href="index.html#courses">Learn</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav>
<!-- /Navigation -->
</div>
</header>
<!-- /Header -->
<!-- Hero-area -->
<div class="hero-area">
<!-- Backgound Image -->
<div class="bg-image bg-parallax overlay" style="background-image:url(./img/page-background.jpg)"></div>
<!-- /Backgound Image -->
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1 text-center">
<ul class="hero-area-tree">
<li><a href="index.html#courses">Learn</a></li>
<li>Unit 2</li>
</ul>
<h1 class="white-text">Basics of Software Engineering</h1>
</div>
</div>
</div>
</div>
<!-- /Hero-area -->
<!-- Blog -->
<div id="blog" class="section">
<!-- container -->
<div class="container">
<!-- row -->
<div class="row">
<!-- main blog -->
<div id="main" class="col-md-9">
<h2>
What Is Software Engineering?
</h2>
<bodytext>
In order to get a more "big picture" view of computer science, let's take a moment to understand what software engineering is.
</bodytext>
<br>
<h3>
Roles of a Software Engineer
</h3>
<bodytext>
When we think about potential careers that come out of computer science, the most common one is being a software engineer. In this video, we'll take a moment to break down the details of what exactly it means to be a software engineer, ranging from what they consider when they write code to how they stay up-to-date with the ever-changing world of tech.
</bodytext>
<br>
<iframe width="560" height="315" src="https://www.youtube.com/embed/F1evpqD6MaE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<bodytext>
So looks like software engineers have a lot on their plate! Keep these things in mind as you begin your own venture into software engineering. Now, we'll shift to something a little more technical aspect of software engineering: the levels at which computer code exists.
</bodytext>
<br>
<h2>
The Levels of Computer Code
</h2>
<bodytext>
When we say that software engineers write "code", that's actually a pretty vague statement. This is because there are many levels at which computer code exists. It could be something as low-level as programming an individual circuit to light up a car's tail-light in a special pattern, or something as high-level as designing a machine learning model to recognize handwritten characters.
</bodytext>
<br>
<h3>
From Assembly to High-Level Languages
</h3>
<bodytext>
In the next few videos, we'll build from the ground up: from low-level machine and assembly languages to high-level programming languages.
</bodytext>
<br>
<iframe width="560" height="315" src="https://www.youtube.com/embed/lDIMDGzpUhI" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<br>
<bodytext>
So looks like there's a connection between these levels of software. Let's explore that further by understanding compilers and interpreters.
</bodytext>
<br>
<h3>
Compilers and Interpreters
</h3>
<bodytext>
When a software engineer writes code in a high-level language like Java, it has to get converted all the way down to machine language (which is just strings of binary) for the computer to understand. This is accomplished by compilers and interpreters, which both do the same job, just in two slightly different ways.
</bodytext>
<br>
<iframe width="560" height="315" src="https://www.youtube.com/embed/NLLuE0OXMjg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<br>
<bodytext>
To review, the difference between compilers and interpreters lies in how they translate and execute code. Compilers translate all the source code into machine language at once, saving the resulting machine code as an executable. This executable file can then get shipped out to a user and be executed all at once. Interpreters, on the other hand, translate and execute the source code at the same time. This means that you need to actually have the source code when you want to execute the program, unlike compilers, which can just send out the machine code executable file.
</bodytext>
<br>
<h3>
Bytecode and the Java Virtual Machine
</h3>
<bodytext>
Java is unique because it doesn't use just a compiler or just an interpreter — it uses both! Let's dive in to this mixed compiler-interpreter approach and see how it actually works.
</bodytext>
<iframe width="560" height="315" src="https://www.youtube.com/embed/QOrCdkqd0jQ" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<br>
<bodytext>
Java's bytecode approach was developed for efficiency, particularly for efficiency over the Internet. (Just-in-time compilers are also another example of improving efficiency.) You'll soon find that this is a recurring theme in computer science!
</bodytext>
<br>
<h3>
The Reusability of Code
</h3>
<bodytext>
Our last topic in this overview of software engineering is something very practical: the reusability of code. Let's dive in.
</bodytext>
<br>
<iframe width="560" height="315" src="https://www.youtube.com/embed/2M7a3QA4Mb4" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<br>
<bodytext>
The biggest takeaway from this video should be that when you write code, it should be clear and easy for someone else to read and reuse. In the next unit, we'll explore some specifics of Java.
</bodytext>
<div align="right">
<a class="main-button icon-button" href="unit3.html">Unit 3</a>
</div>
</div>
<!-- /main blog -->
</div>
<!-- row -->
</div>
<!-- container -->
</div>
<!-- /Blog -->
<!-- Footer -->
<footer id="footer" class="section">
<!-- container -->
<div class="container">
<!-- row -->
<div class="row">
<!-- footer logo -->
<div class="col-md-6">
<div class="footer-logo">
<a class="logo" href="index.html">
<img src="./img/logo.png" alt="logo">
</a>
</div>
</div>
<!-- footer logo -->
<!-- footer nav -->
<div class="col-md-6">
<ul class="footer-nav">
<li><a href="index.html">Home</a></li>
<li><a href="index.html#courses">Learn</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
<!-- /footer nav -->
</div>
<!-- /row -->
<!-- row -->
<div id="bottom-footer" class="row">
<!-- social -->
<div class="col-md-4 col-md-push-8"></div>
<!-- /social -->
<!-- copyright -->
<div class="col-md-8 col-md-pull-4">
<div class="footer-copyright">
<span>© Copyright 2018. All Rights Reserved. | This template is made with <a href="https://colorlib.com">Colorlib</a></span>
</div>
</div>
<!-- /copyright -->
</div>
<!-- row -->
</div>
<!-- /container -->
</footer>
<!-- /Footer -->
<!-- preloader -->
<div id='preloader'><div class='preloader'></div></div>
<!-- /preloader -->
<!-- jQuery Plugins -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>