My name is
Majid Laklouk

I design, write and test full stack applications in various languages and frameworks.

About me

Explore the rest of the page to learn more about me.

I'm a versatile full stack engineer and developer with a diverse
range of languages and technologies in my app development toolkit.

Full stack engineering

I have strong practical experience in many areas of software engineering:

  • OOP and functional programming
  • Strongly and dynamically typed languages
  • Automated testing and CI/CD
  • Unit, integration and E2E testing (TDD)
  • Using and writing documentation

Collaborative development

I know how to work effectively as part of a software development team, through:

  • Version control and git workflows
  • Peer/mob programming and code review
  • Collaborative practices of agile and scrum
  • Working with user stories and requirements
  • Debugging and refactoring code

N-tier app architecture

I've written several full-stack applications that leverage the following:

  • Angular, React and Vue
  • Responsive, mobile-first design
  • Plain CSS plus popular CSS frameworks
  • Plain HTML and JS with jQuery and PHP
  • Separation of concerns and modularity

Data-centric apps

I create complex, modular CRUD apps that are built around:

  • MVC REST APIs that I've created
  • Third-party JSON API services
  • Web APIs and dev tools
  • Asynchronous data fetching
  • Reactive UI + conditional rendering
  • State management with Redux + NgRx
  • User authentication + authorisation

Data modelling & SQL

When it comes to working with data, I'm well-versed in these key areas:

  • SQL in multiple flavors
  • Non-relational databases
  • Data normalisation
  • Complex SQL join queries
  • SQL schema constraints

Tech stack

I have practical experience in working with a variety of languages, frameworks and technologies within web development.

Programming languages      

      Application frameworks

Libraries and technologies      

      Testing frameworks

Programming languages

Application frameworks

Libraries & technologies

Testing frameworks

Experience in software development

For further details, download my attached Curriculum Vitae.

Software engineering bootcamp

Oct 2022 - Feb 2023

  • Front end development with React, HTML and CSS
  • Back end development with Node and Express
  • HTTP servers and REST APIs
  • Version control and collaborative git workflows
  • Pair programming and code review
  • Test driven development

C# development training

Mar 2023 - Apr 2023

  • C# and .NET fundamentals
  • Object oriented programming
  • Collaborative group projects
  • Working in agile teams using scrum framework
  • SQL Server and Entity Framework
  • Data modelling and database design
  • Unit testing and debugging

Coding traineeship

Jun 2023 - Feb 2024

  • Full stack engineering career pathway
  • Strong focus on practical web development projects
  • Front end development with React, Angular and Vue
  • Advanced SQL and data modelling
  • JavaScript, TypeScript, PHP and Python
  • jQuery and Bootstrap

My Projects

Explore some of the projects I've published.

jQuery & PHP projects

Each of the following is a single-page application featuring jQuery, AJAX, Bootstrap and server-side code written in PHP.

Gazetteer app
PHP and jquery gazetteer app

Front-end app that uses reverse geocoding APIs to reveal a wealth of information about countries, including points of interest, weather, news, demographics, currency exchagne rates, wikipedia articles and more.

Company directory
PHP and jquery CRUD app

CRUD application featuring PHP, MySQL and jQuery. Data model allows user to update, add and remove entries for personnel, departments and locations. Includes search and filter functionality.

Full stack applications

Each of the following is a three-tier application consisting of a database layer (created in PSQL and MongoDB), a front end (written in Angular, React and Vue) and a dedicated REST API service (written in Express, Laravel and Django) providing JSON data to the front end.

Ecommerce platformAdvanced ecommerce platform
angular scifi project

An ambitious and artful project brimming with advanced features. Written in TypeScript using Angular, RxJS and NgRx and featuring comprehensive cart and checkout systems, wishlist, order history, customer account, and lots more.

3D geometric sim
3D React geometric sim

A multi-view geometric simulation based on John Conway's Game Of Life. Created using React and Three.js. Features CRUD functionality and user authentication - plus a swanky controls UI allowing for lots of interactivity.

