Home About Skills Projects Experience Services Deployment Contact
Available for Freelance Projects

Hi, I'm Noor-ul-Ain Maryam.
I Design. I Build. I Learn.

Full-Stack Web Developer
UI/UX Designer
MERN Stack
PERN Stack
Computer Science Senior

I build responsive websites and craft visually engaging designs — blending technical and creative skills to deliver digital experiences, one project at a time.

↓ Download Resume
const app = express()
app.listen(4000)
// deploy ready ✓
GET /api/v1
Database
</>
MERNPERNUI/UXFigma
About

Where Design Meets Engineering.

I'm a BS Computer Science student building responsive websites and visually engaging designs — blending technical and creative skills, and continuously growing my expertise in modern web technologies and design tools. Currently looking for an internship to apply and grow my skills in a professional environment.

DesignDevelopmentDatabaseDeployment
0+
Projects Built
MERN/PERN
Stack Learner
UI/UX
Design Practice
6th
Semester, BS CS
UI/UX Design

Designing Experiences People Love.

Every interface starts as a question about a person's goal, not a canvas to fill.

User Research

Understanding behavior before pixels.

User Flow

Mapping the shortest path to value.

Wireframing

Structure first, decoration second.

Prototyping

Clickable, testable, real enough to judge.

Design Systems

Components that scale without drifting.

High-Fidelity UI

Detail that reads as craft, not decoration.

Responsive Design

One system, every viewport.

Usability

Tested with real people, not assumptions.

Research Wireframe Prototype UI Design Test Improve

Fintech Dashboard

Wireframe → Hi-Fi UI

E-commerce Design System

Components + Tokens

Mobile Onboarding Flow

Prototype · Usability Tested
Full Stack Development

From Frontend to Backend.

One coherent system, from the button click to the row in the database.

React
JS
Node.js
EX
Express.js
DB
Database

MERN Stack

MongoDB · Express.js · React · Node.js
M
E
R
N

PERN Stack

PostgreSQL · Express.js · React · Node.js
P
E
R
N
Deployment & DevOps

From Code to Production.

Design and code mean nothing until real users can reach them — reliably, securely, every time.

01
Code
02
Git
03
GitHub
04
Build
05
Server
06
Database
07
Domain
08
SSL
09
Production
Git
GitHub
Linux
VPS
Nginx
Docker
CI/CD
REST APIs
Env Variables
SSL / HTTPS
Domain Config
DB Deployment

// deployment_status.json

● Live
Build
Server
Database
SSL
Deployment
Live
Skills

The Full Toolkit.

Every layer of the stack, covered.

UI/UX

  • Figma
  • Responsive Design
  • Visual Design

Frontend

  • HTML
  • CSS
  • JavaScript

Full Stack

  • MERN Stack
  • PERN Stack
  • SQL

Programming

  • C++
  • Java
  • Python

Currently Exploring

  • Artificial Intelligence
  • Machine Learning
  • Software Engineering
Projects

Selected Work.

Designed, built and deployed end to end.

Plagiarism detection tool terminal output showing 100% accuracy

Plagiarism Detection Tool

A Python NLP tool that vectorizes text with TF-IDF and flags plagiarism using cosine similarity against an 80% threshold — achieved 100% accuracy on the sample dataset.

Threshold 80% Accuracy 100% N-gram (1,2)
PythonTF-IDFScikit-learnNLP
Meridian Library Management System dashboard Meridian Library Management System book catalog Meridian Library Management System members list Meridian Library Management System issue a book Meridian Library Management System reports

Library Management System

Meridian — a full-stack library admin dashboard: a React (Vite + Tailwind) frontend talking to a Node.js/Express REST API, with JWT-based login and a persistent JSON-file backend. Covers book catalog CRUD, member records, issuing/returning books, categories, authors, and a reports view with charts for issued-vs-returned trends and category stats.

Auth JWT API routes 8 Storage Persistent
Dashboard
Books
Members
Issue a Book
Reports
ReactViteTailwindNode.jsExpressREST APIJWT
MedCare Hospital dashboard MedCare Hospital find a doctor MedCare Hospital book appointment MedCare Hospital my appointments MedCare Hospital patient profile MedCare Hospital lab reports and emergency

Hospital Appointment System

