Home

By Danielle Robinson

Welcome to my portfolio!

By Danielle Robinson

Module 1 Projects

  • Part 1: Emerging web Trends Report 2024

    Summary

    Artificial Intelligence, mobile first web designs, parallax scrolling, white space, and dark mode are just a few trends that caught my attention while researching trends of 2024. We’re going to dig into all of the five trends listed above and see if they are worthy of sticking around.

    Reflection

    Reflecting on the 2024 web development trends has been insightful and revealing. The rise of Artificial Intelligence continues to push the boundaries of what’s possible, despite the debates around its ethical use. Mobile First design underscores the need for accessibility and user-friendliness in an increasingly mobile world. Parallax scrolling introduces a new layer of engagement, making web navigation a visually exciting experience. Lastly, the importance of white space and dark mode highlights the balance between aesthetic appeal and practical functionality, ensuring that users can interact with content comfortably and efficiently.


  • Part 2: Wolf Parallax Scrolling

    Summary

    "Wolf Parallax Scrolling" is a project that focuses on the implementation of parallax scrolling, a web design technique that creates an immersive experience by allowing background images to move at a different speed than foreground content as users scroll down the page. The project aims to enhance the understanding of responsive design and the use of Flexbox, a layout mode in CSS that provides a more efficient way to arrange elements within a container.

    Reflection

    I started this project with two goals in mind. Learn something new, and improve on something that I struggled with in the past. I thought this web page shows just that. Flex Box was fun to learn and grow to understand it more was exciting. New trends and new ways to work with it was what it took for me to finally grasp the flex. I also learned how to do parallax scrolling which was interesting to learn about. Once you figured out the nooks and crannies that comes with responsive design!


  • Part 3: PWA Cardinal

    Summary

    I integrated Progressive Web App (PWA) features by incorporating a manifest file and a service worker, enabling offline access and push notifications, which was beyond my current skill level.

    Reflection

    To complete this project, I utilized various online resources, including MDN Web Docs, W3Schools, Stack Overflow, and Google Developers, for documentation and tutorials on HTML, CSS, JavaScript, PWA implementation, and service workers. I faced challenges such as understanding the Service Worker API, debugging JavaScript issues, and achieving a consistent design across devices. Through this, I gained skills in PWA implementation, advanced JavaScript concepts, CSS Grid and Flexbox, and debugging. The project taught me the importance of perseverance, attention to detail, and continuous learning in web development.

  • Part 1: Dragonborn App

    Summary

    This is a project which covers PWA (progressive web apps) and not just the notifications aspect of pwa like seen in Module 1.

    Reflection

    Reflecting on my journey with Emerging Web Trends Module 2, I'm proud of crafting a responsive web application. Designing for both desktop and mobile views was challenging but rewarding, teaching me the significance of flexible containers, padding, and margins for a seamless user experience. Adding a service worker was a key milestone, enhancing offline capabilities through the navigator.serviceWorker.register() method and ensuring browser support. Creating a manifest file and implementing the beforeinstallprompt event made the app installable, offering a smooth installation process for users. Testing on various devices helped identify and fix issues, ensuring functionality across screen sizes. Optimizing performance and SEO with tools like PageSpeed Insights showed significant improvements, benefiting user experience.

  • Part 2: Random Monster Generator

    Summary

    I used HTML, CSS, and JavaScript to create a functioning Random Monster Generator for Dungeons and Dragons fans!

    Reflection

    Working on the Random Monster Generator project has been a significant learning experience for me. Through this project, I have deepened my understanding of asynchronous programming, particularly utilizing the async and await syntax with the Axios library for making API calls. This has enhanced my ability to fetch and handle data efficiently, allowing me to create a dynamic and interactive user experience. I have also learned the importance of error management in asynchronous operations, ensuring that users receive clear feedback when issues arise. Additionally, manipulating the DOM to display fetched data and implementing event listeners for user interactions have been crucial skills that I have developed. Using Firefox for testing and analyzing the performance of my webpage through PageSpeed Insights has highlighted areas for improvement, particularly in optimizing load times and enhancing overall performance. This feedback will guide my future development efforts, as I aim to create a more efficient and user-friendly application. Overall, this project has not only expanded my technical skills but has also reinforced the significance of continuous learning and adaptation in web development. I look forward to applying these insights to future projects.

  • Part 1: Virtual Reality for the web (VR)

    Summary

    This project covers the basics of Virtual Reality for the web, including the use of A-frame, a web framework that simplifies the creation of virtual reality (VR) experiences using HTML and JavaScript, making it accessible for web developers and designers.

    Reflection

    Reflecting on my experience with the Emerging Web Trends Module 3 project, I feel both excited and challenged by the integration of virtual reality (VR) into web applications using A-Frame. The framework's entity-component-system architecture made it easy to manipulate 3D elements, enhancing my development experience. A significant modification I made was simplifying the user interface by removing distracting buttons and the central cursor, allowing users to focus on the VR content. Testing the project in Firefox and Opera GX highlighted A-Frame's cross-browser compatibility, reassuring me that my project could reach a wider audience. While I am proud of my progress, I recognize that there is still much to learn about advanced VR features. This journey has sparked my curiosity about how VR can transform web interactions, motivating me to further develop my skills in this field. Overall, this project has enhanced my technical abilities and deepened my understanding of user experience design in virtual environments. I look forward to applying these insights in future projects and contributing to the evolving landscape of web technologies.

  • Part 2: EVE Online Chatbot (AI)

    Summary

    I created a chatbot that would answer questions based on a video game: Eve Online. Some questions the bot can take right now is: How are you? What is EVE Online?

    Reflection

    Working on this project was enjoyable and engaging. I had previously dabbled in AI for personal projects, so I was somewhat familiar with the concepts. Developing the AI chatbot for EVE Online turned out to be both a fun and educational experience. I delved into the game's lore to create a comprehensive list of potential questions and answers for players. Building the chatbot enhanced my coding skills, particularly in handling user input and crafting responses. Testing it with actual users highlighted the significance of their feedback in improving the chatbot. Overall, I take pride in the final product and look forward to further exploring AI in my future endeavors.

  • Resources and Tools

    Summary

    This page will send you to the tools and resources I have researched during this semester and throughout my time here at MPTC.

