ApexPlanet-Internship
ApexPlanet Web Development Internship
| Intern: Mukkamula Manoj | Duration: 45 Days | Feb - Apr 2026 |
This repo has all my task submissions from the ApexPlanet Software Pvt. Ltd. Web Development Internship. The program covers HTML, CSS, and JavaScript from the ground up, and each task builds on the previous one. By the end, I built a complete e-commerce web app from scratch.
All Tasks at a Glance
| S.No | Task | Live Demo | Code |
|---|---|---|---|
| 1. | Basics of Web Development | Portfolio | Task 1 |
| 2. | Intermediate HTML, CSS & JS | TaskFlow | Task 2 |
| 3. | Advanced Styling & JavaScript | DevToolkit | Task 3 |
| 4. | Full Project Implementation | Web Trio | Task 4 |
| 5. | Final Project and Optimization | ShopEase | Task 5 |
Tech Used
Task Breakdown
Task 1 - Basics of Web Development
Days 1-9 | Personal Portfolio | LinkedIn Post
Started with the basics. Built a simple webpage using semantic HTML, added CSS for styling, and wrote a small JavaScript function to handle a button click.
- Semantic HTML5 structure with headings, paragraphs, images, and links
- CSS colors, fonts, spacing, and basic layout
- A button that triggers a JavaScript alert
Task 2 - Intermediate HTML, CSS and JavaScript
Days 10-18 | TaskFlow | Linkedin post
Built a project called TaskFlow with three separate features in one place.
- Contact form with input validation using JavaScript (checks required fields and email format)
- Responsive layout using Flexbox for the navbar and CSS Grid for content, with media queries for different screen sizes
- A dynamic to-do list where you can add and remove tasks through DOM manipulation
Task 3 - Advanced Styling and JavaScript
Days 19-27 | DevToolkit | Linkedin post
Built DevToolkit, a single-page app with two real features that use external APIs and advanced JS.
- GitHub Profile Finder: fetches live data from the GitHub REST API and displays profile info, repos, and follower counts
- Web Dev Quiz: an interactive quiz with a timer, question progress tracking, and a final score
- Dark theme UI, responsive across all screen sizes, with proper loading states and error handling
Task 4 - Full Project Implementation
Days 28-36 | Web Trio | Linkedin post
The biggest task before the final one. I built three complete apps and connected them through a personal portfolio website.
Portfolio Website (main entry point)
- Sticky navbar with blur effect and scroll-based active link highlighting
- Hamburger menu for mobile with smooth animation
- Scroll reveal animations using IntersectionObserver
- Projects section with filter tabs (All / Internship / Personal)
- Fully responsive on mobile, tablet, and desktop
TechStore - Product Listing Page
- 24 tech products across 6 categories with real Unsplash images
- Live search, category filter, price range slider, and sort options
- Active filter tags, loading spinner, and a “No results found” state
NoteVault - Task Manager
- Full CRUD: add, edit, delete, and mark tasks complete
- Filter by status (All / Pending / Completed) and sort by date or name
- Task stats, timestamps, localStorage persistence, and XSS protection
Task 5 - Final Project and Optimization
Days 37-45 | ShopEase | Linkedin post
Built ShopEase, a fully functional e-commerce frontend as my capstone project. This is built with plain HTML, CSS, and Vanilla JavaScript - no frameworks, no backend.
Product Listing Page
- 24 products across 5 categories (Electronics, Clothing, Footwear, Accessories, Home and Living)
- Live search with 300ms debounce, category filter, price range slider, and 5 sort options
- Product details modal: click any card to see full image, description, price, and discount
- Add to Cart with “In Cart” state that persists across page navigation
- Collapsible filter panel on mobile using a toggle button
Cart Page
- Increase/decrease quantity, remove items, and see a live order summary
- Auto 10% discount and free delivery logic (above Rs.999)
- Cart saved in localStorage so it stays even after refresh
- Clean empty cart state with a continue shopping button
Performance and Compatibility
loading="lazy"on all images- Debounced search and slider inputs to avoid unnecessary DOM updates
onerrorfallback on all images so no broken image errors appear in console- Tested on Chrome, Firefox, and Safari on both desktop and mobile
Repository Structure
ApexPlanet-Internship/
├── Task 1/ Basics of Web Development
├── Task 2/ Intermediate HTML, CSS and JS (TaskFlow)
├── Task 3/ Advanced Styling and JS (DevToolkit)
├── Task 4/ Full Project Implementation (Portfolio + TechStore + NoteVault)
├── Task 5/ Final Project and Optimization (ShopEase)
└── README.md
What I Did in This Internship
I handled everything in each task from start to finish: planning the structure, writing the HTML, styling with CSS, adding JavaScript functionality, testing across screen sizes and browsers, and deploying to GitHub Pages. Nothing was copied from templates. Each project was built from scratch based on the task requirements.
Key Learnings
This internship pushed me to actually build things rather than just follow tutorials. A few things I got much better at:
- Writing clean, semantic HTML and understanding why structure matters
- Using Flexbox and CSS Grid properly for real layouts, not just toy examples
- DOM manipulation and event handling in JavaScript without relying on libraries
- Working with the Fetch API and handling async operations
- localStorage for persisting data across sessions
- Debouncing, lazy loading, and other small but important performance techniques
- Making projects actually work on mobile, not just look okay in DevTools
- Keeping code organized across multiple files with clear separation of concerns
Author
Mukkamula Manoj Final Year B.Tech CSE, AAR Mahaveer Engineering College (JNTUH, 2026) Web Development Intern, ApexPlanet Software Pvt. Ltd.
Thank You
Thank you to the team at ApexPlanet Software Pvt. Ltd. for putting together a well-structured program. The task progression made sense, and working on real projects instead of just exercises made a genuine difference in how I think about building for the web. I’m leaving this internship with better skills and more confidence than I came in with.
License
This repository is for learning and portfolio purposes. Feel free to look through the code. If you want to use anything, a mention would be appreciated.