<!DOCTYPE html>

<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->

<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->

<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->

<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->



<head>



<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />



<meta name="description" content="Ashish Patel Software Developer Portfolio">

<meta name="author" content="Ashish Patel">



<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preload" href="img/slider/1.jpg" as="image">

<title>Ashish Patel | Software Developer</title>

<!-- STYLES -->
<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@400;600;700&family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700&display=swap" rel="stylesheet">





<link rel="stylesheet" type="text/css" href="css/variables.css" />
<link rel="stylesheet" type="text/css" href="css/plugins.css" />

<link rel="stylesheet" type="text/css" href="css/colors.css" />

<link rel="stylesheet" type="text/css" href="css/darkMode.css" />

<link rel="stylesheet" type="text/css" href="css/style.css" />

<!--[if lt IE 9]> <script type="text/javascript" src="js/modernizr.custom.js"></script> <![endif]-->

<style>

.hero_audience_chooser { margin-top: 14px; font-size: 0.9em; opacity: 0.9; }

.hero_audience_chooser .hero_audience_label { margin-right: 8px; }

.hero_audience_chooser a { color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.5); padding-bottom: 1px; }

.hero_audience_chooser a:hover { border-bottom-color: #fff; }

.hero_audience_sep { margin: 0 10px; opacity: 0.7; }

.hero_audience_line { margin-top: 10px; font-size: 1.05em; line-height: 1.5; max-width: 520px; margin-left: auto; margin-right: auto; }

.hero_cta_wrap { margin-top: 20px; }

.hero_cta_wrap a { display: inline-block; margin: 0 10px 8px 0; padding: 10px 18px; background: rgba(255,255,255,.15); color: #fff; text-decoration: none; border-radius: 8px; font-weight: 600; }

.hero_cta_wrap a:hover { background: rgba(255,255,255,.25); }

</style>

<!-- /STYLES -->



</head>



<body class="dark">
	<script>
	(function(){
		var t = localStorage.getItem('portfolio-theme');
		if (t === 'light') document.body.classList.remove('dark');
		else if (t === 'dark') document.body.classList.add('dark');
	})();
	</script>

	<!-- PRELOADER -->

	<div class="arlo_tm_preloader">

		<div class="spinner_wrap">

			<div class="spinner"></div>

			<div class="arlo_tm_preloader_progress"><div class="arlo_tm_preloader_bar"></div></div>

		</div>

	</div>

	<!-- /PRELOADER -->



	

<!-- WRAPPER ALL -->

<div class="arlo_tm_all_wrap" data-magic-cursor="" data-color="crimson">

	

	<!-- "" is default option -->

	

	<!-- MAGIC CURSOR VALUES: "", hide -->

	<!-- COLOR VALUES: blue, green, brown, pink, orange, black, white, purple, sky, cadetBlue, crimson, olive, red -->

	

	<!-- MODALBOX NEWS -->

	<div class="arlo_tm_modalbox_news">

		<div class="box_inner">

			<div class="close">

				<a href="#"><img class="svg" src="img/svg/cancel.svg" alt="" /></a>

			</div>

			<div class="description_wrap">

			</div>

		</div>

	</div>

	<!-- /MODALBOX NEWS -->

	

	<!-- MOBILE MENU -->

	<div class="arlo_tm_mobile_menu">

		<div class="mobile_menu_inner">

			<div class="container">

				<div class="mobile_in">

					<div class="logo">

						<a href="#"><img src="img/logo/mobile/dark.png" alt="" /></a>

					</div>

					<div class="my_trigger">

						<div class="hamburger hamburger--collapse-r">

							<div class="hamburger-box">

								<div class="hamburger-inner"></div>

							</div>

						</div>

					</div>

				</div>

			</div>

		</div>

		<div class="dropdown">

			<div class="container">

				<div class="dropdown_inner">

					<ul class="anchor_nav">

                        <li class=current><a href=#home>Home</a></li>

                        <li><a href=#about>About</a></li>

                        <li><a href=#services>Services</a></li>

                        <li><a href=#how-i-work>How I work</a></li>

                        <li><a href=Projects.html>Projects</a></li>

                        <li><a href="resume.html">Resume</a></li>

                        <li><button type="button" class="arlo_tm_theme_toggle arlo_tm_theme_toggle_mobile" id="themeToggleMobile" aria-label="Toggle dark mode"><span class="icon-dark" aria-hidden="true">&#9728;</span><span class="icon-light" aria-hidden="true">&#9790;</span></button></li>

					</ul>

				</div>

			</div>

		</div>

	</div>

	<!-- /MOBILE MENU -->

	

	<!-- TOPBAR -->

	<header class="arlo_tm_topbar" role="banner">

		<div class="container">

			<div class="topbar_inner">

				<div class="logo">

					<a href="#"><img class="light" src="img/logo/classic/light.png" alt="" /></a>

					<a href="#"><img class="dark" src="img/logo/classic/dark.png" alt="" /></a>

				</div>

				<nav class="menu" aria-label="Main navigation">

					<ul class="anchor_nav">

                        <li class=current><a href=#home>Home</a></li>

                        <li><a href=#about>About</a></li>

                        <li><a href=#services>Services</a></li>

                        <li><a href=#how-i-work>How I work</a></li>

                        <li><a href=Projects.html>Projects</a></li>

                        <li><a href="resume.html">Resume</a></li>

                        <li><button type="button" class="arlo_tm_theme_toggle" id="themeToggle" aria-label="Toggle dark mode"><span class="icon-dark" aria-hidden="true">&#9728;</span><span class="icon-light" aria-hidden="true">&#9790;</span></button></li>

					</ul>

				</nav>

			</div>

		</div>

	</header>

	<!-- /TOPBAR -->

	

	<main id="main-content">

	<!-- HERO -->

	<section class="arlo_tm_hero" id="home" aria-label="Introduction">

		<div class="background">

			<div class="image" data-img-url="img/slider/1.jpg"></div>

			<div class="particle_wrapper">

				<div id="particles-js"></div>

			</div>

			<div class="overlay"></div>

		</div>

		<div class="content">

			<div class="image_wrap">

				<div class="main" data-img-url="img/about/1.jpg"></div>

			</div>

			<div class="name_holder">

				<h3>Ashish <span>Patel</span></h3>

			</div>

			<div class="text_typing" id="heroTypingWrap">

				<p>I'm a <span class="arlo_tm_animation_text_word"></span></p>

			</div>

			<div id="heroAudienceLine" class="hero_audience_line" style="display:none;"></div>

			<div id="heroAudienceChooser" class="hero_audience_chooser">

				<span class="hero_audience_label">I'm here as:</span>

				<a href="#" id="heroAudienceRecruiter" class="hero_audience_btn">Recruiter / hiring manager</a>

				<span class="hero_audience_sep">|</span>

				<a href="#" id="heroAudienceEngineer" class="hero_audience_btn">Engineer / technical</a>

			</div>

			<div id="heroCtaWrap" class="hero_cta_wrap" style="display:none;"></div>

		</div>

		<div class="arlo_tm_arrow_wrap bounce anchor">

			<a href="#about" aria-label="Scroll to about" style="color:#fff"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M7 13l5 5 5-5M7 6l5 5 5-5"/></svg></a>

		</div>

	</section>

	<!-- /HERO -->

	

        <section class=arlo_tm_about id=about aria-label="About me">

            <div class=container>

                <div class=arlo_tm_main_title>

                    <span>Biography</span>

                    <h3>About Me</h3>

                </div>

                <div class=about_inner>

                    <div class=left>

                        <div class="about_image_wrap parallax" data-relative-input=true>

                            <div class="image layer" data-depth=0.1>

                                <img src=img/ratios/550x650.jpg alt="Portrait of Ashish Patel" />

                                <div class=inner data-img-url=img/about/2.jpg></div>

                            </div>

                            <div class="border layer" data-depth=0.2>

                                <img src=img/ratios/550x650.jpg alt="Portrait of Ashish Patel" />

                                <div class=inner></div>

                            </div>

                        </div>

                    </div>

                    <div class=right>

                        <div class=about_title>

                            <h3>I'm Ashish Patel and <span class=arlo_tm_animation_text_word></span></h3>

                        </div>

                        <div class=text>

                            <p>I am a Software Engineer with a Bachelor’s degree in Computer Science from Northern Illinois University. Specializing in Full-Stack Development, I have honed my skills in a variety of programming languages including Java, JavaScript/TypeScript, Python, C#, and C++. My expertise encompasses web and mobile application development, underpinned by a strong foundation in UI/UX design.<br><br>

                                Professionally, my experience at <b>Health & Wellness Partners LLC</b> as a <b>Software Developer</b> and as a <b>Software Engineering intern</b> at <b>CURO Financial Technologies Corp</b> has refined my abilities in cybersecurity, data analytics, artificial intelligence, and machine learning. I am adept at navigating the software development life cycle, emphasizing efficient, user-focused solutions.<br><br>
                                
                                </p>

                        </div>

                        <div class=about_short_contact_wrap>

                            <ul>

                                <li>

                                    <img class=svg src=img/svg/location-1.svg alt />

                                    <span><label>Location:</label> <a class=href_location href=#>Naperville,

                                            IL</a></span>

                                </li>

                                <li>

                                    <img class=svg src=img/svg/study-5.svg alt />

                                    <span><label>College:</label> <a class=href_location href=#> Northern Illinois

                                            University</a></span>

                                </li>

                                <li>

                                    <img class=svg src=img/svg/message-3.svg alt />

                                    <span><label>E-mail:</label> <a

                                            href=mailto:patelashish584@gmail.com>patelashish584&#64;gmail.com</a></span>

                                </li>

                                <li>

                                    <img class=svg src=img/svg/call-2.svg alt />

                                    <span><label>Phone:</label> <a href="tel:+1 630 822 3613">+1 630 822 3613</a></span>

                                </li>

                            </ul>

                        </div>

                        <div class=arlo_tm_button arlo_tm_resume_buttons>

                            <a href="resume.html"><span>View full resume</span></a>

                            <a href="Ashish Patel Resume.pdf" download><span>Download PDF</span></a>

                            <a href="img/resume/resume.jpg" download><span>Download image</span></a>

                        </div>

                    </div>

                </div>

            </div>

        </section>

        <section class=arlo_tm_section id=services aria-label="Services">

            <div class=arlo_tm_services>

                <div class=container>

                    <div class=arlo_tm_main_title>

                        <span>Services</span>

                        <h3>Quality Services</h3>

                    </div>

                    <div class=service_inner>

                        <ul>

                            <li class="wow fadeInLeft" data-wow-duration=1.5s>

                                <div class=inner>

                                    <img class=svg src=img/svg/front.svg alt />

                                    <h3>Front End Development</h3>

                                    <p> I have a strong grasp of HTML, CSS, JavaScript, and typescript. I also have a strong understanding of the principles of responsive design. I have worked with a variety of frameworks, including React, Bootstrap, Foundation, and Materialize. I am skilled in designing and developing dynamic websites, implementing custom plugins, and optimizing web pages for speed.</p>


                                </div>

                            </li>

                            <li class="wow fadeInLeft" data-wow-duration=1.5s data-wow-delay=0.2s>

                                <div class=inner>

                                    <img class=svg src=img/svg/back.svg alt />

                                    <h3>Back-End Development</h3>

                                    <p>I am well versed in back-end development using Python, PHP, JavaScript, MySQL, C#, and GraphQL. With my expertise in these languages and tools, I can build robust and scalable server-side applications. I  ensure efficient data handling and seamless integration with front-end components, resulting in high-performance web applications.</p>

                                </div>

                            </li>

                            <li class="wow fadeInLeft" data-wow-duration=1.5s data-wow-delay=0.4s>

                                <div class=inner>

                                    <img class=svg src=img/svg/web.svg alt />

                                    <h3>Web Design</h3>

                                    <p>I have extensive experience in building seamless websites using HTML, CSS, JavaScript, .NET, React, and TypeScript. With my proficiency in these technologies, I create responsive and user-friendly interfaces that deliver an exceptional user experience.</p>

                                </div>

                            </li>

                        </ul>

                        <div class="lets_work wow fadeInLeft" data-wow-duration=1.5s>

                            <p>Are you interested in working with me? <a

                                    href="javascript:void(window.open('https://form.jotform.com/222501271546145','blank','scrollbars=yes, toolbar=no, width=700, height=500'))">

                                    Let's get started</a></p>

                            <p style="margin-top:12px;">Or <a href="mailto:patelashish584@gmail.com?subject=Coding%20or%20design%20challenge%20for%20Ashish">send me a coding or design challenge</a>; I'll reply with a short take.</p>

                        </div>

                    </div>

                </div>

            </div>

        </section>

        <section class="arlo_tm_section" id="how-i-work" aria-label="How I work">

            <div class="arlo_tm_services">

                <div class="container">

                    <div class="arlo_tm_main_title">

                        <span>Process</span>

                        <h3>How I work</h3>

                    </div>

                    <div class="service_inner" style="max-width:720px; margin:0 auto;">

                        <p style="margin-bottom:16px;">I use tools (including AI) intentionally. I lean on them for boilerplate, exploration, and documentation so I can focus on architecture, security, and domain logic. I don't treat generated code as final: everything goes through code review, tests where it matters, and staging before it ships. I validate with real requirements and iteration, not just output.</p>

                        <p style="margin-bottom:16px;">When I collaborate, I care about clear scope, feedback loops, and delivery. If you're hiring, you're getting someone who thinks in trade-offs and outcomes, not just features.</p>

                    </div>

                </div>

            </div>

        </section>

        <section class=arlo_tm_section aria-label="Stats">

            <div class=arlo_tm_counter_section>

                <div class=container>

                    <div class=counter_inner>

                        <ul class="wow fadeInLeft" data-wow-duration=1.5s>

                            <li>

                                <div class=list_inner>

                                    <h3 class=arlo_tm_counter data-from=0 data-to=6 data-speed=2000>0</h3>

                                    <span>Projects Completed </span>

                                </div>

                            </li>

                            <li>

                                <div class=list_inner>

                                    <h3 class=arlo_tm_counter data-from=0 data-to=15000 data-speed=2000>0</h3>

                                    <span>Lines of Code</span>

                                </div>

                            </li>

                            <li>

                                <div class=list_inner>

                                    <h3 class=arlo_tm_counter data-from=0 data-to=2500 data-speed=2000>0</h3>

                                    <span>Hours Spend Coding</span>

                                </div>

                            </li>

                            <li>

                                <div class=list_inner>

                                    <h3 class=arlo_tm_counter data-from=0 data-to=10 data-speed=2000>0</h3>

                                    <span>Programming Languages Worked With</span>

                                </div>

                            </li>

                        </ul>

                    </div>

                </div>

            </div>

        </section>

        <p class="arlo_tm_contact_prompt">Prefer a form? Open the contact button below.</p>
        <script>
        window.addEventListener('load', function(){
            var s = document.createElement('script');
            s.src = 'https://form.jotform.com/static/feedback2.js';
            s.onload = function(){ if (window.JotformFeedback) new JotformFeedback({formId:"222501271546145",buttonText:"Contact Me",base:"https://form.jotform.com/",background:"#000000 ",fontColor:"#FFFFFF",buttonSide:"left",buttonAlign:"center",type:false,width:700,height:500,isCardForm:false}); };
            document.body.appendChild(s);
        });
        </script>

        <footer class=arlo_tm_section role="contentinfo">

            <div class=arlo_tm_copyright>

                <div class=container>

                    <div class=inner>

                        <div class="copy wow fadeInLeft" data-wow-duration=1.5s>

                            <p>&copy; Copyright <span id="currentYear">2023</span> Ashish Patel. All rights reserved.</p>

                        </div>

                        <div class="social wow fadeInLeft" data-wow-duration=1.5s data-wow-delay=.2s>

                            <ul id="bottomSocial">

                                <li><a href=https://www.linkedin.com/in/ashish-patel-06961522b /><img class=svg

                                        src=img/svg/social/lin.svg alt /></a></li>

                                <li><a href=https://www.github.com/ashishpatel2 /><img class=svg

                                        src=img/svg/social/git.svg alt /></a></li>

                            </ul>

                        </div>

                    </div>

                </div>

            </div>

        </footer>

	</main>

        <div class="mouse-cursor cursor-outer"></div>

        <div class="mouse-cursor cursor-inner"></div>

    </div>

    <script src="js/jquery.js" defer></script>

    <!--[if lt IE 10]> <script type=text/javascript src=js/ie8.js></script> <![endif]-->

    <script src="js/plugins.js" defer></script>

    <script src="js/init.js" defer></script>

    <script>

    (function(){

      var key = 'portfolio-audience';

      var recruiterLine = 'Shipped a full-stack platform for a multi-location business; promoted at Health &amp; Wellness Partners.';

      var engineerLine = 'Full-stack: .NET, React, SQL, Next.js. Built Speed Trek (Next.js, Prisma, PostgreSQL, Azure).';

      var apply = function(audience){

        var wrap = document.getElementById('heroTypingWrap');

        var lineEl = document.getElementById('heroAudienceLine');

        var ctaWrap = document.getElementById('heroCtaWrap');

        if (!wrap || !lineEl || !ctaWrap) return;

        if (audience === 'recruiter') {

          wrap.style.display = 'none';

          lineEl.textContent = recruiterLine.replace(/&amp;/g,'&');

          lineEl.style.display = 'block';

          ctaWrap.innerHTML = '<a href="resume.html">See resume</a><a href="Projects.html">See projects</a>';

          ctaWrap.style.display = 'block';

        } else if (audience === 'engineer') {

          wrap.style.display = 'none';

          lineEl.textContent = engineerLine.replace(/&amp;/g,'&');

          lineEl.style.display = 'block';

          ctaWrap.innerHTML = '<a href="case-study-speed-trek.html">Case study</a><a href="Projects.html">Projects &amp; repos</a>';

          ctaWrap.style.display = 'block';

        } else {

          wrap.style.display = '';

          lineEl.style.display = 'none';

          ctaWrap.style.display = 'none';

        }

      };

      function init(){

        var r = document.getElementById('heroAudienceRecruiter');

        var e = document.getElementById('heroAudienceEngineer');

        if (r) r.onclick = function(ev){ ev.preventDefault(); try { sessionStorage.setItem(key,'recruiter'); } catch(z){} apply('recruiter'); };

        if (e) e.onclick = function(ev){ ev.preventDefault(); try { sessionStorage.setItem(key,'engineer'); } catch(z){} apply('engineer'); };

        try { apply(sessionStorage.getItem(key) || ''); } catch(z){ apply(''); }

      }

      if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init); else init();

    })();

    (function(){ var y = document.getElementById('currentYear'); if (y) y.textContent = new Date().getFullYear(); })();

    </script>

</body>



</html>