This repository contains the source code for the portfolio website of Ababil Mustaqim, a Backend developer from Bandung.
The website is written in HTML and provides a comprehensive view of Ababil Mustaqim's skills and projects. It also contains links to his online profiles and a mail option for getting in touch.
Here is the basic structure of the website:
- Header with analytics and SEO meta tags
- The main page where you can see the brief introduction, and navigation links to the specific portions of the website.
- About Me: This section delivers details about Ababil's interests, his role, and the location.
- Skills: This section provides information on the programming languages, backend technologies, mobile, desktop, databases, libraries & frameworks, development tools, deployment, testing, and human languages that Ababil is familiar with.
- Projects: This section showcases the projects that Ababil has worked on with a brief description and the technologies used.
- Links: This section contains links to Ababil's GitHub, LinkedIn, Twitter, Instagram, StackOverflow, Telegram, and HackerRank profiles.
- The scripts for the website's functionality
For the styles, Ababil has used Google fonts and Font Awesome for the icons. The website also has a dark-mode toggle functionality.
You don't need any special prerequisites to view this website. Any modern browser which supports the latest web standards is enough.
To view this website locally:
- Clone the repository
- Navigate to the directory and open
index.htmlusing your web browser
Here are the updates planned for bolstering the website:
The website will be migrated from static HTML to the React framework. This is done for several reasons.
- To utilize the component-based architecture provided by React for improved code maintainability and readability.
- To take advantage of React’s Virtual DOM and other optimizations for better performance.
- To integrate with modern front-end tools and practices like Webpack, Babel, and JSX.
- To prepare for potential future enhancements which may utilize dynamic content and interactivity provided by a JavaScript framework.
The implementation process involves:
- Setting up a new development environment using Create React App.
- Converting each of the major UI blocks of the website into individual React components.
- Testing each component thoroughly during and after the transition process.
A custom backend will be built to serve the website, replacing the current static hosting. The primary motivations for this undertaking are:
- To implement dynamic content and features in future updates, requiring server-side logic.
- To add a proper CMS (Content Management System) for easier updates and management of the content shown on the website.
- To introduce data analytics and performance monitoring, by logging visits, interactions, errors, and latencies on the server side.
The implementation process encompasses:
- Choosing an appropriate backend tech stack. Node.js with Express.js or Python with Django are possible choices.
- Designing and implementing the server-side logic required to serve the current website content.
- Building a CMS for managing the website content, if not available out of the box with the chosen tech stack.
- Testing the backend thoroughly during and after the development process.
These changes represent a significant upgrade to the current website. They will enable easier management, better potential for future enhancements, and provide an improved user experience. Implementation will be handled with care to prevent disruption to the current website during the transition.