Menu
A Plus Logo
Arrow Up Icon

Hello !, I'm Arvin Ramezani

A ReactJS and NodeJS Web Developer

Explore My Portfolio of Practice Projects and Courses

Contact Me Today to Discuss Your Next Project

FreeLancer
Arvin Ramezani

About Me

Hey there, I'm Arvin Ramezani, a self-taught ReactJS and NodeJS Web Developer. Over the past three years, I started learning the ins and outs of web development through Persian online courses, and then continued my education on Udemy with a focus on courses offered by Academind Company.

I believe in continuous learning and staying up-to-date with the latest skills and tech tools, and my current areas of focus is automated testing with Jest / Vitest and Cypress.

If you're interested in working with me, feel free to download my resume and get in touch. I'm always happy to chat about potential collaborations and new opportunities.

Skills

  • HTML

    HTML

  • CSS

    CSS

  • JavaScript

    JavaScript

  • NodeJS

    NodeJS

  • ReactJS

    ReactJS

  • NextJS

    NextJS

  • Redux

    Redux

  • Styled-Components

    Styled-Components

  • Framer-Motion

    Framer-Motion

  • NestJS

    NestJS

  • TypeScript

    TypeScript

  • MongoDB

    MongoDB

Experiences

Madaar al zaki logo

Madar Al Zaki

/

Front End Developer

Dubai, United Arab Emirates
-Remote
  • Check IconDeveloped the front end of a site using TailwindCSS, Next.js, TypeScript, and Framer Motion.
  • Check IconImplemented state management using Zustand and form validation with ZOD and react-hook-form.
  • Check IconIntegrated user registration and login with NextAuth.js.
  • Check IconContributed to the backend development of the project, which was built with PostgreSQL and Nest.js.
Project Section BackgroundProject Section Background

My Projects

Realtor App

Project Realtor App Cover
play icon
  • bullet iconSwagger
  • bullet iconNestJs
  • bullet iconPrisma
  • bullet iconPostgreSQL

This is a practice project from The Nest JS Bootcamp - Complete Developer Guide Course. A simple API side of Realtor app like Realtor.com ,where Users can sign up as realtors to display and sell their homes, while other users can sign up as buyers to message realtors and buy specific houses. This was a very simple app, but it taught me a lot about different parts of the NestJS framework, such as ORM integration, middleware, interceptors, guards, decorators, param decorators, and integration testing. Additionally, I learned how to use Swagger for API documentation and applied it to this project.

more...

Pizza Shop

Project Pizza Shop Cover
play icon
  • bullet iconNextJS
  • bullet iconTypeScript
  • bullet iconMongoose
  • bullet iconredux-toolkit
  • bullet iconframer-motion
  • bullet iconstyled-compnents
  • bullet iconreact-hook-form

This is a practice project which I create after watching NextJS Academind Course to practice what I learned in the course. (File Upload, Authentication and Authorization, Form validation using react-hook-form and yup).
I used next-auth for authentication.
I learned a lot about animations with framer-motion and how it works together with styled-components to create reusable components.
I was already familiar with redux-toolkit but had not used RTK Query before. I practiced using it in NextJS in this project, also I practiced how to work with Map API (Mapbox).

more...

MERN Simple Watch Shop

Project MERN Simple Watch Shop Cover
play icon
  • bullet iconTypeScript
  • bullet iconMongoose
  • bullet iconredux-toolkit
  • bullet iconMaterial UI
  • bullet iconreact-hook-form
  • bullet iconaxios

This is a practice MERN project in which I focused on implementing authentication and authorization with accessToken and refreshToken. To enhance the user interface, I used react-hook-form with yup for form validation. I utilized material-ui for UI library, I practiced implementing a shopping cart with redux-toolkit, By working on this project I gained hands-on experience in developing a web application with user authentication and authorization features.

more...

MERN Animals House

