Praise Folorunso
Full Stack Developer
A results-driven Full Stack Developer with 3+ years of experience building scalable web applications and APIs for startups, agencies, and enterprise brands. Proficient in modern development frameworks, cloud technologies, and collaborative agile workflows. Passionate about delivering high-quality solutions, enhancing user experiences, and contributing to the open-source community.
HTML
CSS
Bootstrap
Node.js
Express.js
Tailwind
JavaScript
React.js
React Native
PHP Laravel
Solidity
Rust
Electron.js
GraphQL
REST API
// Professional Experience
Freelance Full Stack Developer
Remote • 2024 - Present
- Designed, developed, and deployed over 20 high-performance websites and web apps for clients globally, using React, Node.js, and MongoDB.
- Worked with Supadao on blockchain-integrated solutions, delivering secure, scalable decentralized applications.
- Collaborated with marketing agencies and e-commerce brands such as bundled, spring mall x to build custom CMS platforms and optimize online stores.
- Spearheaded API integrations with third-party services (e.g. flutterwave, Paystack, PayPal) for seamless user experiences.
- Improved website performance and SEO by implementing lazy loading, image optimization, and schema markup.
Software Developer (Contract) – Pepsa.co
Remote • 2023 - 2024
- Built and maintained scalable RESTful APIs using Express.js and integrated robust authentication workflows.
- Created dynamic dashboards for analytics using React and Chart.js, providing real-time business insights.
- Collaborated with UI/UX designers and QA teams to deliver polished products that exceeded client expectations.
// Selected Projects
NFT Marketplace – Supadao
Developed a fully functional NFT marketplace with wallet integration, real-time bidding, and advanced search filters. Ensured high security and efficiency by implementing smart contract interactions and encryption protocols.
React
Solidity
Web3
E-commerce Platform – Bundlet
Created a feature-rich online store with product customization, order tracking, and payment gateway integrations. Designed a customer-centric UI using Next.js and Tailwind CSS.
Next.js
Tailwind
REST API
// Code Sample
ProjectCard.jsx
1<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>=<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">"text-<span class="text-[#d4d4d4]">[</span>#6a9955<span class="text-[#d4d4d4]">]</span>"</span>>// Example React component</span><span class="text-[#d4d4d4]"></span>2<span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">import</span> <span class="text-[#d4d4d4]">{</span> <span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">useState</span>, <span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">useEffect</span> <span class="text-[#d4d4d4]">}</span> <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">from</span> <span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">'react'</span>;<span class="text-[#d4d4d4]"></span>3<span class="text-[#d4d4d4]"></span>4<span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">export</span> <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">default</span> <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">function</span> ProjectCard(<span class="text-[#d4d4d4]">{</span> project <span class="text-[#d4d4d4]">}</span>) <span class="text-[#d4d4d4]">{</span><span class="text-[#d4d4d4]"></span>5 <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">const</span> <span class="text-[#d4d4d4]">[</span>isHovered, setIsHovered<span class="text-[#d4d4d4]">]</span> = <span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">useState</span>(false);<span class="text-[#d4d4d4]"></span>6 <span class="text-[#d4d4d4]"></span>7 <span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">useEffect</span>(() => <span class="text-[#d4d4d4]">{</span><span class="text-[#d4d4d4]"></span>8 <span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>=<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">"text-<span class="text-[#d4d4d4]">[</span>#6a9955<span class="text-[#d4d4d4]">]</span>"</span>>// Load project data</span><span class="text-[#d4d4d4]"></span>9 <span class="text-<span class="text-[#d4d4d4]">[</span>#4ec9b0<span class="text-[#d4d4d4]">]</span>">console</span>.<span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">log</span>(<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">'Project loaded:'</span>, project.title);<span class="text-[#d4d4d4]"></span>10 <span class="text-[#d4d4d4]"></span>11 <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">return</span> () => <span class="text-[#d4d4d4]">{</span><span class="text-[#d4d4d4]"></span>12 <span class="text-<span class="text-[#d4d4d4]">[</span>#4ec9b0<span class="text-[#d4d4d4]">]</span>">console</span>.<span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">log</span>(<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">'Component unmounted'</span>);<span class="text-[#d4d4d4]"></span>13 <span class="text-[#d4d4d4]">}</span>;<span class="text-[#d4d4d4]"></span>14 <span class="text-[#d4d4d4]">}</span>, <span class="text-[#d4d4d4]">[</span>project<span class="text-[#d4d4d4]">]</span>);<span class="text-[#d4d4d4]"></span>15 <span class="text-[#d4d4d4]"></span>16 <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">const</span> handleClick = () => <span class="text-[#d4d4d4]">{</span><span class="text-[#d4d4d4]"></span>17 <span class="text-<span class="text-[#d4d4d4]">[</span>#4ec9b0<span class="text-[#d4d4d4]">]</span>">console</span>.<span class="text-<span class="text-[#d4d4d4]">[</span>#dcdcaa<span class="text-[#d4d4d4]">]</span>">log</span>(<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">'Project clicked:'</span>, project.title);<span class="text-[#d4d4d4]"></span>18 <span class="text-[#d4d4d4]">}</span>;<span class="text-[#d4d4d4]"></span>19 <span class="text-[#d4d4d4]"></span>20 <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">return</span> (<span class="text-[#d4d4d4]"></span>21 <div <span class="text-[#d4d4d4]"></span>22 className=<span class="text-[#d4d4d4]">{</span><span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">`card $<span class="text-[#d4d4d4]">{</span>isHovered ? 'card-hovered' : ''<span class="text-[#d4d4d4]">}</span>`</span><span class="text-[#d4d4d4]">}</span><span class="text-[#d4d4d4]"></span>23 onMouseEnter=<span class="text-[#d4d4d4]">{</span>() => setIsHovered(true)<span class="text-[#d4d4d4]">}</span><span class="text-[#d4d4d4]"></span>24 onMouseLeave=<span class="text-[#d4d4d4]">{</span>() => setIsHovered(false)<span class="text-[#d4d4d4]">}</span><span class="text-[#d4d4d4]"></span>25 onClick=<span class="text-[#d4d4d4]">{</span>handleClick<span class="text-[#d4d4d4]">}</span><span class="text-[#d4d4d4]"></span>26 ><span class="text-[#d4d4d4]"></span>27 <h3><span class="text-[#d4d4d4]">{</span>project.title<span class="text-[#d4d4d4]">}</span></h3><span class="text-[#d4d4d4]"></span>28 <p><span class="text-[#d4d4d4]">{</span>project.description<span class="text-[#d4d4d4]">}</span></p><span class="text-[#d4d4d4]"></span>29 <div className=<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">"tags"</span>><span class="text-[#d4d4d4]"></span>30 <span class="text-[#d4d4d4]">{</span>project.tags.map((tag) => (<span class="text-[#d4d4d4]"></span>31 <span key=<span class="text-[#d4d4d4]">{</span>tag<span class="text-[#d4d4d4]">}</span> className=<span <span class="text-<span class="text-[#d4d4d4]">[</span>#c586c0<span class="text-[#d4d4d4]">]</span>">class</span>="text-<span class="text-[#d4d4d4]">[</span>#ce9178<span class="text-[#d4d4d4]">]</span>">"tag"</span>><span class="text-[#d4d4d4]">{</span>tag<span class="text-[#d4d4d4]">}</span></span><span class="text-[#d4d4d4]"></span>32 ))<span class="text-[#d4d4d4]">}</span><span class="text-[#d4d4d4]"></span>33 </div><span class="text-[#d4d4d4]"></span>34 </div><span class="text-[#d4d4d4]"></span>35 );<span class="text-[#d4d4d4]"></span>36<span class="text-[#d4d4d4]">}</span><span class="text-[#d4d4d4]"></span>