- I'm a Full stack Web developer, I'm a Web Designer. Experienced with all stages of the development cycle for dynamic web projects.
- Users will know the details about my work, education and experiences and contatct deatils.
- As a owner I can populate all my details for personal portfolio which can be accessed by the recruiters.
- User will know complete details about me and will help in hiring me.
- As a new visitor of the website, I want to easily navigate on the page.
- As an interested client, I want to have a contact form easy to fill out.
- As a potential client, I want to get to know Bhargavi's background and personality to see if I want to hire her
- As a recruiter, I would like to get an insight into Bhargavi's work and I also want to have a printable resumé what I can present to my superior.
- As an employer, I visit this page to see a showcase of a potential employee's work.
- Provide a platform where the user can look into my experience for hiring me or any user can use the website for inspirational purpose.
- Provide a platform where user can look into my project work list and share it with other users if they want.
- Fits in with my current skill-set of HTML, CSS.
- Easy way to log in into into the website with hire me button for recruiters.
- Allow the user to look into Home page, aboutme Download cv, projects and contact page.
-
As the website has two main ideas, Hiring and Project works I kept the website as simple as possible and easy to use. Instead of creating a lot of functionality.
-
A part of the home page, every page has the same structure to keep consistency and to make the navigation easy to assimilate.
- When I started working on this project, I had a picture of the site in my head. This picture has changed a lot in the last few weeks.
- I have used Balsamiq for designing the wireframes.
The overall UX is clean and similar in all pages to keep consistency.
- Most part of the website is in Sans sarif font and footer is in Dancing script font.
- I have used Google Fonts to import the fonts for the website.
- Most of the images and background image are from Google images (not copyrighted)
- I have used fontawesome to source all the icons through out the website.
- In Home page Picture and few text.
- In About me few lines about Bhargavi.
- Projects says few Web designing done by Bhargavi.
- Work history says Bhargavi's experience of works in which she has done all these years.
- Contact page give the contact info about Bhargavi.
- In the future I plan to add further projects, work experience to make My portfolio and About me pages better.
- I would really want to implement my skills in Responsive designing / mobile first designing.
- I will learn to use of background images effectively and responsively.
- I will implement the animations skills in the website.
- Implementation of colours would be better.
- HTML
- CSS
- BOOTSTRAP
- HTML formatter
- CSS formatter
- HTML validator
- CSS validator
- Google fonts
- Font Awesome
- Google Search engine
- Markdown Language
- CSS Autoprefixer
- As a user, I want to easily understand the main purpose of the site and learn more about the portfolio.
- TEST: After the users load the page the first thing sees on the home page is a brief explanation Bhargavi's portfolio with footer with all social links which Bhargavi follows.
- As a user, I want to easily to get to the Home Page.
- TEST: Also in the home, there are two buttons one will redirect to the Bhargavi's CV in a new page and another one is Hire Me(dummy).
- As a user, I want to easily click on About Me page.
- TEST: With one click the users can easily get into About Me PAGE.
- As a user, I want to look into the more about Bhargavi's work experience in a different feature widgets.
- TEST: After the user get into the page they will look about me and work history of Bhargavi.
- As a user, I want to look into Projects done by Bhargavi.
- TEST: After the user get into the page they will look my projects of Bhargavi.
- As a user, I want to contact Bhargavi for hiring her or for any information needed.
- As a user, I want to easily find a way to contact Bhargavi.
- TEST: When the user clicks on contact page they can find many options to contact Bhargavi like email, phone, contact form and address. When you try to click send message without filling required feilds "Please fill out this field" will be poped up.
- All links were tested in Replit, gitpod,github pages, mobile,tablet and laptop screens.
- Checked if all links in the navigation bar and check if they redirect to the desired pages.
- Checked if the social links on the footer redirect to the desired page.
- Home Page:
- Checked if download CV is redirected to new file called Bhargavi CV:
- About Me Page:
- Checked if the page is redirected to the about me page.
- Projects Page:
- Checked if the page is redirected to project page.
- Checked if the images are loading and for Hover effects.
- Contact page:
- Checked if the contact page is redirected to contact page.
- Checked if the contact form is working without the blank.
- Checked if the send message button is working.
- Checked if the social links in all the footer in all the pages is redirected to new pages respectively.
- This is my first website and written in GitPod, and it's hosted using Github, deployed from the master branch (via Settings). I've saved after every important change starting with git status, git add ., git commit -m"message" and in the end pushing (git push)it to the Github repository. After every commit, when you refresh the repository, you can see the changes. The main (landing) page of the website is named assets in which I have index.html, aboutme.html, projects.html, contact.html, css,style.css, cv,readme-img,README.md and images.
This project was stored on Github using the following steps.
- I created an account on GitHub My account
https://github.com/Bhargavi84/My-Personal-Portfolio
- I created a public repository for my 1st Milestone project
-
I logged in to Github and located the Github Repository
-
At the top of the Repository (not top of page), I clicked the "Settings" Button on the menu.
-
I Scrolled down the Settings page until you locate the "GitHub Pages" Section.
-
Under "Source", I clicked the dropdown called "None" and select "Master Branch".
-
I scrolled back down through the page to locate the now published site link in the "GitHub Pages" section.
-
Cloning the Github Repository The Github repository was cloned and stored locally on my machine using the following steps.
-
*I cloned my Github Repository using HTTPS, under "Clone with HTTPS", and copied the link.
-
I opened Gitbash, I pasted the HTTPS link and added a local directory in my machine.
-
I opened IntelliJ IDEA community edition, clicked on File/Open File and navigated to the local directory I had cloned my Github repository.
- Most of the contents written by me.
- Inspiration from Code Institute Rosie resume project.
- Zoyothemes webiste design themes.
- Inspiration for ReadMe file is Krisztina Szabó and Henrique Peroni Website.
- My mentor excellence_mentor llesamni for guidance.
- Tutor Support Code Institute.
- Slack Community.
- The picture in the page is random professional working women from google
- The projects picture is the random picture from Google free images
- I learned a lot from browsing the templates on W3Schools
- Slack Community was the greatest help me problem solving
- The words and sentences, Pictures and attachments used in this project is imaginary and educational purposes only.