-
Notifications
You must be signed in to change notification settings - Fork 5
/
docs-page.html
342 lines (301 loc) Β· 18.7 KB
/
docs-page.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
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
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
<!DOCTYPE html>
<html lang="en">
<head>
<title>Student Dashboard docs</title>
<!-- Meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Bootstrap 4 Template For Software Startups">
<meta name="author" content="Xiaoying Riley at 3rd Wave Media">
<link rel="shortcut icon" href="favicon.ico">
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700&display=swap" rel="stylesheet">
<!-- FontAwesome JS-->
<script defer src="assets/fontawesome/js/all.min.js"></script>
<!-- Plugins CSS -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.2/styles/atom-one-dark.min.css">
<!-- Theme CSS -->
<link id="theme-style" rel="stylesheet" href="assets/css/theme.css">
</head>
<body class="docs-page">
<header class="header fixed-top">
<div class="branding docs-branding">
<div class="container-fluid position-relative py-2">
<div class="docs-logo-wrapper">
<button id="docs-sidebar-toggler" class="docs-sidebar-toggler docs-sidebar-visible mr-2 d-xl-none" type="button">
<span></span>
<span></span>
<span></span>
</button>
<div class="site-logo"><a class="navbar-brand" href="index.html"><img class="logo-icon mr-2" src="assets/images/coderdocs-logo.svg" alt="logo"><span class="logo-text">Student<span class="text-alt"> Dashboard</span></span></a></div>
</div><!--//docs-logo-wrapper-->
<div class="docs-top-utilities d-flex justify-content-end align-items-center">
<ul class="social-list list-inline mx-md-3 mx-lg-5 mb-0 d-none d-lg-flex">
<li class="list-inline-item"><a href="https://github.com/saisatwik99/Student-Dashboard"><i class="fab fa-github fa-fw"></i></a></li>
</ul><!--//social-list-->
</div><!--//docs-top-utilities-->
</div><!--//container-->
</div><!--//branding-->
</header><!--//header-->
<div class="docs-wrapper">
<div id="docs-sidebar" class="docs-sidebar">
<div class="top-search-box d-lg-none p-3">
<form class="search-form">
<input type="text" placeholder="Search the docs..." name="search" class="form-control search-input">
<button type="submit" class="btn search-btn" value="Search"><i class="fas fa-search"></i></button>
</form>
</div>
<nav id="docs-nav" class="docs-nav navbar">
<ul class="section-items list-unstyled nav flex-column pb-3">
<li class="nav-item section-title"><a class="nav-link scrollto active" href="#section-1"><span class="theme-icon-holder mr-2"><i class="fas fa-map-signs"></i></span>Introduction</a></li>
<li class="nav-item section-title mt-3"><a class="nav-link scrollto" href="#section-2"><span class="theme-icon-holder mr-2"><i class="fas fa-book-reader"></i></span>Features</a></li>
<li class="nav-item section-title mt-3"><a class="nav-link scrollto" href="#section-3"><span class="theme-icon-holder mr-2"><i class="fas fa-arrow-down"></i></span>Installation</a></li>
<li class="nav-item section-title mt-3"><a class="nav-link scrollto" href="#section-4"><span class="theme-icon-holder mr-2"><i class="fas fa-box"></i></span>APIs</a></li>
<li class="nav-item section-title mt-3"><a class="nav-link scrollto" href="#section-5"><span class="theme-icon-holder mr-2"><i class="fas fa-tools"></i></span>Utilities</a></li>
<li class="nav-item section-title mt-3"><a class="nav-link scrollto" href="#section-9"><span class="theme-icon-holder mr-2"><i class="fas fa-lightbulb"></i></span>FAQs</a></li>
</ul>
</nav><!--//docs-nav-->
</div><!--//docs-sidebar-->
<div class="docs-content">
<div class="container">
<article class="docs-article" id="section-1">
<header class="docs-header">
<h1 class="docs-heading">Introduction <span class="docs-time">Last updated: 2021-05-06</span></h1>
<section class="docs-intro">
<p>Student Dashboard helps students get access to their daily necessary needs like timetable, track their attendence and academic performance, share study materials, post complaints, get updates about internship and research opportunities within and outside the institute. It also helps students to schedule their daily activities ( like a To-do app ).</p>
</section><!--//docs-intro-->
<!-- <h5>Github Code Example:</h5> -->
<p>You can visit our website <a class="theme-link" href="https://beneficent-sd.herokuapp.com/" target="_blank">here</a></p>
</article>
<article class="docs-article" id="section-2">
<header class="docs-header">
<h1 class="docs-heading">Features</h1>
<section class="docs-intro">
<p>We have developed various features for students to track their performance and made things easiler that reduce a huge of work. Why still waiting let's explore all of them.</p>
</section><!--//docs-intro-->
<br>
</header>
<div class="callout-block callout-block-info">
<div class="content">
<h4 class="callout-title">
Attendence
</h4>
<p>Attendence helps students to track their subject-wise attendence updated on a daily basis.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-warning">
<div class="content">
<h4 class="callout-title">
Timetable
</h4>
<p>Shows time table of that particular student when logged in using his credentials. So that student cannot miss the class.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-success">
<div class="content">
<h4 class="callout-title">
Study Materials
</h4>
<p>Students can find notes, Academic Resources, Previous Year's Question Papers here.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-danger mr-1">
<div class="content">
<h4 class="callout-title">
Almanac
</h4>
<p>Almanac for that particular semester is shown in this section.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-info">
<div class="content">
<h4 class="callout-title">
Student requests
</h4>
<p>Students can request academic office for grade sheets, certificates and any other things.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-warning">
<div class="content">
<h4 class="callout-title">
Complaints
</h4>
<p>Students can raise complaints directly and makes it easy for resolving them.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-success">
<div class="content">
<h4 class="callout-title">
Library
</h4>
<p>Here student can find the list of available books in the institute's library.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-danger mr-1">
<div class="content">
<h4 class="callout-title">
Opportunities Platform
</h4>
<p>Information regarding Internships, research, jobs will be posted here.</p>
</div><!--//content-->
</div><!--//callout-block-->
<div class="callout-block callout-block-info">
<div class="content">
<h4 class="callout-title">
Alumni Network
</h4>
<p>Students can reach out to alumni for placement related guidance and queries.</p>
</div><!--//content-->
</div><!--//callout-block-->
</article><!--//docs-article-->
<article class="docs-article" id="section-3">
<header class="docs-header">
<h1 class="docs-heading">Installation</h1>
<section class="docs-intro">
<p>Let us learn how to install the application and run it in your local machine.</p>
</section><!--//docs-intro-->
</header>
<section class="docs-section" id="item-3-1">
<h2 class="section-heading">Prerequisite</h2>
<p>To install the application you require the following softwares.</p>
<div class="my-4">
<span class="badge badge-primary">Git</span>
<span class="badge badge-secondary">Node.JS</span>
<span class="badge badge-warning">npm</span>
</div>
</section><!--//section-->
<section class="docs-section" id="item-3-1">
<h2 class="section-heading">Starting the installation</h2>
<p>Now let us the installation.</p>
<h5>Steps as follows:</h5>
<ul>
<li><strong class="mr-1">Let us clone the repository:</strong> <br> <code>git clone https://github.com/saisatwik99/Student-Dashboard</code></li>
<li><strong class="mr-1">Navigate to the above folder:</strong><br> <code>cd Student-Dashboard</code></li>
<li><strong class="mr-1">Install node modules:</strong> <br> <code>npm install</code></li>
<li><strong>In package.json you can find the follow code.</strong></li>
<div class="docs-code-block">
<!-- ** Embed github code starts ** -->
<script src="https://gist.github.com/saisatwik99/432514ab675faa63f9a74616c5158285.js"></script>
<!-- ** Embed github code ends ** -->
</div><!--//docs-code-block-->
<li><strong>If the above step is successfull. Now create a file with name </strong> <code>.env</code> <strong> and insert your variables </strong><br> <code>MONGODB_URI, TOKEN_SECRET, PORT</code></li>
<li><strong>We reached the final step, Lets run the app.</strong> <br> <code>npm run dev</code></li>
</ul>
</section><!--//section-->
</article><!--//docs-article-->
<article class="docs-article" id="section-4">
<header class="docs-header">
<h1 class="docs-heading">APIs</h1>
<section class="docs-intro">
<p>Let us understand the folder structure and how APIs are written.</p>
</section><!--//docs-intro-->
</header>
<h5>Folder Structure:</h5>
<div class="table-responsive my-4">
<table class="table table-bordered">
<tbody>
<tr>
<th class="theme-bg-light">controller</th>
<td>All the api's and their functionalities are written here. </td>
</tr>
<tr>
<th class="theme-bg-light">models</th>
<td>Here we structure the schemas of different models. Ex: user.</td>
</tr>
<tr>
<th class="theme-bg-light">node_modules</th>
<td>This folder contains all the packages we are using to run the application.</td>
</tr>
<tr>
<th class="theme-bg-light">public</th>
<td>It contains the css, images of the web pages.</td>
</tr>
<tr>
<th class="theme-bg-light">validation</th>
<td>In validation we validate the data and information.</td>
</tr>
<tr>
<th class="theme-bg-light">view</th>
<td>In this folder it contains all ejs files for the web pages.</td>
</tr>
<tr>
<th class="theme-bg-light">index.js</th>
<td>The main file where application starts running.</td>
</tr>
<tr>
<th class="theme-bg-light">package-lock.json</th>
<td>Automatically generated file to operate node modules.</td>
</tr>
<tr>
<th class="theme-bg-light">package.json</th>
<td>Package.json specify the version of a package that our app depends on.</td>
</tr>
</tbody>
</table>
</div><!--//table-responsive-->
<section class="docs-section" id="item-3-1">
<p>Our application is written in express.js . We use apis to write the function. Used MongoDB to store the data. We send request to send and receive data.
</p>
</section>
</article><!--//docs-article-->
<article class="docs-article" id="section-5">
<header class="docs-header">
<h1 class="docs-heading">Utilities</h1>
<section class="docs-intro">
<p>See what technologies we used to build this amazing application.</p>
</section><!--//docs-intro-->
</header>
<div class="row my-3">
<div class="col-md-6 col-12">
<ul class="list list-unstyled pl-0">
<li><a href="#" class="btn btn-primary">HTML5</a></li>
<li><a href="#" class="btn btn-secondary">CSS3</a></li>
<li><a href="#" class="btn btn-danger">JavaScript</a></li>
<li><a href="#" class="btn btn-success">MongoDB</a></li>
<li><a href="#" class="btn btn-info">Node.JS</a></li>
<li><a href="#" class="btn btn-warning">npm</a></li>
</ul>
</div>
<div class="col-md-6 col-12">
<ul class="list list-unstyled pl-0">
<li><a href="#" class="btn btn-primary">Express.JS</a></li>
<li><a href="#" class="btn btn-secondary">Bootstrap</a></li>
<li><a href="#" class="btn btn-danger">Jquery</a></li>
<li><a href="#" class="btn btn-success">Github</a></li>
<li><a href="#" class="btn btn-info">Heroku</a></li>
</ul>
</div>
</div><!--//row-->
</article><!--//docs-article-->
<article class="docs-article" id="section-9">
<header class="docs-header">
<h1 class="docs-heading">FAQs</h1>
<section class="docs-intro">
<p>You can find all your FAQs here.</p>
</section><!--//docs-intro-->
</header>
<section class="docs-section" id="item-9-1">
<h5 class="pt-3"><i class="fas fa-question-circle mr-1"></i>Can we contribute to your application?</h5>
<p>You are always open to improvements we will be very happy for your contributions. You can suggest us new features, improve our UI and code base.</p>
<h5 class="pt-3"><i class="fas fa-question-circle mr-1"></i>We can only use MongoDB as database?</h5>
<p>It depends on your interest you can use various databases like MySQL, Firebase, Redis etc. </p>
<h5 class="pt-3"><i class="fas fa-question-circle mr-1"></i>How user authentication is built?</h5>
<p>We used JWT(JSON Web Token) to manage authentication. You can check how it is implemented in our codebase. </p>
</section><!--//section-->
</article><!--//docs-article-->
</div>
</div>
</div><!--//docs-wrapper-->
<!-- Javascript -->
<script src="assets/plugins/jquery-3.4.1.min.js"></script>
<script src="assets/plugins/popper.min.js"></script>
<script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<!-- Page Specific JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.8/highlight.min.js"></script>
<script src="assets/js/highlight-custom.js"></script>
<script src="assets/plugins/jquery.scrollTo.min.js"></script>
<script src="assets/plugins/lightbox/dist/ekko-lightbox.min.js"></script>
<script src="assets/js/docs.js"></script>
</body>
</html>