Coder Social home page Coder Social logo

jennabsol.github.io's People

Contributors

jennabsol avatar

Watchers

avatar

jennabsol.github.io's Issues

Blog article form

Story

As the user, I should be able to create a blog article with a form.

Acceptance Criteria

Given the user wants to create a new blog article
When the user visits the admin/blog.html URL
Then the user should be presented with a form that accepts all required information for a blog article
And the user should see a button to save the article

Given the user has filled out all fields for a new blog article
When the user clicks on the Save button
Then the article should be saved in persistent local storage

Given the user wants to view the new article
When the user visits the /blog URL
Then all articles, including the newly created one should be extracted from local storage, and be presented in descending chronological order

Technical Requirements

  1. Use forEach() to display the blog articles instead of a for loop.
  2. Your directory structure should be modular. Your projects page should be projects/index.html. Your blog should be blog/index.html. Your resume should be resume/index.html.
  3. You should still be paginating your blog articles.

User should see contact information

Given a user visits your personal site
When the user clicks the Contact navigation link
Then the user should see at least two links of yours on social media (i.e. Twitter, LinkedIn, etc.)

Populate your resume page with data in the database

Using the database you have in local storage for your professional history, follow the ETL process.

  1. Extract the professional history data
  2. Transform each position into an <article> element string.
  3. Load that string into the DOM

You may want to create a section element in your HTML file to contain each article.

<body>
    <section id="professional-history">
        // Each new <article> will be inserted here.
    </section>
</body>

Store professional history database in local storage

  1. Create a resume.js file and include it in your resume.html file.
  2. Build a database object to store the pertinent information about your professional history.
  3. Stringify the database object and store it in local storage.

The first step is to design what each object's properties should be. Consider your written resume, and think about what information your provide to describe each job - title, company, dates, responsibilities. Each object should have those properties.

Store contact information database in local storage

  1. Create a contact.js file and include it in your contact.html file.
  2. Build a database object to store the pertinent information about each of your social media profiles.
  3. Stringify the database object and store it in local storage.

The first step is to design what each object's properties should be - name of service, your name/handle, URL to profile, perhaps the icon of the service. Each object should have those properties.

Populate your projects page from data in the database

Using the database you have in local storage for your projects, follow the ETL process.

  1. Extract the projects data
  2. Transform each project into an <article> element string.
  3. Load that string into the DOM

You may want to create a section element in your HTML file to contain each article.

<body>
    <section id="projects">
        // Each new <article> will be inserted here.
    </section>
</body>

User should see your story

Given a user visits your personal site
When the user views the home page
Then the user should be able to read information about you, including your personal story of why you chose to become a software developer

Store project database in local storage

  1. Create a projects.js file and include it in your projects.html file.
  2. Build a database object to store the pertinent information about your software projects. At this point, you only have one of note - your personal site.
  3. Stringify the database object and store it in local storage.

The first step is to design what each object's properties should be - name, date completed, technologies used, teammates (if applicable). Each object should have those properties.

Project searching

Story

As a user, I should be able to search projects on title and content

Acceptance Criteria

Given the user wants to view your projects
When the user clicks on the Projects navigation item
Then the projects should be displayed in descending chronological order
And there should be a text input at the top of the first article with a "Search:" label

Given a user wants to search your projects
When the user types 3, or more, characters in a search bar at the top of the screen
Then the projects should be filtered to any that have those characters in the title, or description of the project

Populate your contact page from data in the database

Using the database you have in local storage for your contact links, follow the ETL process.

  1. Extract the contact data
  2. Transform each social media object into an <article> element string.
  3. Load that string into the DOM

You may want to create a section element in your HTML file to contain each article.

<body>
    <section id="social-media-links">
        // Each new <article> will be inserted here
    </section>
</body>

Populate your blog page from data in the database

Using the database you have in local storage for your blog articles, follow the ETL process.

  1. Extract the blog article data
  2. Transform each blog article into an <article> element string.
  3. Load that string into the DOM

You may want to create a section element in your HTML file to contain each article.

<body>
    <section id="articles">
        // Each new <article> will be inserted here
    </section>
</body>

User should see articles for your blog

Given a user visits your personal site
When the user clicks on the Blog navigation link
Then the user should see a list of blog articles

Make sure you post at least one blog article per week

Blog searching

Story

As a user, I should be able to search blog article on title and content

Acceptance Criteria

Given the user wants to read the blog articles
When the user clicks on the Blog navigation item
Then the blog articles should be displayed in descending chronological order
And there should be a text input at the top of the first article with a "Search:" label

Given a user wants to search your blog articles
When the user types 3, or more, characters in a search bar at the top of the screen
Then the articles should be filtered to any that have those characters in the title, or body of the article

User should see your resume / CV

Given a user visits your personal site
When the user clicks on the Resume link in the navigation bar
Then they will see your professional history

Paginate your blog articles

Given a user visits your blog page
When the page loads
Then the user should see the first 5 articles of your blog
And there should be numbered pagination links at the bottom of the page so the user can view subsequent sets of five articles

Provide ability to edit blog articles

Story

As an article author, I should be able to edit the title and content after it's been published.

Acceptance Criteria

Given an article author wants to edit an existing article
When the author performs a gesture on the article edit affordance (e.g. button or hyperlink)
Then the article form should be populated with that articles values

Given an article author has chosen to edit an existing article
When the author performs a gesture on the article save affordance (e.g. button or hyperlink)
Then the existing article object in the database should be modified with the new values
And the database should be saved to local storage

Deploy site to Github

Once you are happy with the content of your site, push it to you Github Pages repository on Github and send the link to the instruction team for review.

Store blog article database in local storage

  1. Create a blog.js file and include it in your blog.html file.
  2. Build a database object to store the each of your blog articles.
  3. Stringify the database object and store it in local storage.

The first step is to design what each object's properties should be - title, date of publication, tags, author, and content. Each article object should have those properties.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.