Reflection

Experience in the Class

Throughout my journey in the Emerging Web Trends class, I have gained a wealth of knowledge and practical experience that has significantly enhanced my understanding of modern web development. The course provided a comprehensive overview of various cutting-edge technologies and trends, including Artificial Intelligence, Progressive Web Apps (PWA), Virtual Reality (VR), and responsive design principles. Engaging with these topics has not only expanded my technical skill set but also sparked my curiosity about the future of web development.

Difficulties Experienced

Despite the enriching experience, I encountered several challenges along the way. One of the primary difficulties was mastering asynchronous programming, particularly when working with APIs in the Random Monster Generator project. Understanding the async/await syntax and effectively managing errors proved to be a steep learning curve. Additionally, integrating service workers for the PWA Cardinal project was initially overwhelming, as it required a solid grasp of JavaScript and browser compatibility issues. However, these challenges ultimately became valuable learning opportunities, reinforcing my problem-solving skills and resilience.

Improvements for the Final Project

If I had more time to improve my final project, I would focus on enhancing the user interface and experience of the EVE Online Chatbot. Specifically, I would implement a more sophisticated natural language processing feature to allow for a broader range of user interactions and questions. Additionally, I would conduct user testing to gather feedback and iteratively refine the chatbot's responses, ensuring a more engaging and intuitive experience for players.

Plans to Expand Learning

Looking ahead, I plan to expand my learning in the topics we covered by delving deeper into the areas of AI and VR. I intend to explore advanced machine learning techniques and frameworks, as well as experiment with more intricate VR applications using A-Frame and other tools. Participating in online courses and attending workshops will be crucial for my continuous development in these fast-evolving fields.

Plans for New Topics

Moreover, I have a keen interest in exploring topics that we did not cover in class, such as WebAssembly and serverless architecture. I believe that understanding these technologies will further enhance my capabilities as a web developer and open up new avenues for creating performant and scalable applications. I plan to dedicate time to self-study and engage with community resources to gain insights into these emerging technologies.

Conclusion

In conclusion, my experience in the Emerging Web Trends class has been both challenging and rewarding. The knowledge and skills I have acquired will undoubtedly shape my future projects and career path in web development. I am excited to continue my learning journey and contribute to the ever-evolving landscape of web technologies.