A

Artify Web

Artistically stylise websites and its functioning

A

Artify Web

Artistically stylise websites and its functioning


The problem Artify Web solves

.I have worked in 3 projects:

  1. Sukoon - Stress Relieving Website: Overhauled the Our Services section in the main landing page of the website and also added the mobile responsive navbar using Javascript. Learnt CSS Flexbox for making responsive layouts, and learnt the use of Event handlers in Javascript to make hamburger navbar.
  2. Moosync Website: Properly aligned certain sections of the website, added hover effects and stylised the hamburger menu.
  3. Awesome Chrome Extensions: Completely stylised the whole website from scratch. Made responsive flexbox layout, and learnt how to add light/dark mode in website.

Challenges I ran into

Understanding flexbox containers and how it works was tough initially, especially when you have to implement concepts in a live project in which many contributors are working.
Had to check very minor details as well, so that nothing gets broken after PR is merged.
Understanding large codebases and finding where the problem is, was very difficult.
Handling Javascript was really not easy for a beginner like me.

  1. Sukoon:
    a. Changed the styling of services section-
    Issue: https://github.com/Susmita-Dey/Sukoon/issues/55
    PR: https://github.com/Susmita-Dey/Sukoon/pull/98
    b. Corrected Hamburger Menu -
    Issue: https://github.com/Susmita-Dey/Sukoon/issues/124
    PR: https://github.com/Susmita-Dey/Sukoon/pull/142
    c. Fixed Overlapping Contents -
    Issue: https://github.com/Susmita-Dey/Sukoon/issues/247
    PR: https://github.com/Susmita-Dey/Sukoon/pull/311

  2. Moosync:
    a. Responsive Footer list and Hover effects -
    Issue: https://github.com/Moosync/Moosync.github.io/issues/7
    PR: https://github.com/Moosync/Moosync.github.io/pull/9
    b. Added Hamburger Menu-
    Issue: https://github.com/Moosync/Moosync.github.io/issues/15
    PR: https://github.com/Moosync/Moosync.github.io/pull/16
    c. Hover Enhancements -
    Issue: https://github.com/Moosync/Moosync.github.io/issues/18
    PR: https://github.com/Moosync/Moosync.github.io/pull/19
    d. Hover Effects Fixed - PR: https://github.com/Moosync/Moosync.github.io/pull/21

  3. Awesome Chrome Extensions:
    a. Changed the UI Of the Website-
    Issue: https://github.com/ridsuteri/Awesome-Chrome-Extensions/issues/456
    PR: https://github.com/ridsuteri/Awesome-Chrome-Extensions/pull/464
    b. Fixed the navbar and UI -
    PR: https://github.com/ridsuteri/Awesome-Chrome-Extensions/pull/475

Technologies used

Discussion