YOUCEF BNM FRONTEND DEVELOPER
YOUCEF BNM FRONTEND DEVELOPER
YOUCEF BNM FRONTEND DEVELOPER
YOUCEF BNM FRONTEND DEVELOPER
Crafting seamless user experiences with modern web technologies, Creating visually appealing websites. With a focus on clean code and responsive design.
About
Youcef Benmessabih, A freelance frontend Developer based in Oran Algeria.
speciality
Specializing in frontend development, Creating user friendly interfaces, With react and its ecosystem, and vanilla Js semantic HTML, and CSS, Tailwind.
experience
With more than three years of experience as a frontend developer, Worked on various projects from different industries
mindset
Focusing on performance optimization, from converting into modern webp images, to limiting API calls and minifying code, Having a good eye for design, I create interactive animations and transitions powerd by framer motion and CSS animations.
Ecommerce store for athletic shoes
Web design Studio website
Consulting agency landing page
Travel agency Website
SERVICES SERVICES
SERVICES SERVICES
SERVICES SERVICES
SERVICES SERVICES
React Development
Creating dynamic, high performance web applications using react, and leveraging its ecosystem and optimization tools.
vanilla Js
Using vanilla js and plain html and css to create robust and responsive websites.
responsive design
Ensuring that your website looks great and functions perfectly on all devices.
Design Conversion
Transforming design mockups into fully functional, responsive websites. Ensuring pixel-perfect implementation and preserving design integrity across all devices.
HOW IT WORKS
HOW IT WORKS
HOW IT WORKS
HOW IT WORKS
consultation
The process begins with an initial consultation to understand your needs, goals, and vision for the project.
20-30 minute session
1
planning
This step involves detailed discussions to gather all necessary information and to align on the project objectives.
5-10 minute to complete
2
development
Regular updates and reviews are provided throughout this phase to keep you informed of the progress
2-6 weeks to complete
3
TECHNOLOGIES I USE
TECHNOLOGIES I USE
TECHNOLOGIES I USE
TECHNOLOGIES I USE
My expertise in these technologies enables me to create dynamic, interactive, and user-friendly web applications that meet the needs of clients and users alike.
- JavaScript
TypeScript- React
Redux'%3e%3cpath%20d='M4.56519%2021.9771L4.72241%2021.7569L12.1599%207.64471L12.1756%207.49532L8.89698%201.33699C8.62229%200.821114%207.84901%200.951545%207.75886%201.52902L4.56519%2021.9771Z'%20fill='%234AFFFF'/%3e%3cpath%20d='M4.6579%2021.809L4.77683%2021.5771L12.1363%207.61276L8.86597%201.42938C8.59416%200.918912%207.90395%201.04904%207.81475%201.62047L4.6579%2021.809Z'%20fill='%23C4EEEA'/%3e%3cpath%20d='M14.5657%2012.1537L17.0068%209.65358L14.565%204.99206C14.3332%204.55081%2013.686%204.54954%2013.4566%204.99206L12.152%207.48013V7.69203L14.5657%2012.1537Z'%20fill='%2362F4F4'/%3e%3cpath%20d='M14.5221%2012.0494L16.8954%209.61885L14.5221%205.09979C14.2968%204.67081%2013.7493%204.62587%2013.5263%205.05608L12.2148%207.5827L12.1756%207.71187L14.5221%2012.0494Z'%20fill='%23C2EFEB'/%3e%3cpath%20d='M4.56519%2021.9775L4.63645%2021.9058L4.89539%2021.8006L14.4123%2012.319L14.5329%2011.9908L12.1588%207.4668L4.56519%2021.9775Z'%20fill='%23BBECE8'/%3e%3cpath%20d='M14.8705%2026.7587L23.4835%2021.9552L21.0239%206.80737C20.947%206.33343%2020.3655%206.14606%2020.0263%206.48589L4.56519%2021.977L13.1288%2026.7583C13.67%2027.0605%2014.3291%2027.0606%2014.8705%2026.7587Z'%20fill='%2368FDFD'/%3e%3cpath%20d='M23.4063%2021.9155L20.9654%206.88262C20.889%206.41229%2020.4055%206.21766%2020.0689%206.5549L4.66064%2021.9481L13.1302%2026.6821C13.6673%2026.982%2014.3214%2026.9822%2014.8587%2026.6825L23.4063%2021.9155Z'%20fill='%23BFEEEB'/%3e%3cpath%20d='M14.8705%2026.6175C14.3291%2026.9194%2013.67%2026.9193%2013.1288%2026.6171L4.63416%2021.9044L4.56519%2021.9772L13.1288%2026.7586C13.67%2027.0608%2014.3291%2027.0609%2014.8705%2026.759L23.4835%2021.9555L23.4624%2021.8257L14.8705%2026.6175Z'%20fill='%23D6F5F2'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_342_424'%3e%3crect%20width='25.971'%20height='25.971'%20fill='white'%20transform='translate(1.01447%201.01416)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e)
Firebase
HTML
CSS
Tailwind'%3e%3cpath%20d='M22.75%2014L14%2022.75'%20stroke='%23bdf9f9'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M21%204.375L4.375%2021'%20stroke='%23bdf9f9'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_352_65'%3e%3crect%20width='28'%20height='28'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e)
Shadcn
SASS'%3e%3cpath%20d='M9.36979%2027.9998C11.9458%2027.9998%2014.0365%2025.9092%2014.0365%2023.3332V18.6665H9.36979C6.79379%2018.6665%204.70312%2020.7572%204.70312%2023.3332C4.70312%2025.9092%206.79379%2027.9998%209.36979%2027.9998Z'%20fill='%23bdf9f9'/%3e%3cpath%20d='M4.70312%2014.0002C4.70312%2011.4242%206.79379%209.3335%209.36979%209.3335H14.0365V18.6668H9.36979C6.79379%2018.6668%204.70312%2016.5762%204.70312%2014.0002Z'%20fill='%23bdf9f9'/%3e%3cpath%20d='M4.70312%204.66667C4.70312%202.09067%206.79379%200%209.36979%200H14.0365V9.33333H9.36979C6.79379%209.33333%204.70312%207.24267%204.70312%204.66667Z'%20fill='%23bdf9f9'/%3e%3cpath%20d='M14.0364%200H18.7031C21.2791%200%2023.3698%202.09067%2023.3698%204.66667C23.3698%207.24267%2021.2791%209.33333%2018.7031%209.33333H14.0364V0Z'%20fill='%23bdf9f9'/%3e%3cpath%20d='M23.3698%2014.0002C23.3698%2016.5762%2021.2791%2018.6668%2018.7031%2018.6668C16.1271%2018.6668%2014.0364%2016.5762%2014.0364%2014.0002C14.0364%2011.4242%2016.1271%209.3335%2018.7031%209.3335C21.2791%209.3335%2023.3698%2011.4242%2023.3698%2014.0002Z'%20fill='%23bdf9f9'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_342_402'%3e%3crect%20width='28'%20height='28'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e)
Figma'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M27.0518%2012.7879L15.1596%200.89654C14.4752%200.21157%2013.3644%200.21157%2012.6791%200.89654L10.2097%203.36596L13.3422%206.49853C14.0703%206.25258%2014.9049%206.41754%2015.4853%206.99792C16.0684%207.58187%2016.2322%208.42374%2015.9802%209.15414L18.9992%2012.1731C19.7296%2011.9215%2020.5724%2012.0844%2021.1558%2012.6686C21.971%2013.4836%2021.971%2014.8045%2021.1558%2015.6201C20.3402%2016.4357%2019.0193%2016.4357%2018.2034%2015.6201C17.5901%2015.0063%2017.4386%2014.1055%2017.7491%2013.35L14.9336%2010.5345L14.9333%2017.9437C15.1321%2018.0423%2015.3198%2018.1735%2015.4853%2018.3385C16.3006%2019.1534%2016.3006%2020.4744%2015.4853%2021.2905C14.6698%2022.1058%2013.3482%2022.1058%2012.5339%2021.2905C11.7186%2020.4744%2011.7186%2019.1534%2012.5339%2018.3385C12.7353%2018.1374%2012.9684%2017.9852%2013.217%2017.883V10.4048C12.9684%2010.3032%2012.7356%2010.152%2012.5339%209.94938C11.9161%209.33255%2011.7676%208.42613%2012.0841%207.66765L8.99633%204.5793L0.842138%2012.7329C0.156869%2013.4185%200.156869%2014.5293%200.842138%2015.2143L12.7344%2027.1059C13.4191%2027.7909%2014.5296%2027.7909%2015.2152%2027.1059L27.0518%2015.2696C27.7368%2014.5843%2027.7368%2013.4729%2027.0518%2012.7879'%20fill='%23bdf9f9'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_342_481'%3e%3crect%20width='27.3438'%20height='27.2374'%20fill='white'%20transform='translate(0.328125%200.382812)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e)
Git