Welcome to the repository for my personal website. This website showcases my work as a Software Developer, Web Designer, and Architect. It includes my portfolio, blog posts, and ways to contact me.
/
|-- HTML/
| |-- aboutme.html # About Me page
| |-- blog.html # Blog page
| |-- contactme.html # Contact Me page
| |-- home.html # Home page
| |-- projects.html # Projects page
|
|-- CSS/
| |-- home/
| |-- dark.css # Styles for dark theme
| |-- light.css # Styles for light theme
| |-- projects/
| |-- dark.css # Styles for dark theme
| |-- light.css # Styles for light theme
| |-- blog/
| |-- dark.css # Styles for dark theme
| |-- light.css # Styles for light theme
| |-- aboutme/
| |-- dark.css # Styles for dark theme
| |-- light.css # Styles for light theme
| |-- contactme/
| |-- dark.css # Styles for dark theme
| |-- light.css # Styles for light theme
|
|-- JS/
| |-- home/
| |-- scripts.js # JavaScript file
| |-- projects/
| |-- scripts.js # JavaScript file
| |-- blog/
| |-- scripts.js # JavaScript file
| |-- aboutme/
| |-- scripts.js # JavaScript file
| |-- contactme/
| |-- scripts.js # JavaScript file
|
|-- IMAGES/ # Directory for images used on the website
|
|-- README.md # This README file
The Home page provides an introduction to who I am and highlights key sections of the website.
-
Welcome Section: A brief welcome message and a summary of my roles and skills.
-
Works and Blogs: These sections showcase a preview of my projects and latest blog posts. Each entry is interactive and responsive to the cursor, featuring hover animations that enhance user experience.
-
Header and Footer: Both contain navigation elements with hover animations for a more engaging interface. The header includes links to other pages of the website, and the footer provides quick links to my social media profiles and an "up" button for easy navigation back to the top of the page.
The Work page lists all of my projects, each with a brief description and a link to their GitHub repository or detailed view.
- Project Listings: Each project is displayed with an image, title, and description. Clicking on a project will either redirect to the corresponding GitHub repository or, for non-GitHub projects like architectural work, open a detailed view in a new popup screen.
- Interactivity: The project cards respond to cursor movement with hover animations, providing visual feedback and enhancing the browsing experience.
The Blog page features my latest blog posts and articles on various topics related to my interests and professional work.
- Blog Listings: Each blog post is shown with a title, excerpt, and a link to read the full post. The posts are designed to be easily readable and engaging.
- Responsive Design: The blog entries are styled with hover animations and are fully responsive, ensuring a smooth reading experience on any device.
The About Me page gives a detailed overview of my background, skills, and experience.
- Profile Section: A photo of me alongside a brief introduction and my professional titles.
- Career Objective: My professional goals and aspirations as an architect, designer, and software developer.
- Experience: A detailed list of my professional experiences, including roles, responsibilities, and skills acquired.
- Education: My educational background, highlighting relevant courses and skills.
- Software Skills: A comprehensive list of my technical proficiencies across various programming languages, tools, and frameworks.
- Languages: Languages I speak, including proficiency levels.
- Hobbies: Personal interests and activities that I enjoy outside of my professional work.
The Contact Me page allows visitors to get in touch with me directly through a contact form.
-
Contact Form: Includes fields for name, email, subject, and message, with validation to ensure all fields are filled out before submission.
-
File Upload: An option to attach a file when sending a message.
-
Footer Links: Quick access to my email, LinkedIn, GitHub, and other social media profiles.
-
Theme Switching: The website supports both dark and light themes. Users can toggle between themes using a switch in the header, and their preference is remembered for future visits.
-
Language Toggle: Content can be switched between English and Turkish using the language toggle in the header. This feature is implemented using data attributes to dynamically change text content based on the selected language.
JavaScript is used across the website to manage interactive elements, theme switching, and language toggling.
- scripts.js: Each page has its own script file responsible for handling page-specific interactivity, such as smooth scrolling, toggling menus, and updating content dynamically.