Giter Club home page Giter Club logo

duck-duck-clone's Introduction

duck-duck-clone

Incremental development week 3

GitHub closed pull requests GitHub contributors Website

Development strategy

OPEN development-strategy.md

FROM HYF

Project

This week's group project is to build your own accessible & responsive clone of the DuckDuckGo home page (long version). We don't expect your DOM to be identical to DuckDuckGo's, or for all the buttons to have the same behavior, but visually your site should be identical to the real DuckDuckGo. If you would like to use a CSS framework, go for it! Just be sure everyone in your team uses it ;)

Unlike the last two weeks, this project does not have a video tutorial for you to follow. This week you will also expected to do your best at writing accessible HTML including correct Semantic HTML and ARIA. Pay special attention to points of user interaction like the search field and submit button.

You are expected to submit your code from his tutorial in a new repository generated from the w3-validation-starter repo. Your repository should be named duck-duck-clone and should be collaboratively developed following the same workflow you practiced in class this Sunday. It's up to you to write the development strategy!


Screenshot


Issue Checklist

duck-duck-clone's People

Contributors

22count22 avatar bermarte avatar businan avatar divyasree345 avatar kemmy72 avatar

Watchers

 avatar  avatar  avatar  avatar

Forkers

22count22

duck-duck-clone's Issues

4. section ghost

4. Section Ghost

For Kemi #7

  • Clone this repo or pull it if you already cloned it
  • Create the ghost branch git branch ghost
  • Switch to that branch git checkout ghost
  • Move your issue in the column in progress (in the Project board)
  • Create the section ghost in index.html file
  • Create the CSS relative to the ghost section in style.css
  • Always add and commit your changes in your local repository
  • Push to your branch on Github,
    the first time git push --set-upstream origin ghost
    or git push origin ghost (if the branch is already present in GitHub)
  • Move your issue in the column to review
  • Create a PR
  • The PR is reviewed
  • The branch is merged into master branch
  • The PR is closed
  • Move your issue in the done column

3. section monster

3. Section Monster

For Divya #5

  • Clone this repo or pull it if you already cloned it
  • Create the monster branch git branch monster
  • Switch to that branch git checkout monster
  • Move your issue in the column in progress (in the Project board)
  • Create the section monster in index.html file
  • Create the CSS relative to the monster section in style.css
  • Always add and commit your changes in your local repository
  • Push to your branch on Github,
    the first time git push --set-upstream origin monster
    or git push origin monster (if the branch is already present in GitHub)
  • Push to your branch on GitHub
  • Move your issue in the column to review
  • Create a PR
  • The PR is reviewed
  • The branch is merged into master branch
  • The PR is closed
  • Move your issue in the done column

6. section alpinist

4. Section Alpinist

For Bermarte #8

  • Clone this repo or pull it if you already cloned it
  • Create the alpinist branch git branch alpinist
  • Switch to that branch git checkout alpinist
  • Move your issue in the column in progress (in the Project board)
  • Create the section alpinist in index.html file
  • Create the CSS relative to the alpinist section in style.css
  • Always add and commit your changes in your local repository
  • Push to your branch on Github,
    the first time git push --set-upstream origin alpinist
    or git push origin alpinist (if the branch is already present in GitHub)
  • Move your issue in the column to review
  • Create a PR
  • The PR is reviewed
  • The branch is merged into master branch
  • The PR is closed
  • Move your issue in the done column

1. wireframe

1. Wireframe

Create a wireframe for our README file
For Bermarte #3

  • Clone this repo or pull it if you already cloned it
  • Create a wireframe branch
  • Switch to that branch git checkout wireframe
  • Move your issue in the column in progress (in the Project board)
  • Create a Wireframe
  • Always add and commit your changes in your local repository
  • Push to your branch on Github,
    the first time git push --set-upstream origin wireframe
    or git push origin wireframe (if the branch is already present in GitHub)
  • Move your issue in the column to review
  • Create a PR
  • The PR is reviewed
  • The branch is merged into master branch
  • The PR is closed
  • Move your issue in the done column

9. aria

9. ARIA

For Bermarte

  • Search what ARIA is about
  • Find some info
  • Choose members who will implement this feature
  • Validate using https://achecker.ca/checker/index.php
  • Convert i to span
  • Add label to the text input (like coach Tiago said)

For member X Y

Create the aria branch git branch aria
Switch to that branch git checkout aria
Always add and commit your changes in your local repository
Push to your branch on Github
Move your issue in the column to review
Create a PR
The PR is reviewed
The branch is merged into master branch
The PR is closed
Move your issue in the done column


tutorials, info

https://developers.google.com/web/fundamentals/accessibility/semantics-aria/

2. section home

2. Section Home

For Burak #4

  • Clone this repo or pull it if you already cloned it
  • Create the home branch git branch home
  • Switch to that branch git checkout home
  • Move your issue in the column in progress (in the Project board)
  • Create the section home in index.html file
  • Create the CSS relative to the home section in style.css
  • Always add and commit your changes in your local repository
  • Push to your branch on Github,
    the first time git push --set-upstream origin home
    or git push origin home (if the branch is already present in GitHub)
  • Move your issue in the column to review
  • Create a PR
  • The PR is reviewed
  • The branch is merged into master branch
  • The PR is closed
  • Move your issue in the done column

7. Modding, Fixes

7. Modding, Fixes

created by Bermarte and Burak

  • Create a branch fix
  • Validate
  • Fix HTML
  • Fix CSS
  • Write Javascript
  • Fix sections
  • PR
  • merge
  • Create a branch homeSecond
  • Fix HTML
  • Fix CSS
  • Write Javascript
  • PR
  • merge
  • Create a branch thirdHome
  • Fix HTML
  • Fix CSS
  • Write Javascript
  • PR
  • merge

5. section bathtub

4. Section Bathtub

For Patrick #6

  • Clone this repo or pull it if you already cloned it
  • Create the bathtub branch git branch bathtub
  • Switch to that branch git checkout bathtub
  • Move your issue in the column in progress (in the Project board)
  • Create the section bathtub in index.html file
  • Create the CSS relative to the bathtub section in style.css
  • Always add and commit your changes in your local repository
  • Push to your branch on Github,
    the first time git push --set-upstream origin bathtub
    or git push origin bathtub (if the branch is already present in GitHub)
  • Move your issue in the column to review
  • Create a PR
  • The PR is reviewed
  • The branch is merged into master branch
  • The PR is closed
  • Move your issue in the done column

0. repo

0. Repo

For Bermarte
As a site visitor, I want to know about this repo
We start our repository on GitHub

Repo

  • developed on the master branch
  • Fork the HYF template to add the validator
  • Invite members
  • Give your project a name
  • Create README.md file
  • Create development-strategy file
  • Create this Project Board
  • Create imgs directory
  • Copy the images from Duck Duck Go website
  • Add a screenshot to README.md
  • Write the user stories in the development strategy
  • Write the issues and assign a member for each
  • Add a screenshot to README.md

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.