@andreabiagini5/applicazioni-e-servizi-web-project
Version:
Project for Applicazioni e Servizi Web.
79 lines (74 loc) • 12.5 kB
HTML
<html class="default" lang="en" data-base="./"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>@andreabiagini5/applicazioni-e-servizi-web-project - v1.1.1</title><meta name="description" content="Documentation for @andreabiagini5/applicazioni-e-servizi-web-project"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><script defer src="assets/main.js"></script><script async src="assets/icons.js" id="tsd-icons-script"></script><script async src="assets/search.js" id="tsd-search-script"></script><script async src="assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => window.app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><a href="index.html" class="title">@andreabiagini5/applicazioni-e-servizi-web-project - v1.1.1</a><div id="tsd-toolbar-links"></div><button id="tsd-search-trigger" class="tsd-widget" aria-label="Search"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-search"></use></svg></button><dialog id="tsd-search" aria-label="Search"><input role="combobox" id="tsd-search-input" aria-controls="tsd-search-results" aria-autocomplete="list" aria-expanded="true" autocapitalize="off" autocomplete="off" placeholder="Search the docs" maxLength="100"/><ul role="listbox" id="tsd-search-results"></ul><div id="tsd-search-status" aria-live="polite" aria-atomic="true"><div>Preparing search index...</div></div></dialog><a href="#" class="tsd-widget menu" id="tsd-toolbar-menu-trigger" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-menu"></use></svg></a></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><h1>@andreabiagini5/applicazioni-e-servizi-web-project - v1.1.1</h1></div><div class="tsd-panel tsd-typography"><h1 id="sandpiles" class="tsd-anchor-link">SandPiles<a href="#sandpiles" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><p><em>Place your grains. Tip the balance. In this world of unstable equilibrium, every move can trigger a chain reaction. Conquer the board one avalanche at a time.</em></p>
<p><a href="https://sonarcloud.io/summary/new_code?id=AndreaB2000_ASW-project"><img src="https://sonarcloud.io/api/project_badges/measure?project=AndreaB2000_ASW-project&metric=bugs" alt="Bugs"></a>
<a href="https://sonarcloud.io/summary/new_code?id=AndreaB2000_ASW-project"><img src="https://sonarcloud.io/api/project_badges/measure?project=AndreaB2000_ASW-project&metric=code_smells" alt="Code Smells"></a>
<a href="https://sonarcloud.io/summary/new_code?id=AndreaB2000_ASW-project"><img src="https://sonarcloud.io/api/project_badges/measure?project=AndreaB2000_ASW-project&metric=duplicated_lines_density" alt="Duplicated Lines (%)"></a>
<a href="https://sonarcloud.io/summary/new_code?id=AndreaB2000_ASW-project"><img src="https://sonarcloud.io/api/project_badges/measure?project=AndreaB2000_ASW-project&metric=ncloc" alt="Lines of Code"></a>
<a href="https://sonarcloud.io/summary/new_code?id=AndreaB2000_ASW-project"><img src="https://sonarcloud.io/api/project_badges/measure?project=AndreaB2000_ASW-project&metric=sqale_index" alt="Technical Debt"></a>
<a href="https://sonarcloud.io/summary/new_code?id=AndreaB2000_ASW-project"><img src="https://sonarcloud.io/api/project_badges/measure?project=AndreaB2000_ASW-project&metric=vulnerabilities" alt="Vulnerabilities"></a></p>
<p>An online multiplayer turn-based strategy game based on the mathematical <strong><a href="https://en.wikipedia.org/wiki/Abelian_sandpile_model">Abelian sandpile model</a></strong>, developed for "Applicazioni e Servizi Web" and "Software Process Engineering" exams at UniBo's Computer Science Master Degree courses.</p>
<h2 id="table-of-contents" class="tsd-anchor-link">Table of Contents<a href="#table-of-contents" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><ul>
<li><a href="#-documentation">Documentation</a></li>
<li><a href="#-features">Features</a></li>
<li><a href="#-tech-stack">Tech Stack</a></li>
<li><a href="#-installation">Installation</a></li>
<li><a href="#-running-the-system">Running the System</a></li>
<li><a href="#-development">Development</a></li>
<li><a href="#-license">License</a></li>
</ul>
<h2 id="documentation" class="tsd-anchor-link">Documentation<a href="#documentation" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>Full technical documentation and academic report available here: <a href="media/report.md">Report</a></p>
<h2 id="features" class="tsd-anchor-link">Features<a href="#features" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><ul>
<li>Competitive matches</li>
<li>Matches against bot</li>
<li>Login to save your progress</li>
<li>Leaderboard to check your skill level</li>
</ul>
<h2 id="tech-stack" class="tsd-anchor-link">Tech Stack<a href="#tech-stack" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p><strong>Frontend</strong></p>
<ul>
<li>Vue.js + TypeScript</li>
<li>SCSS</li>
<li>MDBootstrap</li>
</ul>
<p><strong>Backend</strong></p>
<ul>
<li>Node.js + Express</li>
<li><a href="http://Socket.IO">Socket.IO</a></li>
<li>MongoDB</li>
<li>Prolog bot</li>
</ul>
<p><strong>DevOps</strong></p>
<ul>
<li>Build automation with npm scripts</li>
<li>Docker containerization</li>
<li>SonarCloud</li>
<li>GitHub Actions CI/CD</li>
</ul>
<h2 id="installation" class="tsd-anchor-link">Installation<a href="#installation" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><ol>
<li><strong>Prerequisites</strong>:
<ul>
<li>Node.js v20+</li>
<li>Docker (for production)</li>
</ul>
</li>
<li>Install dependencies:<pre><code class="bash"><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">install</span>
</code><button type="button">Copy</button></pre>
</li>
<li>Configure environment:
<ul>
<li>Create a <code>.env</code> file in the root directory containing: DB_NAME, DB_APP_USERNAME, DB_APP_PASSWORD, DB_ADMIN_USERNAME, DB_ADMIN_PASSWORD, JWT_SECRET, JWT_EXPIRATION.</li>
</ul>
</li>
</ol>
<h2 id="running-system" class="tsd-anchor-link">Running system<a href="#running-system" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>The system can be executed locally, using the following commands:</p>
<pre><code class="sh"><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">build</span><span class="hl-1"> && </span><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">start</span>
</code><button type="button">Copy</button></pre>
<p>and the client can be accessed from <code>http://localhost:4173</code>.</p>
<p>To run the system in Docker, you first need to create a valid certificate and key pair using the following commands:</p>
<pre><code class="sh"><span class="hl-0">openssl</span><span class="hl-1"> </span><span class="hl-2">req</span><span class="hl-1"> </span><span class="hl-3">-x509</span><span class="hl-1"> </span><span class="hl-3">-newkey</span><span class="hl-1"> </span><span class="hl-2">rsa:2048</span><span class="hl-1"> </span><span class="hl-3">-keyout</span><span class="hl-1"> </span><span class="hl-2">certs/key.pem</span><span class="hl-1"> </span><span class="hl-3">-out</span><span class="hl-1"> </span><span class="hl-2">certs/cert.pem</span><span class="hl-1"> </span><span class="hl-3">-days</span><span class="hl-1"> </span><span class="hl-4">365</span><span class="hl-1"> </span><span class="hl-3">-nodes</span><span class="hl-1"> </span><span class="hl-3">-subj</span><span class="hl-1"> </span><span class="hl-2">"/CN=sandpiles.com"</span>
</code><button type="button">Copy</button></pre>
<p>Then build and start by running the following commands:</p>
<pre><code class="sh"><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">build:docker</span><span class="hl-1"> && </span><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">start:docker</span>
</code><button type="button">Copy</button></pre>
<p>and accessing the client using <code>https://172.0.0.11</code>.</p>
<h2 id="contributing" class="tsd-anchor-link">Contributing<a href="#contributing" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>See <a href="media/CONTRIBUTING.md">CONTRIBUTING</a> for details on how to contribute to this project.</p>
<h2 id="license" class="tsd-anchor-link">License<a href="#license" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>MIT Licensed - See <a href="media/LICENSE">LICENSE</a> for details.</p>
</div></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-chevronDown"></use></svg><h3>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-chevronDown"></use></svg><h3>On This Page</h3></summary><div class="tsd-accordion-details"><a href="#sandpiles"><span>Sand<wbr/>Piles</span></a><ul><li><a href="#table-of-contents"><span>Table of <wbr/>Contents</span></a></li><li><a href="#documentation"><span>Documentation</span></a></li><li><a href="#features"><span>Features</span></a></li><li><a href="#tech-stack"><span>Tech <wbr/>Stack</span></a></li><li><a href="#installation"><span>Installation</span></a></li><li><a href="#running-system"><span>Running system</span></a></li><li><a href="#contributing"><span>Contributing</span></a></li><li><a href="#license"><span>License</span></a></li></ul></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html">@andreabiagini5/applicazioni-e-servizi-web-project - v1.1.1</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer></footer><div class="overlay"></div></body></html>