Next.js & Laravel
NXExams: a Next.js and Laravel app

A responsive mobile-first app that leverages Laravel's powerful features and Next13's React components. Features reverse geocoding using Bing Maps API and utility-basesd styling using Tailwind CSS.

Message board app
NC News: a React and Express full stack application

This is a social app in the form of a CRUD application with a React front end and a JavaScript JSON API developed with Node and Express. Includes integration testing with SuperTest.

Front end apps

Here are a few other standalone apps that I have created - this time, without an accompanying back end service.

Reddit browser
Reddit API, TypeScript and Vue application.

A stylish application for browsing and searching reddit, written in TypeScript using Vue's Composition API and reactivity system. The UI is constructed using data from the reddit JSON API, including latest threads, subreddits and users.

Spotify playlist app
Jamming: a music playlist app

A React application that allows users to search Spotify music library and create/edit playlists via the Spotify Web API, authorising them via access tokens and a front-end OAuth flow.

Vue API interface
Vue API interface

A CRUD application written using Vue's Options API, reactivity features and Single-File Components. Styling aided by Bootstrap.

Swagger UI & OpenAPI
Swagger UI and OpenAPI app

RESTful API design with Swagger UI, serving as visual documentaion for one of my REST API projects, using Open API specification within a YAML document.

3D project portfolio
Vue API interface

