My Portfolio

Check out some of my work ..

Mini Social Network

#NodeJs #ReactJs #ExpressJs #GraphQL #MongoDB

A small social network app with basic features:
** Rigister & Login users using JWT Token.
** Create new posts and delete them.
** Interact with other users (like + comment).
** Used context API to manage app states.
** Fetching each user avatar image from his email, store it and integrate it with each user profile.
** The application developed using MERN JavaScript Stack along with GraphQL.
** Backend API implemented with NodeJs (ExpressJs framework) for server, MongoDB for database (Atlas for hosting DB) and GraphQL to setup and customize API requests and response.
** Frontend SPA application implemented with ReactJs and custom hooks.
** UI implemented with Semantic UI library.

Movies TV Info SPA

#ReactJs #ReduxJs #API #SPA #JavaScript

A single page application (SPA) to search for a movie/TV show details. The application build with ReactJs library and ReduxJs to manage the app states and with external API (OMDB) to fetch the search text data.
Calling an external API (OMDB) to fetch the movies or the TV series data and manipulate it inside the application with Redux integration.
Basically I focused on React and Redux, but more in depth on Redux for more understanding. I also made a Youtube playlist tutorial on this project (link below).

DevsNetwork: Network For Developers

#NodeJs #ReactJs #ExpressJs #ReduxJs #MongoDB

A developers social network created entirely using MERN JavaScript Stack technologies (MongoDB - ExpressJs - ReactJs - NodeJs). Network includes basic features:
** Rigister & Login users using JWT Token.
** Fetching each developer avatar image and integrate it in developer's profile.
** Ability to fetch developer Github repos from his account using Github API.
** Developer can create his own profile including his skills, projects, personal info and social platforms links.
** Developers can create posts and interact with each other like any other platform.

WordPress: Build a Theme From Scratch


This is a short series I made on Youtube to be like an intro to WordPress Themes development field. Obviously, Wordpress development is a big world and has a lot of branches to be covered; so in this series I tried to introduce some basic instructions and techniques about Wordpress like how to setup the basic theme template files anarchy and integrate them with the theme, how to setup menus & widgets and more important how to deal with the Wordpress Customizer API to add custom options and settings.

INSPIRE Template Design

#HTML #CSS #Bootstrap #jQuery

A single-page template for a start-up company website, used basic HTML tags with CSS (Bootstrap UI library), JavaScript jQuery library for functionality, and Font Awesome library for font icons.