Skillnaija All courses →

Build and Ship a Working Interactive Web Feature

The capstone project for JavaScript for Beginners — a free Data & Tech course. Pass it and you earn a certificate anyone can verify.

Start the course free Download the project workbook

The project unlocks once you complete the lessons. The workbook is free to download now so you can see exactly what is expected.

What you will submit

A live, working link to your interactive web feature (tip/VAT calculator or to-do list) PLUS a link to the code (CodePen or GitHub repo). The feature must respond to a button click and update the page without reloading.

What to do, step by step

  1. Choose ONE small feature to build in HTML + JavaScript: a tip/VAT calculator (enter a bill amount and tip percentage, show the tip and total in naira) OR a to-do list (type a task, click Add, see it appear in a list). Create a single page with an index.html file (or one CodePen) that has the needed inputs, at least one button, and an empty element where results will show — remember the <script> tag goes at the bottom of the body, as in Lesson 6.
  2. Write the JavaScript using the fundamentals from the course: declare your values with let/const, read what the user types with the .value of an input (wrap it in Number(...) for maths), and use at least one variable, one operator, and template literals to build your output text (Lessons 2 and 5).
  3. Include at least ONE function that does the core work (for example calculateTip(bill, percent) that returns a number) and at least ONE conditional with === or a comparison (for example: if the bill is empty or not a valid number, show a friendly 'Please enter a valid amount' message instead of crashing) — applying Lessons 3 and 5. A to-do list should use an array to store the tasks.
  4. Wire it up with the DOM and an event from Lesson 6: grab your elements with getElementById or querySelector, add a button click listener with addEventListener('click', ...), and update the page with textContent so the user sees the result without reloading.
  5. Test it like a developer (Lesson 7): open the browser Console, confirm there are no red errors, and use console.log to check your values are correct. Fix at least the common bugs — make sure you used === not =, that your input is converted to a Number where needed, and that the script runs after the elements load.
  6. Deploy it for free and make it shareable: use CodePen, GitHub Pages, or Netlify Drop so anyone can open a live link. Submit BOTH the live link and a link to your code (CodePen or GitHub repo).

Files to work with

Project workbook (fill in, then submit)The whole brief, an evidence checklist, the grading rubric as a self-check and the link-sharing steps in one file. Opens in Word, Google Docs or WPS.Word · 7 KB

How it is graded

CriterionWeight
The feature actually works at the live link: a button click updates the page (calculates a total or adds a to-do) without reloading, using the DOM and an event listener30%
JavaScript correctly uses the fundamentals — variables (let/const), at least one function with a return, and template literals or operators to build the output25%
At least one conditional is used sensibly (e.g. ===/comparison to validate input), and a to-do list stores tasks in an array20%
Code is clean and reasonably readable — clear variable/function names, correct === vs =, input converted to Number where needed, and no red Console errors15%
Successfully deployed and shareable: both a working live link and a code link (CodePen/GitHub) are provided10%

You need 65% overall to pass. A failed submission comes back with feedback and can be revised and resubmitted.

Before you submit: make your link public

If your work lives in Google Drive or Google Docs, open Share → General access and change “Restricted” to “Anyone with the link” (Viewer). Then paste the link into a private browser window: if it opens without sign-in, you are ready. A private link cannot be graded — it is the single most common reason a good project fails.

Frequently asked questions

Do I have to finish JavaScript for Beginners before submitting the project?

Yes. The submission screen opens once every lesson in JavaScript for Beginners is marked complete. The lessons are where the methods, the Nigerian context and the worked examples the project depends on are taught.

How is the project graded?

An examiner scores each rubric criterion from 0 to 100 and weights them as shown on this page; you need 65% overall to pass. Most submissions are graded within minutes and you get written feedback on what was strong and what to improve.

Can I resubmit if I fail?

Yes. A failed project comes back with feedback; revise the weak parts and resubmit. A passed project is final — the certificate is issued and cannot be re-rolled.

What do I actually submit?

A write-up of what you did (under 5,000 characters) plus a public link to your work — a Google Drive folder, Google Doc, spreadsheet, GitHub repository or video. The link must open without sign-in; a private link cannot be graded. The free project workbook on this page walks you through all 6 steps.

Is the certificate real?

Yes. Passing this project issues a certificate with a unique verification code. Anyone — an employer, a client, a school — can open the verification page and see that the certificate is genuine and which project earned it.

More Data & Tech projects

Ready to earn this certificate?

JavaScript for Beginners is free and self-paced. Finish the lessons, complete this project, and the certificate is yours to share.

Start learning free