A 3D application written using React-three-fiber and other Three.js libraries

  • Features
  • Full-screen map display rendered using Leaflet JavaScript library.
  • Uses GeoJSON data to highlight country borders.
  • Each interaction triggers an AJAX call and a PHP script that makes API requests via cURL.
  • Provides data about each country: points of interest, cities and airports, weather, demographics data, latest news, currency exchange rates and public holidays.
  • Application architecture
  • This is a single-page application that loads a JS script which triggers AJAX requests in response to a variety of user interactions. These AJAX requests (GET / POST) are routed to a PHP file on the same web server which makes calls to various APIs to retrieve the specific data that was requested by the AJAX call.
  • Features
  • Based on a relational data model that uses a MySQL database server to store normalised data.
  • User interaction triggers execution of queries and prepared statements.
  • Includes filter and search functionality.
  • Database schema includes foreign key constraints and unique constraints to maintain data integrity.
  • Application architecture
  • This is a single-page application that loads its main JS file which listens for various events and triggers AJAX requests to various PHP scripts on the web server. Those scripts are responsible for connecting to a relational database and executing various parameterised queries. The database itself has 3 tables: personel, departments and locations. User interactions on the front end allows for data retrieval, creation, deletion and updates.
  • Features
  • A full-featured cart system.
  • Multi-step checkout that includes address forms, cart details, and the ability to modify item quantities
  • Mock payments processing via Stripe API, featuring multiple payment methods.
  • User authentication and authorisation via local accounts as well as SSO (Amazon, FB and Google).
  • HTML views constructed using Angular Material and styled with Sass.
  • Dark and light themes implemented via Sass variables and mixins.
  • Allows filtering and searching products.
  • Allows customer to view order history, product reviews and customer reviews.
  • Documented with Swagger & OpenAPI.
  • Comprehensive integration testing with Mocah, Chai and Supertest.
  • Application architecture
  • Written entirely in object-oriented TypeScript, this is a service-based and side-effect-driven application that utilises advanced features of Angular to provide a rich user experience. For the back end, I used Prisma ORM to construct my data model and perform all SQL queries.
  • Features
  • Featuring a 3D scene with fully adjustable camera, click interactivity, postprocessing effects and complex dynamic functionality.
  • Dynamic 3D and 2D views synchronised through unified state management.
  • Makes extensive use of React hooks, recursive algorithms and geomtric computations to continually update the game board.
  • A generous control panel offering the ability to interact with the game in various ways (such as changing speed, appearance, zoom, reset, clear, and so on).
  • Autoamted API testing done in an object-oriented approach.
  • Full CRUD functionality allowing users to fetch and save patterns, update thier personal account and interact with other users by way of posting comments.
  • JWT authentication
  • Application architecture
  • I wrote and tested the back end in Pythong using Django REST framework. I decided to try out a non-relational data model for the API and chose Mongo DB to manage and store the application's data.
  • Features
  • Mobile-first design that thoroughly implements responsive design principles.
  • Automated testing with a CI/CD workflow configured using Github Actions.
  • Developed in a test-driven manner using PHPUnit and Laravel's fluent JSON syntax (based on closures and the AssertableJson class).
  • Utility-based styling with Tailwind CSS.
  • Leverages back end and front end form validation.
  • Implements dynamic filtering and pagination with multiple active queries.
  • Application architecture
  • I wrote and tested the back end in PHP, following a strict object-oriented MVC pattern and taking full advantage of Laravel's user authentication and authorisation features, impressive ORM, facades and helper functions. The data layer is in the form of a PSQL database server which is connected to Laravel in the production phase and benefits from easy-to-manage migrations and seeding. During development, I used an SQLite database for convenience.
  • Features
  • User authentication and comprehensive error handling, on both the back end and front end.
  • Automated testing with Jest + SuperTest and a CI/CD workflow configured using Github Actions and yaml.
  • Developed in a test-driven manner following the red-green-refactor cycle, with frequent code reviews from peers.
  • API performs complex SQL join queries, allowing for a wide variety of optional query parameters.
  • Application architecture

  • I wrote the back end in Node, using Express and a node-specific PSQL driver that allowed me to programmatically seed my database for testing and development.

    The API conforms to the design principles of REST and is architected in an MVC fashion, with clear separation of concerns all the way throughout the application.

    Lastly, the front end receives JSON data from the API and offers a highly interactive UI enabling all CRUD operations.

  • Features
  • Constructed using JSON data from the redit API.
  • Contains interactive multimedia content.
  • Complete with image galleries and slideshows written from scratch.
  • End-to-end testing with Cypress.
  • Strict type-checking and type-based declarations fully integrated into every part of the app.
  • Unit testing with Mocha and Chai.
  • Application design
  • This app leverages Vue's declarative rendering, directives and reactivity APIs to maximum effectiveness, creating reusable Single-File Components that emit and listen to events, with strongly-typed props and plenty of conditional rendering and other nifty features.
  • Features
  • Uses React class components.
  • Enables users to search through Spotify library and paginate through results.
  • Enables users to update and save playlists.
  • The app makes GET and POST requests to the Spotify web API.
  • Client-side authorisation workflow uses access tokens received from the API.
  • Application design
  • Object-oriented approach to writing and configuring React components. This is now a legacy feature, but it's worth being familiar with for older applications that have yet to migrate to function components.
  • Features
  • Authored using the Options API with its object-based syntax.
  • Data fetching using async/await, Fetch API and Vue's lifecycle hooks.
  • Features client-side routing and programmatic navigation using Vue Router.
  • Elegant styling with Bootstrap v5.
  • Application design
  • This is a single-page JavaScript application that utilises declarative rendering and Vue's async methods and lifecycle hooks to update the UI in response to user interactions.
  • Features
  • OpenAPI definition constructed using YAML.
  • Serves as documentation for a fully-featured e-commerce RESTful API.
  • Allows full interaction with all API endpoints - GET, POST, PUT and DELETE.
  • Application design
  • This app uses Swagger tools to visualise an OpenAPI Specification definition for a RESTful API in an interactive UI.
  • Features
  • Features multiple 3D scenes with lighting and postprocessing effects.
  • Uses an interactive camera and various image filter effects.
  • Interactive buttons and links superimposed atop 3D text component.
  • Application design
  • This is a front-end app and is composed of multiple 3D scenes facilitated by react three fiber and react three drei.

Repositories

My public GitHub repositories.