Project MERN Animals House Cover
play icon
  • bullet iconTypeScript
  • bullet iconMongoose
  • bullet iconredux-toolkit
  • bullet iconstyled-components
  • bullet iconframer-motion
  • bullet iconreact-hook-form
  • bullet iconaxios

I worked on a MERN project that focused on authentication and authorization using accessToken and refreshToken, which accessToken will expire after 180 seconds. I also utilized react-hook-form with yup for client-side form validation. To improve the user experience, I implemented a loading skeleton and utilized styled-components for the UI library. For animations, I used framer-motion to create smooth and seamless transitions between components. To fetch data, I practiced using redux-thunk in redux-toolkit, and I also learned how to fetch data using searchQueryParams.

more...
Project Section BackgroundProject Section Background

Courses

ChatGPT - The Complete Guide

ChatGPT - The Complete Guide

What I Learned:
  • Check IconHow Was ChatGPT Created, And How Does It Work?
  • Check IconWhat is features and limitations are ?
  • Check IconUnderstanding Tokens
  • Check IconChatGPT Hallucinations
  • Check IconPrompt Engineering
  • Check IconUsing ChatGPT for utility tasks and content creation
  • Check IconHandson ChatGPT Midjourney for Content Creation
  • Check IconUsing ChatGPT for Programming Web Development
  • Check IconHow To Use GPT APIs ?
  • Check IconAutoGPT LangChain Building Automated AI Tools
more...
Next.js & React - The Complete Guide

Next.js & React - The Complete Guide

What I Learned:
  • Check IconAuthentication and Authorization with next-auth
  • Check IconSSG - SSR - ISR - CSR
  • Check IconFile Upload and Download
  • Check IconOptimizing Nexjs Apps
more...
Cypress End-to-End Testing - Getting Started

Cypress End-to-End Testing - Getting Started

What I Learned:
  • Check IconFundamentals and Basics
  • Check IconDeep Dive: A Closer Look at Element Selection, Actions and Assertions
  • Check IconTest Organization and Configuration: Custom Commands and Queries
  • Check IconWorking with Stubs, Spies, Fixtures & Manipulating the Clock
  • Check IconHTTP Requests, Databases & Authentication
more...
JavaScript Unit Testing - The Practical Guide

JavaScript Unit Testing - The Practical Guide

What I Learned:
  • Check IconAdjusting The Development Environment (Test Runner & Assertion Library)
  • Check IconUnit Testing Fundamentals
  • Check IconAAA Pattern - Arrange, Act, Assert
  • Check IconWhat to test ?
  • Check IconHow to Write Good Tests ?
  • Check IconIntegration Testing
  • Check IconBalancing Unit and Integration Tests
  • Check IconAdvanced Testing Concepts
  • Check IconMocking & Spies Dealing with Side Effects
more...
React Native - The Practical Guide

React Native - The Practical Guide

What I Learned:
  • Check IconDebugging React Native Apps
  • Check IconDiving Deeper into Components, Layouts & Styling - Building a Mini-Game App
  • Check IconBuilding Adaptive User Interfaces (Adapt to Platform & Device Sizes)
  • Check IconReact Navigation
  • Check IconRedux and Context API
  • Check IconHandling User Inputs
  • Check IconUser Authentication
  • Check IconUsing Native Devices Features
  • Check IconPush Notifications
more...
SQL - The Complete Guide (MySQL, PostgreSQL & more)

SQL - The Complete Guide (MySQL, PostgreSQL & more)

What I Learned:
  • Check IconCore SQL Syntax & Rules
  • Check IconManaging Tables & Working With Data Types
  • Check IconCRUD Operations With SQL
  • Check IconData Normalization & Relationships (Splitting & JOINing Data)
  • Check IconComposite Primary Keys & Composite Foreign Keys
  • Check IconSelf-Referential Relationships
  • Check IconGrouping & Aggregate Functions
  • Check IconDatabase Transactions
  • Check IconUsing Indexes
more...