Skip to content

Latest commit

 

History

History
73 lines (46 loc) · 3.16 KB

Readme.Md

File metadata and controls

73 lines (46 loc) · 3.16 KB

Personal Portfolio - Pras Tio Rifki Wijaya

>> Description <<

This is a personal portfolio project that displays complete information about me, Pras Tio Rifki Wijaya. This portfolio includes a detailed section about my background and highlights key skills acquired through formal education and hands-on experience in various projects.

This portfolio project was created as an assignment for the “Learn Basic Web Programming” class at Dicoding. In this class, we learn how to create a simple website using HTML, CSS, and JavaScript. The portfolio presents complete information about Pras Tio Rifki Wijaya, including my educational background, experience, and skills.

>> Criteria Met <<

The website I created has met the following criteria:

  • Applying semantic meaning to web pages (Met)
  • Using float or flexbox techniques in arranging layouts (Met)
  • Displaying self-identity in the aside elements (Met)

All of these are the requirements set by Dicoding for my graduation in the “Learn Basic Web Programming” class.

>> Project Features <<

1. Message Notification

This feature displays a notification to give feedback to users when they click the submit button.

How to Access:

  • Users can type a message in the input with the ID message.
  • After that, the user clicks the button with the class .button--submit.
  • If the input is empty, a red notification will appear with the message "Please Enter Your Message!".
  • If there is a message, a green notification will appear with the message "Thank You! Your Message Has Been Sent".

2. Slideshow Item

This feature displays a slideshow that allows users to view images or other content arranged in slides.

How to Access:

  • The slideshow automatically runs at 3-second intervals (3000 ms).
  • Users can change slides manually by adding navigation elements (buttons or arrows) to call the changeSlide(direction) function, where direction is 1 for the next slide and -1 for the previous slide.
  • The showSlide(index) function will display the slide corresponding to the given index.

>> How to Use the Features <<

  1. Message Notification

    1. Fill in the message field.
    2. Click the "Submit" button to see the notification based on the input.

  2. Slideshow Item

    • The slideshow will automatically work without user interaction.
    • To change slides manually, add navigation elements (for example, previous and next buttons) that call changeSlide(1) or changeSlide(-1).

>> Technology Used <<

  • HTML5
  • CSS3
  • JavaScript

>> Installation <<

  1. Clone this repository or download it as a ZIP.
  2. Open the index.html file in your preferred browser.

>> License <<

This project is licensed under the MIT License. Please see the LICENSE file for more information.

>> Contact <<