-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
214 lines (195 loc) · 9.11 KB
/
index.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
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
---
layout: home
title: Julio Casal | Helping .NET developers reach the next level
---
<!-- Header -->
<header id="header" class="header">
<div class="container">
<div class="row justify-content-center mb-4">
<div class="col-lg-5 order-lg-2">
<div class="image-container">
<img class="img-fluid rounded" src="images/roadmap-screenshot.png" alt="alternative">
</div> <!-- end of image-container -->
</div> <!-- end of col -->
<div class="col-lg-7 order-lg-1">
<div class="container" style="text-align: left;">
<div class="row mt-4">
<div class="col">
<div class="text-container">
<h1 class="h2-heading" style="text-align: left;">Free .NET Backend Developer Roadmap
</h1>
<p class="line-spaced-paragraph white">
An interactive guide with <strong>110+ topics</strong> that link to the best
resources on the web to update your .NET backend development skills.
</p>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col">
<script async data-uid="07fed555f1"
src="https://juliocasal.ck.page/07fed555f1/index.js"></script>
</div> <!-- end of text-container -->
</div> <!-- end of div -->
</div> <!-- end of div -->
</div> <!-- end of row -->
</div>
</div> <!-- end of container -->
<svg class="header-decoration" data-name="Layer 3" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none"
viewBox="0 0 1920 305.139">
<defs>
<style>
.cls-1 {
fill: #ffffff;
}
</style>
</defs>
<title>header-decoration</title>
<path class="cls-1"
d="M1486.486,36.773C1434.531,13.658,1401.068-5.1,1329.052,1.251c-92.939,8.2-152.759,70.189-180.71,89.478-23.154,15.979-134.286,104.091-171.753,128.16-50.559,32.48-98.365,59.228-166.492,67.5-67.648,8.21-124.574-6.25-152.992-18-42.218-17.454-42.218-17.454-90-39-35.411-15.967-81.61-34.073-141.58-34.054-116.6.037-262.78,77.981-354.895,80.062C53.1,275.793,22.75,273.566,0,260.566v44.573H1920V61.316c-36.724,23.238-76.008,61.68-177,65C1655.415,129.2,1556.216,67.8,1486.486,36.773Z"
transform="translate(0 0)" />
</svg>
</header> <!-- end of header -->
<!-- end of header -->
<!-- The Tech -->
<div class="basic-1">
<div class="container">
<div class="row mt-4">
<div class="col">
<div class="image-container" style="display:flex;align-items: center;height: 100%;">
<img class="img-fluid" src="images/tech-logos.png" alt="alternative">
</div> <!-- end of image-container -->
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of basic-1 -->
<!-- end of The Tech -->
<div id="dotnet-bootcamp" class="basic-1">
<div class="container">
<div class="row">
<div class="col-lg-6 text-center featured-product">
<div class="image-container">
<img class="img-fluid rounded" src="images/bootcamp-Box_Mockup.png" width="70%"
alt=".NET Cloud Developer Bootcamp">
</div> <!-- end of image-container -->
<div class="text-container mt-5 mr-0">
<p class="line-spaced-paragraph" style="font-size: 1.4rem;">A complete blueprint for C# developers
who need to build production
ready .NET applications for the Azure cloud at scale.</p>
</div> <!-- end of text-container -->
<a class="btn-solid-lg page-scroll mt-3" href="/courses/dotnetbootcamp">Learn More</a>
</div> <!-- end of col -->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of basic-1 -->
<div id="newsletter-recent" class="basic-1">
<div class="container">
<div class="row mt-5">
<div class="col">
<h2 class="h2-heading" style="margin-bottom: 2rem;">RECENT NEWSLETTER ISSUES</h2>
</div> <!-- end of col -->
</div> <!-- end of row -->
<div class="row justify-content-center">
{% if site.paginate %}
{% assign posts = paginator.posts %}
{% else %}
{% assign posts = site.posts %}
{% endif %}
{%- if posts.size > 0 -%}
{%- if page.list_title -%}
<h2 class="post-list-heading">{{ page.list_title }}</h2>
{%- endif -%}
{%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
{%- for post in posts limit:3 -%}
<div class="col-md-4 mb-4">
<div class="card course h-100" style="transition: box-shadow 0.2s ease-in-out;">
<div class="card-image">
{% if post.featured-image %}{% include post-featured-image.html image=post.featured-image
alt=post.featured-image-alt %}{% endif %}
</div>
<div class="card-body">
<a style="text-decoration: none;" href="{{ post.url | relative_url | remove: '.html' }}">
<h5 style="font-weight: 600;" class="course-title">{{ post.title | escape }}</h5>
</a>
<span class="post-meta">{{ post.date | date: date_format }}</span>
{%- if site.show_excerpts -%}
{{ post.excerpt }}
{%- endif -%}
</div>
</div> <!-- end of card -->
</div>
{%- endfor -%}
{%- endif -%}
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of newsletter-recent -->
<!-- Recent Youtube Videos -->
<div id="youtube-videos" class="basic-1">
<div class="container">
<div class="row mt-4">
<div class="col">
<h2 class="h2-heading" style="margin-bottom: 2rem;">LATEST FROM THE CHANNEL</h2>
</div> <!-- end of col -->
</div> <!-- end of row -->
<div id="video-container" class="row justify-content-center">
</div>
</div> <!-- end of container -->
</div> <!-- end of youtube-videos -->
<!-- Problem Statement -->
<div id="newsletter-subscribe" class="basic-1">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8">
<script async data-uid="b314fa2e8e" src="https://juliocasal.ck.page/b314fa2e8e/index.js"></script>
</div> <!-- end of col-->
</div> <!-- end of row -->
</div> <!-- end of container -->
</div> <!-- end of cards-1 -->
<!-- end of description -->
<!-- YouTube API Script -->
<script src="https://apis.google.com/js/api.js"></script>
<script>
function loadYouTubeVideos()
{
gapi.client.init({
'apiKey': 'AIzaSyBvNkb5hBiWySW2e0ilN11r6nVQjcWod10'
}).then(function ()
{
return gapi.client.request({
'path': 'https://www.googleapis.com/youtube/v3/search',
'params': {
'part': 'snippet',
'channelId': 'UCw8aBxRvQ2ksWNFuO5eHdmA',
'order': 'date',
'maxResults': 3
}
});
}).then(function (response)
{
var videos = response.result.items;
var videoContainer = document.getElementById('video-container');
videos.forEach(function (video)
{
var videoId = video.id.videoId;
var videoTitle = video.snippet.title;
var videoThumbnail = video.snippet.thumbnails.medium.url;
var videoElement = document.createElement('div');
videoElement.classList.add('col');
videoElement.innerHTML = `
<div class="card course h-100 text-center" style="transition: box-shadow 0.2s ease-in-out;">
<div class="card-image">
<a href="https://www.youtube.com/watch?v=${videoId}" target="_blank">
<img class="img-fluid" style="width: 100%;" src="${videoThumbnail}" alt="${videoTitle}">
</a>
</div>
</div>
`;
videoContainer.appendChild(videoElement);
});
}, function (error)
{
console.error('Error loading YouTube videos:', error);
});
}
gapi.load('client', loadYouTubeVideos);
</script>