+- Sick Gaming (https://www.sickgaming.net)
+-- Forum: Computers (https://www.sickgaming.net/forum-86.html)
+--- Forum: Linux, FreeBSD, and Unix types (https://www.sickgaming.net/forum-88.html)
+--- Thread: Fedora - Using Fedora to quickly implement REST API with JavaScript (/thread-94478.html)
Fedora - Using Fedora to quickly implement REST API with JavaScript - xSicKxBot - 04-10-2020
Using Fedora to quickly implement REST API with JavaScript
<div style="margin: 5px 5% 10px 5%;"><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/04/using-fedora-to-quickly-implement-rest-api-with-javascript.png" width="800" height="600" title="" alt="" /></div><div><p>Fedora Workstation uses GNOME Shell by default and this one was mainly written in JavaScript. JavaScript is famous as a language of front-end development but this time we’ll show its usage for back-end.</p>
<p>We’ll implement a new API using the following technologies: JavaScript, Express and Fedora Workstation. A web browser is being used to call the service (eg. Firefox from the default Fedora WS distro).</p>
<p> <span id="more-30805"></span> </p>
<h2>Installing of necessary packages</h2>
<p><strong>Check: What’s already installed?</strong></p>
<pre class="wp-block-preformatted">$ npm -v
$ node -v</pre>
<p>You may already have both the necessary packages installed and can skip the next step. If not, install <em>nodejs</em>:</p>
<pre class="wp-block-preformatted">$ sudo dnf install nodejs</pre>
<h2>A new simple service (low-code style)</h2>
<p>Let‘s navigate to our working directory (<em>work</em>) and create a new directory for our new sample back-end app.</p>
<pre class="wp-block-preformatted">$ cd work
$ mkdir newApp
$ cd newApp
$ npx express-generator</pre>
<p>The above command generates an application skeleton for us.</p>
<pre class="wp-block-preformatted">$ npm i</pre>
<p>The above command installs dependencies. Please mind the security warnings – never use this one for production.</p>
<p>Crack open the <strong>routes/users.js</strong></p>
<p>Modify line #6 to: </p>
<pre class="wp-block-preformatted">res.send(data);</pre>
<p>Insert this code block below <em>var router</em>:</p>
<pre class="wp-block-preformatted">let data = { '1':'Ann', '2': 'Bruno', '3': 'Celine' }</pre>
<p>Save<br />
the modified file.</p>
<p>We modified a route and added a new variable data. This one could be declared as a <em>const</em> as we didn‘t modify it anywhere. The result:</p>
<figure class="wp-block-image size-large is-resized"><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/04/using-fedora-to-quickly-implement-rest-api-with-javascript.png" alt="" class="wp-image-30806" width="580" height="435" /></figure>
<h2>Running the service on your local Fedora workstation machine</h2>
<pre class="wp-block-preformatted">$ npm start</pre>
<p><em>Note: The application entry point is bin/www. You may want to change the port number there.</em></p>
<h2>Calling our new service</h2>
<p>Let‘s launch our Firefox browser and type-in:</p>
<p><em>http://localhost:3000/users</em></p>
<figure class="wp-block-image size-large"><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/04/using-fedora-to-quickly-implement-rest-api-with-javascript-1.png" alt="" class="wp-image-30808" /><figcaption>Output</figcaption></figure>
<p>It‘s also possible to leverage the Developer tools. Hit <strong>F12</strong> and in the <em>Network</em> tab, select the related GET request and look at the side bar response tab to check the data.</p>
<h2>Conclusion</h2>
<p>Now we have got a service and and an unnecessary index accessible through <em>localhost:3000</em>. To get quickly rid of this:</p>
<ol>
<li>Remove the <em>views</em> directory</li>
<li>Remove the <em>public</em> directory</li>
<li>Remove the <em>routes/index.js</em> file</li>
<li>Inside the <em>app.js</em> file, modify the line 37 to:<br />
<div class="codecolorer-container text default" style="overflow:auto;border:1px solid #9F9F9F;width:435px">
<div class="text codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace">res.status(err.status || 500).end();</div>
</div>
</li>
<li>Remove the next line <em>res.render(‘error’)</em></li>
</ol>
<p>Then restart the service:</p>
<pre class="wp-block-preformatted">$ npm start</pre></p>
</div>
https://www.sickgaming.net/blog/2020/04/10/using-fedora-to-quickly-implement-rest-api-with-javascript/