MedCare Hospital — a full hi-fi UI/UX design mapping the booking flow, from dashboard to doctor listing, appointment booking, patient profile and lab reports.

Dashboard
Find a Doctor
Book Appointment
My Appointments
Patient Profile
Lab Reports & Emergency
GraphicsUI/UXFigma

ATVTI — Institute Website

Full institute website designed, built and deployed to production.

Full StackDeployment

Axiom Intelligent Solutions

Software house site for a web, mobile & AI product studio — designed, built and deployed to production.

Full StackDeployment
Experience & Education

My Journey So Far.

Still learning, still building — one step at a time.

BS Computer Science

National Skills University, Islamabad·2023 — 2027

Currently in 6th semester, building a foundation across programming, web development and design.

C++JavaPythonSQL

Web Developer

Axiom Intelligent Solutions·Current

Working as a Web Developer, building and maintaining full-stack projects — from frontend interfaces to backend integration and deployment.

Full StackReactNode.jsDeployment

Full-Stack Web Developer Intern

Axiom Intelligent Solutions·2 Months

Built and deployed two full-stack websites end to end — atvti.com and solutions.atvti.com — covering design, development and production deployment.

HTML/CSS/JSFull StackDeployment

Sales & Telemarketing Executive

Getel Marketing Company·5 Months

Handled outbound sales calls to promote and close products, contributing to team targets through proactive client engagement.

Client EngagementCommunication

Intermediate in Computer Science

Global College for Girls, Rawalpindi·Grade: A

Subjects: Math, Physics, Computer — where my interest in technology and design first took shape.

Services

How I Can Help.

Open to internships, freelance projects and collaborations.

UI/UX Design

Wireframes and clean, visually engaging interfaces in Figma.

⟨/⟩

Frontend Development

Responsive, well-structured builds in HTML, CSS and JavaScript.

M

MERN Development

Building applications with MongoDB, Express, React and Node.

P

PERN Development

Building applications with PostgreSQL, Express, React and Node.

Full Stack Projects

Comfortable working across the frontend, backend and database.

Website Deployment

Getting a finished site live and running on a real domain.

Contact

Let's Build Something Great.

Have an idea, application or product that needs to be designed, developed and deployed? Let's make it production-ready.

@
noorulainmaryam18@gmail.com
+92 331 2377666
Islamabad, Pakistan
plagiarism_detector.py
import numpy as np
import pandas as pd
from sklearn.feature_extraction.text import TfidfVectorizer
from sklearn.metrics.pairwise import cosine_similarity
from sklearn.metrics import accuracy_score

# Step 1: Load data from files
original_file_path = r'c:\Users\user\Desktop\Khadija\original.txt'
plagiarized_file_path = r'c:\Users\user\Desktop\Khadija\plagiarized.txt'

with open(original_file_path, 'r', encoding='utf-8') as f:
    original_texts = f.readlines()

with open(plagiarized_file_path, 'r', encoding='utf-8') as f:
    plagiarized_texts = f.readlines()

if len(original_texts) != len(plagiarized_texts):
    raise ValueError("The two files must have the same number of documents.")

df = pd.DataFrame({'original': original_texts, 'plagiarized': plagiarized_texts})

# Step 2: Preprocess and vectorize text
vectorizer = TfidfVectorizer(stop_words='english', ngram_range=(1, 2))
original_vectors = vectorizer.fit_transform(df['original'])
plagiarized_vectors = vectorizer.transform(df['plagiarized'])

# Step 3: Compute similarity
similarity_scores = cosine_similarity(original_vectors, plagiarized_vectors)
df['similarity_score'] = np.diagonal(similarity_scores)
df['similarity_percentage'] = (df['similarity_score'] * 100).round(2)

# Step 4: Threshold-based plagiarism detection
threshold = 80.0
df['plagiarized_detected'] = df['similarity_percentage'] >= threshold

# Step 5: Evaluate accuracy
y_true = [True] * len(df)
y_pred = df['plagiarized_detected'].tolist()
accuracy = accuracy_score(y_true, y_pred) * 100

print("Plagiarism Detection Results:")
print(df[['original', 'plagiarized', 'similarity_percentage', 'plagiarized_detected']])
print(f"\nAccuracy: {accuracy:.2f}%")