320 lines
15 KiB
HTML
320 lines
15 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en" class="scroll-smooth">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Michael W. Czechowski - Software Architect & Academic</title>
|
||
<meta name="description" content="Michael W. Czechowski - Software Architect & Academic">
|
||
<meta name="author" content="Michael W. Czechowski">
|
||
<!-- meta data for a software engineer, software architect, and academic from software with more than 20 years of experience in software development and infrastructure -->
|
||
<meta name="keywords" content="software engineer, software architect, academic, software development, software architecture, software infrastructure, software design, software engineering"/>
|
||
<meta name="robots" content="index, follow"/>
|
||
<meta name="revisit-after" content="7 days"/>
|
||
<meta name="language" content="English"/>
|
||
<meta name="distribution" content="global"/>
|
||
<meta name="rating" content="general"/>
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<script>
|
||
const tailwind = {};
|
||
tailwind.config = {
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
'nls-green': '#79C28D',
|
||
'nls-blue': '#5A99C3',
|
||
'nls-violet': '#7E86CA',
|
||
'nls-purple': '#C18FBD',
|
||
'nls-pink': '#EC7A9A',
|
||
'nls-black': '#0f0f11',
|
||
},
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
<style>
|
||
@media (max-height: 568px) {
|
||
html, body {
|
||
font-size: 2.78vh;
|
||
}
|
||
}
|
||
|
||
svg {
|
||
max-width: 80vw;
|
||
fill: white;
|
||
}
|
||
|
||
object {
|
||
max-height: 60vh;
|
||
}
|
||
|
||
img {
|
||
mix-blend-mode: color-burn;
|
||
}
|
||
|
||
.teaser {
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.teaser::after {
|
||
content: '';
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
height: 100%;
|
||
width: 100%;
|
||
background: linear-gradient(to top, var(--gradient-color) 0%, rgba(0, 0, 0, 0) 50%);
|
||
pointer-events: none;
|
||
}
|
||
|
||
.bg-nls-green .teaser { --gradient-color: #79C28D; }
|
||
.bg-nls-blue .teaser { --gradient-color: #5A99C3; }
|
||
.bg-nls-violet .teaser { --gradient-color: #7E86CA; }
|
||
.bg-nls-purple .teaser { --gradient-color: #C18FBD; }
|
||
.bg-nls-pink .teaser { --gradient-color: #EC7A9A; }
|
||
.bg-nls-black .teaser { --gradient-color: #0f0f11; }
|
||
|
||
@media (min-width: 640px) {
|
||
.paragraph-spacing {
|
||
padding-right: 20vw;
|
||
}
|
||
|
||
.paragraph-spacing.center {
|
||
padding-right: 10vw;
|
||
padding-left: 10vw;
|
||
}
|
||
}
|
||
|
||
section {
|
||
top: 0;
|
||
position: sticky;
|
||
position: -webkit-sticky;
|
||
position: -moz-sticky;
|
||
position: -ms-sticky;
|
||
position: -o-sticky;
|
||
display: none;
|
||
/*display: flex;*/
|
||
flex-direction: column;
|
||
justify-content: flex-start;
|
||
height: 90vh;
|
||
overflow: hidden;
|
||
}
|
||
|
||
@media (min-width: 640px) {
|
||
section {
|
||
height: 80vh;
|
||
}
|
||
}
|
||
|
||
article > header,
|
||
article > footer {
|
||
position: sticky;
|
||
position: -webkit-sticky;
|
||
position: -moz-sticky;
|
||
position: -ms-sticky;
|
||
position: -o-sticky;
|
||
}
|
||
|
||
article > header {
|
||
bottom: 100vh;
|
||
height: 100vh;
|
||
overflow: hidden;
|
||
}
|
||
|
||
/*article > footer {*/
|
||
/* top: 0;*/
|
||
/*}*/
|
||
|
||
/*article > footer section {*/
|
||
/* min-height: 200vh;*/
|
||
/* padding-top: 6rem;*/
|
||
/*}*/
|
||
|
||
/*article > footer section p {*/
|
||
/* margin: 1rem 3rem 6rem;*/
|
||
/*}*/
|
||
</style>
|
||
</head>
|
||
<body class="font-mono text-[1.68vh] m-0 p-0">
|
||
<main class="flex flex-col">
|
||
<article>
|
||
<header class="bg-nls-black text-white">
|
||
<div class="teaser p-8 sm:p-20 flex flex-col items-center justify-center h-full">
|
||
<div class="w-4/5 max-w-3xl mb-8">
|
||
<object data="./src/assets/nls.svg" type="image/svg+xml" class="w-full"></object>
|
||
</div>
|
||
<div class="text-center max-w-3xl center py-8">
|
||
<h1 class="text-xl sm:text-5xl mb-4 opacity-60">hello·at·dailysh.it</h1>
|
||
<!-- <p class="text-lg sm:text-2xl opacity-80"></p>-->
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="bg-nls-green">
|
||
<div class="teaser p-8 sm:p-20 flex flex-col h-full">
|
||
<div class="flex flex-col sm:flex-row items-center sm:items-start">
|
||
<div class="w-full sm:w-1/2 mb-8 sm:mb-0">
|
||
<img src="https://images.unsplash.com/photo-1563986768609-322da13575f3?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80"
|
||
alt="Complex software architecture diagram" class="w-full h-auto">
|
||
</div>
|
||
<div class="w-full sm:w-1/2 sm:pl-8">
|
||
<h2 class="text-2xl mb-2">Software Solutions</h2>
|
||
<h3 class="text-xl mb-4 opacity-60">Bosch (2015 – 2016)</h3>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Led the architecture and development of bosch-diy.de frontend</li>
|
||
<li>Implemented robust CI/CD pipelines</li>
|
||
<li>Mentored development teams on best practices in software architecture</li>
|
||
</ul>
|
||
<!-- <p class="paragraph-spacing">-->
|
||
<!-- At Bosch, I've been instrumental in shaping the digital transformation of their DIY and IoT sectors. My work on bosch-diy.de has set new standards for e-commerce platforms in the industry, combining high performance with intuitive user experience.-->
|
||
<!-- </p>-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="bg-nls-blue">
|
||
<div class="teaser p-8 sm:p-20 flex flex-col h-full">
|
||
<div class="flex flex-col sm:flex-row items-center sm:items-start">
|
||
<div class="w-full sm:w-1/2 mb-8 sm:mb-0">
|
||
<img src="./public/Serene Library Scene with Female Readers.jpg"
|
||
alt="University lecture hall" class="w-full h-auto">
|
||
</div>
|
||
<div class="w-full sm:w-1/2 sm:pl-8">
|
||
<h2 class="text-2xl mb-2">Academic Contributions</h2>
|
||
<h3 class="text-xl mb-4 opacity-60">University of Stuttgart & Leibniz Fachhochschule</h3>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Lecturer, Social Engineering - Leibniz FH (2019 - Present)</li>
|
||
<li>Lecturer, Mobile Media - Leibniz FH (2018 - Present)</li>
|
||
<li>Guest Lecturer, Advanced Software Architecture - Uni Stuttgart (2017 - 2019)</li>
|
||
</ul>
|
||
<!-- <p class="paragraph-spacing">-->
|
||
<!-- My academic work bridges the gap between theoretical computer science and practical industry applications. I've developed curricula that prepare both Wirtschaftsinformatik and BWL students for the challenges of modern software development and cybersecurity landscapes.-->
|
||
<!-- </p>-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="bg-nls-violet">
|
||
<div class="teaser p-8 sm:p-20 flex flex-col h-full">
|
||
<div class="flex flex-col sm:flex-row items-center sm:items-start">
|
||
<div class="w-full sm:w-1/2 mb-8 sm:mb-0">
|
||
<img src="https://images.unsplash.com/photo-1556075798-4825dfaaf498?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1776&q=80"
|
||
alt="Open source contribution graph" class="w-full h-auto">
|
||
</div>
|
||
<div class="w-full sm:w-1/2 sm:pl-8">
|
||
<h2 class="text-2xl mb-2">Open Source Contributions</h2>
|
||
<h3 class="text-xl mb-4 opacity-60">NextLevelShit on GitHub</h3>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Risk Tabletop Clone using XState - 500+ stars</li>
|
||
<li>Comprehensive HTML, CSS, JS courses - 1000+ forks</li>
|
||
<li>Various utility libraries for React and Vue.js ecosystems</li>
|
||
<li>Regular contributor to core TypeScript libraries</li>
|
||
</ul>
|
||
<!-- <p class="paragraph-spacing">-->
|
||
<!-- My commitment to open source goes beyond code contributions. I believe in fostering a community of knowledge sharing and collaborative development. My projects and courses on GitHub have helped thousands of developers improve their skills and build better software.-->
|
||
<!-- </p>-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="bg-nls-purple">
|
||
<div class="teaser p-8 sm:p-20 flex flex-col h-full">
|
||
<div class="flex flex-col sm:flex-row items-center sm:items-start">
|
||
<div class="w-full sm:w-1/2 mb-8 sm:mb-0">
|
||
<img src="https://images.unsplash.com/photo-1522071820081-009f0129c71c?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80"
|
||
alt="Team collaborating on a project" class="w-full h-auto">
|
||
</div>
|
||
<div class="w-full sm:w-1/2 sm:pl-8">
|
||
<h2 class="text-2xl mb-2">Professional Experience</h2>
|
||
<h3 class="text-xl mb-4 opacity-60">Industry Leaders & Innovators</h3>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Lead Architect, Becklyn Studios (2016 - 2018)</li>
|
||
<li>Senior Backend Developer, nextmarkets (2014 - 2016)</li>
|
||
<li>Software Engineer, SAP (2012 - 2014)</li>
|
||
</ul>
|
||
<!-- <p class="paragraph-spacing">-->
|
||
<!-- My career trajectory has been marked by significant contributions to diverse sectors of the tech industry. At Becklyn Studios, I led the development of high-performance web applications for enterprise clients. At nextmarkets, I was key in building a robust, real-time trading platform. My time at SAP laid the foundation for my expertise in enterprise software architecture.-->
|
||
<!-- </p>-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="bg-nls-green">
|
||
<div class="teaser p-8 sm:p-20 flex flex-col h-full">
|
||
<div class="flex flex-col sm:flex-row items-center sm:items-start">
|
||
<div class="w-full sm:w-1/2 mb-8 sm:mb-0">
|
||
<img src="https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80"
|
||
alt="Innovative tech concept" class="w-full h-auto">
|
||
</div>
|
||
<div class="w-full sm:w-1/2 sm:pl-8">
|
||
<h2 class="text-2xl mb-2">Technical Expertise</h2>
|
||
<h3 class="text-xl mb-4 opacity-60">Cutting-edge Technologies & Methodologies</h3>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Architecture: Microservices, Event-Driven, Domain-Driven Design</li>
|
||
<li>Languages: TypeScript, Rust, Go, Python, Haskell</li>
|
||
<li>Frameworks: React, Vue.js, NestJS, Phoenix</li>
|
||
<li>Cloud & DevOps: AWS, Azure, Kubernetes, Terraform</li>
|
||
<li>Data: PostgreSQL, Cassandra, Kafka, Elasticsearch</li>
|
||
</ul>
|
||
<!-- <p class="paragraph-spacing">-->
|
||
<!-- My technical philosophy centers on selecting the right tool for each unique challenge. I believe in the power of functional programming paradigms and strongly typed systems to create robust, maintainable software. My expertise spans from low-level systems programming to high-level application architecture, allowing me to approach problems holistically.-->
|
||
<!-- </p>-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<footer class="sticky top-0 bg-nls-black text-white">
|
||
<section class="p-8 sm:p-20 min-h-[120vh]">
|
||
<div class="max-w-3xl mx-auto">
|
||
<h2 class="text-2xl mb-4">Philosophy</h2>
|
||
<p class="mb-8 paragraph-spacing">
|
||
I believe in the transformative power of technology when applied with wisdom and foresight. My approach to software architecture is rooted in first principles thinking, always questioning assumptions and striving for elegant solutions that stand the test of time. I see each project as an opportunity to push the boundaries of what's possible, while never losing sight of the end user's needs and the business objectives.
|
||
</p>
|
||
|
||
<h2 class="text-2xl mb-4">Future Directions</h2>
|
||
<p class="mb-8 paragraph-spacing">
|
||
As we stand at the cusp of a new era in computing, with quantum computing and advanced AI on the horizon, I'm deeply engaged in research on how these technologies will reshape software architecture. I'm particularly interested in the intersection of distributed systems, privacy-preserving technologies, and sustainable computing - areas I believe will be crucial in the coming decades.
|
||
</p>
|
||
|
||
<h2 class="text-2xl mb-4">Connect</h2>
|
||
<p class="mb-4 paragraph-spacing">
|
||
I'm always open to discussing new ideas, potential collaborations, or opportunities to contribute to meaningful projects. Whether you're a fellow technologist, a potential client, or simply someone passionate about the future of technology, I welcome thoughtful dialogue.
|
||
</p>
|
||
<div class="paragraph-spacing">
|
||
<div class="flex space-x-6 mb-8">
|
||
<a href="https://github.com/nextlevelshit" target="_blank" rel="noopener noreferrer" class="text-white hover:text-nls-green transition-colors">
|
||
<svg class="w-8 h-8" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
|
||
</svg>
|
||
</a>
|
||
<a href="https://www.linkedin.com/in/michaelczechowski/" target="_blank" rel="noopener noreferrer" class="text-white hover:text-nls-blue transition-colors">
|
||
<svg class="w-8 h-8" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path fill-rule="evenodd" d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" clip-rule="evenodd" />
|
||
</svg>
|
||
</a>
|
||
<a href="https://www.xing.com/profile/Michael_Czechowski8" target="_blank" rel="noopener noreferrer" class="text-white hover:text-nls-violet transition-colors">
|
||
<svg class="w-8 h-8" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path d="M18.188 0c-.517 0-.741.325-.927.66 0 0-7.455 13.224-7.702 13.657.015.024 4.919 9.023 4.919 9.023.17.308.436.66.967.66h3.454c.211 0 .375-.078.463-.22.089-.151.089-.346-.009-.536l-4.879-8.916c-.004-.006-.004-.016 0-.022L22.139.756c.095-.191.097-.387.006-.535C22.056.078 21.894 0 21.686 0h-3.498zM3.648 4.74c-.211 0-.385.074-.473.216-.09.149-.078.339.02.531l2.34 4.05c.004.01.004.016 0 .021L1.86 16.051c-.099.188-.093.381 0 .529.085.142.239.234.45.234h3.461c.518 0 .766-.348.945-.667l3.734-6.609-2.378-4.155c-.172-.315-.434-.659-.962-.659H3.648v.016z"/>
|
||
</svg>
|
||
</a>
|
||
<a href="mailto:michael@czechowski.io" class="text-white hover:text-nls-pink transition-colors">
|
||
<svg class="w-8 h-8" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
||
</svg>
|
||
</a>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</footer>
|
||
|
||
</article>
|
||
</main>
|
||
</body>
|
||
</html> |