forked from NS007-dev/webdevbook
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcodeequip.html
142 lines (127 loc) · 5.29 KB
/
codeequip.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="icon" href="./favicon.png" />
<title> Web Dev Book 📚</title>
<link rel="stylesheet" type="text/css" href="codeequip.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="header">
<div class="logo">
<img src="./favicon.png" />
</div>
<h1>
Web Dev Book 📚
</h1>
<h3> The equipment you need to write the code! </h3>
</div>
<div class="topnav">
<a href="./index.html">Home 🏡</a>
<a href="./codeequip.html"> Code equipment 💼 </a>
<a href="./links.html">Links and resources 🔗</a>
<a href="./github.html"> GitHub Sign Up</a>
<a href="./ghubprep.html"> GitHub Basics.</a>
<a href="./js.html">JavaScript Links.</a>
<a href="./html.html">HTML Links.</a>
<a href="./css.html">CSS Links.</a>
</div>
<div class="row">
<div class="leftcolumn">
<div class="card">
<h2>
To begin coding, you need to have software to play and write code...
</h2>
<h3>
The code canvas!
</h3>
<img src="./images/vscode.png" width="950" height="480" />
</h3>
<p>
<b> 🤔 What is VScode? 🤔</b>
</p>
<p>
VScode, made by the <i>Microsoft Cooperation, </i> is a code editor, where developers build and write their desired code, in all the different code languages!
</p>
<h3>
See below for a walk through on how to set up your own VScode.
</h3>
</div>
<div class="card">
<h2>
Download VScode 🔽:
</h2>
<h3>
<i>Click the button below to go to the official VScode website, to download!</i>
</h3>
<a href="https://code.visualstudio.com/download">Download the official VScode!</a>
<p>
Choose the correct computer software, whether you are a linux/apple/windows user, then download.
</p>
</div>
<div class="card">
<h2>
The process:
</h2>
<h3>
<i> The downloading and what to do after:</i>
</h3>
<a href="https://code.visualstudio.com/docs/setup/windows">See the official VScode website for details after downloading.</a>
</div>
<div class="card">
<h2> Extra VScode resources:</h2>
<table>
<tr>
<th>Resource 📚: </th>
<th>Description 🖊️</th>
</tr>
<tr>
<td> 🎯 <a href="https://code.visualstudio.com/docs/introvideos/basics"> VScode videos and shortcuts.</a></td>
<td> See the videos on how to use VScode and keyboard shortcuts.</td>
</tr>
<tr>
<td> 🎯 <a href="https://adamtheautomator.com/visual-studio-code-tutorial/">All you need about VScode</a></td>
<td> Here is an article about all things VScode. From the command pallette to the settings.</td>
</tr>
<tr>
<td> 🎯 <a href="https://github.com/microsoft/vscode">VScode GitHub repository.</a></td>
<td> The code of VScode, where others ask questions, and contribute to their codes.</td>
</tr>
</table>
</div>
</div>
<div class="rightcolumn">
<div class="card">
<h2>
Our personal Favourite resource... 🤩
</h2>
<img src="./images/w3.jpg" style="height: 200px; width: 275px;" />
<h3>With all the code examples, and docs, see here:</h3>
<a href="https://www.w3schools.com/" class="button">W3 Schools</a>
</div>
<div class="card">
<h3>
See the official documentation:
</h3>
<p>Want to see the latest releases in documentation? Click the image below for mozilla web docs!</p>
<a href="https://developer.mozilla.org/en-US/"><img src="./images/mozilla.jpg" /></a>
<h3>
See frequently asked code questions...
</h3>
<p>Stackoverflow, the home of code questions!</p>
<a href="https://stackoverflow.com/"><img src="./images/stackoverflow.png" /></a>
<h3>Welcome to your coding journey! 🎒</h3>
<p>Enjoy learning to code!</p>
<img src="./images/enjoy.png" />
</div>
</div>
</div>
<div class="footer">
<img src="./favicon.png" style="height: 100px; width: 100px; float: left;" />
<h2>
Web Dev Book!
</h2>
</div>
</body>
</html>
</html>