hi019 / Personal-Website

Portfolio Website

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Portfolio

A personal portfolio website featuring all personal achievements, education, work experience, technical and soft skills, extracurriculars and personal projects!

Distinctiveness and Complexity

Distinctiveness: The past couple of projects mainly entailed me creating web applications where users are meant to log in and interact with one another/eachothers posts. This project is entirely different as it is a showcase website where I am able to put everything about myself on there and have others interact with my website and subscribe to me! I was able to express myself with unique designs and creative animations for others to see!

Complexity: I understand that although the backend component of this website isn't as complex as the other projects, I truly spent a lot of time on the front end. Firstly, I mapped out the entire design of the website using Figma. I had to familiarize myself with this design tool and played around for quite a while with fonts which I like, the best color schemes and basic layout etc. In this process, I was able to learn a brand new technology which proved to be very useful in the design process of web (and even mobile) applications! Although there was a bit of a learning curve, I managed to figure things out. Secondly, I had to gather all of my experiences and decide which ones I wanted to display on my website. Additionally, I had to create a resume which I then put on my website (under the resume tab). Since I have never applied to a tech job before, I had to create a resume from scratch and ended up developing resume building skills as well. As for the technical complexity, I was able to further explore front end libraries such as Bootstrap and FontAwesome. I was able to use challenging concepts such as Flexbox. Moreover, I had to make unique features (such as the timeline) mobile responsive. This was something new to me and I learned and applied concepts such as pseudo selectors and breakpoints. Another complex feature about this project is the animations. I applied concepts from the 'mail' assignent to my 'projects' page and used animations to bring my website to life. These animations, JavaScript and CSS, taught me how to build animated pages. Finally, although not seen in the final project, I was using Three.js for the 'index' page but had to scrap it last minute. In the process, I learned three.js concepts such as scenes, cameras, objects and lighting etc. This was challenging to learn (b/c of 3D space). Finally, my project contains a subscribe feature where users enter their name and email into a form, and "subscribe" to me where I can send them future content. I used the 'Subscriber' model to store this data in my database.


File Description

  • db.sqlite3
  • manage.py
  • portfolio - default app
  • content - app containing all of the code
  • content/static - static folder containing items such as PDF of resume, 'index' page video, css files, js files etc.
  • content/templates - folder which contains all of the html pages
  • content/models.py - contains models for subscribers content/views.py - contains python code content/urls.py - contains urls

How To Run

  • $ python3 manage.py makemigrations
  • $ python3 manage.py migrate
  • $ python3 manage.py runserver

About

Portfolio Website


Languages

Language:HTML 58.7%Language:Python 18.7%Language:CSS 18.2%Language:JavaScript 4.4%