components-inline.js

// components-inline.js
// Auto-generated fallback for file:// local testing
/** @type {Record<string, string>} */
window.__INLINE_COMPONENTS = {
  "components/about.html": "<section id=\"about\" class=\"section about\">\n  <h2>About Me</h2>\n  <p class=\"aboutMe\">\n    Developer since 2010, specializing in web technologies: Angular, React, Node.js, MongoDB, and more.\n    Experienced in project leadership, integrations, training, and performance tuning.\n    Passionate about clean code and mentoring.\n  </p>\n</section>\n",
  "components/contact.html": "<section id=\"contact\" class=\"section contact\">\n  <h2>Contacts</h2>\n  <p><i class=\"fas fa-envelope\"></i> job@francescosanna.eu</p>\n  <address><i class=\"fas fa-map-marker-alt\"></i> Cagliari, Italy</address>\n  <p><i class=\"fab fa-linkedin\"></i> <a href=\"https://www.linkedin.com/in/francesco-sanna\">LinkedIn</a></p>\n</section>\n",
  "components/education.html": "<section id=\"education\" class=\"section education\">\n  <h2>Education &amp; Certifications</h2>\n  <ul>\n    <li><i class=\"fas fa-graduation-cap\"></i> B.Sc. Computer Science, University of Cagliari</li>\n    <li><i class=\"fa-brands fa-w3c\"></i>\n      <a class=\"noDecoration\" href=\"https://verify.w3schools.com/1QRUA6J16Y\" target=\"_blank\" rel=\"noopener noreferrer\">\n        W3Schools React certification - Certified React Developer Professional Level\n      </a>\n    </li>\n  </ul>\n</section>\n",
  "components/experience.html": "<section id=\"experience\" class=\"section experience\">\n  <h2>Experience</h2>\n  <div class=\"timeline\">\n    <div class=\"event\">\n      <div class=\"date\">2024 - Present</div>\n      <div class=\"details\">\n        <h3>Technical Project Leader <br> <span class=\"at\">@Stackhouse - Spindox</span></h3>\n        <ul>\n          <li>Lead and mentor.</li>\n          <li>Define project roadmaps, run sprint planning and retrospectives.</li>\n          <li>Conduct code reviews and enforce best practices to improve overall code quality.</li>\n        </ul>\n      </div>\n    </div>\n    <div class=\"event\">\n      <div class=\"date\">2015 - 2024</div>\n      <div class=\"details\">\n        <h3>Web Developer &amp; Customer Success &amp; Professional Services Lead &amp; Technical Trainer <br> <span class=\"at\">@Vivocha</span></h3>\n        <ul>\n          <li>Gathered requirements and rolled out custom platform integrations for banking and insurance customers.</li>\n          <li>Acted as the point of contact and drove projects from kickoff through go-live.</li>\n          <li>Created and presented hands-on workshops on JavaScript SDKs and REST APIs to international developer teams.</li>\n          <li>Customized training materials to suit both technical and non-technical audiences.</li>\n          <li>Implemented HTML/CSS/JavaScript solutions for customer-facing components.</li>\n          <li>Advised clients on tailored workflows and best-practice implementations to boost productivity.</li>\n          <li>Provided second-level support, resolving high-priority tickets and maintaining SLAs.</li>\n        </ul>\n      </div>\n    </div>\n    <div class=\"event\">\n      <div class=\"date\">2010 - 2015</div>\n      <div class=\"details\">\n        <h3>Developer &amp; Intern <br> <span class=\"at\">@Reilabs</span></h3>\n        <ul>\n          <li>Developed both front-end and back-end features for a web analytics tool.</li>\n          <li>Integrated RESTful data feeds and built interactive dashboards for KPI visualization.</li>\n          <li>Collaborated to refine metrics and optimize page load and Database performance</li>\n        </ul>\n      </div>\n    </div>\n  </div>\n</section>\n",
  "components/header.html": "<header>\n  <nav class=\"navbar\">\n    <a href=\"#hero\">Home</a>\n    <a href=\"#about\">About</a>\n    <a href=\"#skills\">Skills</a>\n    <a href=\"#projects\">Projects</a>\n    <a href=\"#experience\">Experience</a>\n    <a href=\"#education\">Education</a>\n    <a href=\"#contact\">Contacts</a>\n  </nav>\n</header>\n",
  "components/hero.html": "<section id=\"hero\" class=\"section hero\">\n  <div class=\"overlay\"></div>\n  <div class=\"hero-content\">\n    <button type=\"button\" class=\"avatar\" id=\"trigger-logo\" aria-label=\"Play logo animation easter egg\"></button>\n    <div id=\"easter-egg\" class=\"noselect\">\n      <div class=\"logo\">\n        <div class=\"frame\">\n          <div class=\"line h-line top\"></div>\n          <div class=\"line v-line right\"></div>\n          <div class=\"line h-line bottom\"></div>\n          <div class=\"line v-line left\"></div>\n        </div>\n        <div class=\"square top-left\"></div>\n        <div class=\"square bottom-right\"></div>\n        <div class=\"letters\">\n          <span>F</span><span>S</span>\n        </div>\n      </div>\n    </div>\n    <h1>Francesco Sanna</h1>\n    <p class=\"subtitle\">Technical Project Leader &amp; Software Developer</p>\n    <div class=\"hero-buttons\">\n      <a href=\"resources/curriculum.pdf\" class=\"btn primary\"><i class=\"fas fa-download\"></i> Download CV</a>\n      <a href=\"#contact\" class=\"btn outline\">Get in Touch</a>\n    </div>\n  </div>\n</section>\n",
  "components/nav-buttons.html": "<div id=\"navButtons\">\n  <button id=\"prevBtn\" class=\"nav-btn up\">&#9650;</button>\n  <button id=\"nextBtn\" class=\"nav-btn down\">&#9660;</button>\n</div>\n",
  "components/projects.html": "<section id=\"projects\" class=\"section projects\">\n  <h2>Key Projects</h2>\n  <div class=\"grid project-grid\">\n    <div class=\"card project-card\">\n      <h3>Custom Third-Party Integrations</h3>\n      <p><strong>JavaScript, Angular, Node.js, REST APIs</strong></p>\n      <p>\n        Developed bespoke integrations between client systems and external platforms,\n        from initial scoping through to delivery.\n      </p>\n    </div>\n    <div class=\"card project-card\">\n      <h3>Technical &amp; Non-Technical Training</h3>\n      <p><strong>JavaScript SDK, REST API, Workshop Delivery</strong></p>\n      <p>\n        Designed and delivered both technical and non-technical training programs\n        for global customers, ranging from basic overviews to deep dives into Software architecture.\n      </p>\n    </div>\n    <div class=\"card project-card\">\n      <h3>Customer Collaboration</h3>\n      <p>Lead technical deep dives with stakeholders to clarify requirements, demo proof-of-concepts, and agree on cut-over plans - ensuring everyone stays on the same page.</p>\n    </div>\n    <div class=\"card project-card\">\n      <h3>Chat &amp; Video-Chat Widgets</h3>\n      <p><strong>JavaScript, Angular, CSS</strong></p>\n      <p>Built a suite of embeddable chat and video-chat widgets with real-time messaging, user notifications,\n        and event handling - used across multiple client portals to boost engagement.</p>\n    </div>\n  </div>\n</section>\n",
  "components/skills.html": "<section id=\"skills\" class=\"section skills\">\n  <h2>Skills</h2>\n  <div class=\"grid\">\n    <div class=\"card\"><i class=\"fab fa-html5\"></i><span>HTML5</span></div>\n    <div class=\"card\"><i class=\"fab fa-css3-alt\"></i><span>CSS3</span></div>\n    <div class=\"card\"><i class=\"fab fa-js\"></i><span>JavaScript</span></div>\n    <div class=\"card\"><i class=\"fab fa-angular\"></i><span>Angular</span></div>\n    <div class=\"card\"><i class=\"fab fa-react\"></i><span>React</span></div>\n    <div class=\"card\"><i class=\"fab fa-node-js\"></i><span>Node.js</span></div>\n    <div class=\"card\"><i class=\"fas fa-database\"></i><span>MongoDB</span></div>\n    <div class=\"card\"><i class=\"fab fa-github\"></i><span>Git &amp; CI/CD</span></div>\n    <div class=\"card\"><i class=\"fas fa-chart-line\"></i><span>Performance Tuning</span></div>\n    <div class=\"card\"><i class=\"fas fa-chalkboard-teacher\"></i><span>Technical Training</span></div>\n    <div class=\"card\"><i class=\"fa-solid fa-infinity\"></i><span>and more ...</span></div>\n  </div>\n</section>\n"
};