diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml deleted file mode 100644 index ea03447fe..000000000 --- a/.github/FUNDING.yml +++ /dev/null @@ -1,2 +0,0 @@ -github: CodeYourFuture -custom: https://codeyourfuture.io/donate diff --git a/.github/workflows/validate-pr-metadata.yml b/.github/workflows/validate-pr-metadata.yml index 65df06116..ec0942ad1 100644 --- a/.github/workflows/validate-pr-metadata.yml +++ b/.github/workflows/validate-pr-metadata.yml @@ -1,19 +1,19 @@ -name: Validate PR Metadata -on: - pull_request_target: - types: - - labeled - - unlabeled - - opened - - edited - - reopened - -jobs: - validate_pr_metadata: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v4 - - uses: CodeYourFuture/actions/validate-pr-metadata@main - with: - give_more_specific_comment_for_earlier_learners: true - GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} +name: Validate PR Metadata +on: + pull_request_target: + types: + - labeled + - unlabeled + - opened + - edited + - reopened + +jobs: + validate_pr_metadata: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v4 + - uses: CodeYourFuture/actions/validate-pr-metadata@main + with: + give_more_specific_comment_for_earlier_learners: true + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.gitignore b/.gitignore index bde36e530..946c065ca 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ -node_modules -.DS_Store -.vscode +node_modules +.DS_Store +.vscode **/.DS_Store \ No newline at end of file diff --git a/Form-Controls/README.md b/Form-Controls/README.md index c356f8844..b5ac2c9a3 100644 --- a/Form-Controls/README.md +++ b/Form-Controls/README.md @@ -1,72 +1,72 @@ -# Form Controls - -## Learning Objectives - - - -- [ ] Interpret requirements and check against a list of criteria -- [ ] Write a valid form -- [ ] Test with Devtools -- [ ] Refactor using Devtools -- [ ] Use version control by committing often and pushing regularly to GitHub -- [ ] Develop the habit of writing clean, well-structured, and error-free code - - -## Task - -We are selling T-shirts. Write a form to collect the following data: - -Our customers already have accounts, so we know their addresses and charging details already. We don't need to collect that data. We want to confirm they are the right person, then get them to choose a colour and size. - -Writing that out as a series of questions to ask yourself: - -1. What is the customer's name? I must collect this data and ensure it contains at least two non-space characters. -2. What is the customer's email? I must make sure the email is valid. Email addresses follow a consistent pattern. -3. What colour should this T-shirt be? I must provide 3 options. How will I ensure they do not choose other colours? -4. What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL - -All fields are required. -Do not write a form action for this project. - -> [!TIP] -> To check whether the customer's name contains at least two non-space characters you may need to use a **regular expression** (or **regex** for short), which is a tool used to match patterns in text. If you wish to learn more about regular expressions there are plenty of resources on the web including the [official MDN documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions), but for this task you can use this regex that we have pre-written for you: `.*\S.*\S.*`. -> -> Now you have the regular expression, it's up to you to figure out how to use it in the context of an HTML form! - -## Acceptance Criteria - -### Developers must test their work. - -Let's write out our testable criteria. Check each one off as you complete it. - -- [ ] I have only used HTML and CSS. -- [ ] I have not used any JavaScript. - -### HTML - -- [ ] My form is semantic HTML. -- [ ] All inputs have associated labels. -- [ ] My Lighthouse Accessibility score is 100. -- [ ] I require a valid name. -- [ ] I require a valid email. -- [ ] I require one colour from a defined set of 3 colours. -- [ ] I require one size from a defined set of 6 sizes. - -### Developers must adhere to professional standards. - -> Before you say you're done: Is your code readable? Does it run correctly? Does it look professional? - -These practices reflect the level of quality expected in professional work. -They ensure your code is reliable, maintainable, and presents a polished, credible experience to users. - -- [ ] My HTML code has no errors or warnings when validated using https://validator.w3.org/ -- [ ] My code is consistently formatted -- [ ] My page content is free of typos and grammatical mistakes -- [ ] I commit often and push regularly to GitHub - -## Resources -- [MDN: Form controls](https://developer.mozilla.org/en-US/docs/Learn/Forms) -- [MDN: Form validation](https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation) -- [Lighthouse](https://developers.google.com/web/tools/lighthouse) -- [Lighthouse Guide](https://programming.codeyourfuture.io/guides/testing/lighthouse) -- [Format Code and Make Logical Commits in VS Code](../practical_guide.md) +# Form Controls + +## Learning Objectives + + + +- [ ] Interpret requirements and check against a list of criteria +- [ ] Write a valid form +- [ ] Test with Devtools +- [ ] Refactor using Devtools +- [ ] Use version control by committing often and pushing regularly to GitHub +- [ ] Develop the habit of writing clean, well-structured, and error-free code + + +## Task + +We are selling T-shirts. Write a form to collect the following data: + +Our customers already have accounts, so we know their addresses and charging details already. We don't need to collect that data. We want to confirm they are the right person, then get them to choose a colour and size. + +Writing that out as a series of questions to ask yourself: + +1. What is the customer's name? I must collect this data and ensure it contains at least two non-space characters. +2. What is the customer's email? I must make sure the email is valid. Email addresses follow a consistent pattern. +3. What colour should this T-shirt be? I must provide 3 options. How will I ensure they do not choose other colours? +4. What size does the customer want? I must provide the following 6 options: XS, S, M, L, XL, XXL + +All fields are required. +Do not write a form action for this project. + +> [!TIP] +> To check whether the customer's name contains at least two non-space characters you may need to use a **regular expression** (or **regex** for short), which is a tool used to match patterns in text. If you wish to learn more about regular expressions there are plenty of resources on the web including the [official MDN documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions), but for this task you can use this regex that we have pre-written for you: `.*\S.*\S.*`. +> +> Now you have the regular expression, it's up to you to figure out how to use it in the context of an HTML form! + +## Acceptance Criteria + +### Developers must test their work. + +Let's write out our testable criteria. Check each one off as you complete it. + +- [ ] I have only used HTML and CSS. +- [ ] I have not used any JavaScript. + +### HTML + +- [ ] My form is semantic HTML. +- [ ] All inputs have associated labels. +- [ ] My Lighthouse Accessibility score is 100. +- [ ] I require a valid name. +- [ ] I require a valid email. +- [ ] I require one colour from a defined set of 3 colours. +- [ ] I require one size from a defined set of 6 sizes. + +### Developers must adhere to professional standards. + +> Before you say you're done: Is your code readable? Does it run correctly? Does it look professional? + +These practices reflect the level of quality expected in professional work. +They ensure your code is reliable, maintainable, and presents a polished, credible experience to users. + +- [ ] My HTML code has no errors or warnings when validated using https://validator.w3.org/ +- [ ] My code is consistently formatted +- [ ] My page content is free of typos and grammatical mistakes +- [ ] I commit often and push regularly to GitHub + +## Resources +- [MDN: Form controls](https://developer.mozilla.org/en-US/docs/Learn/Forms) +- [MDN: Form validation](https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation) +- [Lighthouse](https://developers.google.com/web/tools/lighthouse) +- [Lighthouse Guide](https://programming.codeyourfuture.io/guides/testing/lighthouse) +- [Format Code and Make Logical Commits in VS Code](../practical_guide.md) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 74b591ffc..13f23e6d8 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -1,27 +1,27 @@ - - - - - - My form exercise - - - - -
-

Product Pick

-
-
-
- - -
-
- - - + + + + + + My form exercise + + + + +
+

Product Pick

+
+
+
+ + +
+
+ + + diff --git a/LICENSE.txt b/LICENSE.txt index 4cf154a2b..0746fa319 100644 --- a/LICENSE.txt +++ b/LICENSE.txt @@ -1,386 +1,386 @@ -Attribution 4.0 International - -======================================================================= - -Creative Commons Corporation ("Creative Commons") is not a law firm and -does not provide legal services or legal advice. Distribution of -Creative Commons public licenses does not create a lawyer-client or -other relationship. Creative Commons makes its licenses and related -information available on an "as-is" basis. Creative Commons gives no -warranties regarding its licenses, any material licensed under their -terms and conditions, or any related information. Creative Commons -disclaims all liability for damages resulting from their use to the -fullest extent possible. - -Using Creative Commons Public Licenses - -Creative Commons public licenses provide a standard set of terms and -conditions that creators and other rights holders may use to share -original works of authorship and other material subject to copyright -and certain other rights specified in the public license below. The -following considerations are for informational purposes only, are not -exhaustive, and do not form part of our licenses. - - Considerations for licensors: Our public licenses are - intended for use by those authorized to give the public - permission to use material in ways otherwise restricted by - copyright and certain other rights. Our licenses are - irrevocable. Licensors should read and understand the terms - and conditions of the license they choose before applying it. - Licensors should also secure all rights necessary before - applying our licenses so that the public can reuse the - material as expected. Licensors should clearly mark any - material not subject to the license. This includes other CC- - licensed material, or material used under an exception or - limitation to copyright. More considerations for licensors: - wiki.creativecommons.org/Considerations_for_licensors - - Considerations for the public: By using one of our public - licenses, a licensor grants the public permission to use the - licensed material under specified terms and conditions. If - the licensor's permission is not necessary for any reason--for - example, because of any applicable exception or limitation to - copyright--then that use is not regulated by the license. Our - licenses grant only permissions under copyright and certain - other rights that a licensor has authority to grant. Use of - the licensed material may still be restricted for other - reasons, including because others have copyright or other - rights in the material. A licensor may make special requests, - such as asking that all changes be marked or described. - Although not required by our licenses, you are encouraged to - respect those requests where reasonable. More_considerations - for the public: - wiki.creativecommons.org/Considerations_for_licensees - -======================================================================= - -Creative Commons Attribution 4.0 International Public License - -By exercising the Licensed Rights (defined below), You accept and agree -to be bound by the terms and conditions of this Creative Commons -Attribution 4.0 International Public License ("Public License"). To the -extent this Public License may be interpreted as a contract, You are -granted the Licensed Rights in consideration of Your acceptance of -these terms and conditions, and the Licensor grants You such rights in -consideration of benefits the Licensor receives from making the -Licensed Material available under these terms and conditions. - -Section 1 -- Definitions. - -a. Adapted Material means material subject to Copyright and Similar -Rights that is derived from or based upon the Licensed Material -and in which the Licensed Material is translated, altered, -arranged, transformed, or otherwise modified in a manner requiring -permission under the Copyright and Similar Rights held by the -Licensor. For purposes of this Public License, where the Licensed -Material is a musical work, performance, or sound recording, -Adapted Material is always produced where the Licensed Material is -synched in timed relation with a moving image. - -b. Adapter's License means the license You apply to Your Copyright -and Similar Rights in Your contributions to Adapted Material in -accordance with the terms and conditions of this Public License. - -c. Copyright and Similar Rights means copyright and/or similar rights -closely related to copyright including, without limitation, -performance, broadcast, sound recording, and Sui Generis Database -Rights, without regard to how the rights are labeled or -categorized. For purposes of this Public License, the rights -specified in Section 2(b)(1)-(2) are not Copyright and Similar -Rights. - -d. Effective Technological Measures means those measures that, in the -absence of proper authority, may not be circumvented under laws -fulfilling obligations under Article 11 of the WIPO Copyright -Treaty adopted on December 20, 1996, and/or similar international -agreements. - -e. Exceptions and Limitations means fair use, fair dealing, and/or -any other exception or limitation to Copyright and Similar Rights -that applies to Your use of the Licensed Material. - -f. Licensed Material means the artistic or literary work, database, -or other material to which the Licensor applied this Public -License. - -g. Licensed Rights means the rights granted to You subject to the -terms and conditions of this Public License, which are limited to -all Copyright and Similar Rights that apply to Your use of the -Licensed Material and that the Licensor has authority to license. - -h. Licensor means the individual(s) or entity(ies) granting rights -under this Public License. - -i. Share means to provide material to the public by any means or -process that requires permission under the Licensed Rights, such -as reproduction, public display, public performance, distribution, -dissemination, communication, or importation, and to make material -available to the public including in ways that members of the -public may access the material from a place and at a time -individually chosen by them. - -j. Sui Generis Database Rights means rights other than copyright -resulting from Directive 96/9/EC of the European Parliament and of -the Council of 11 March 1996 on the legal protection of databases, -as amended and/or succeeded, as well as other essentially -equivalent rights anywhere in the world. - -k. You means the individual or entity exercising the Licensed Rights -under this Public License. Your has a corresponding meaning. - -Section 2 -- Scope. - -a. License grant. - - 1. Subject to the terms and conditions of this Public License, - the Licensor hereby grants You a worldwide, royalty-free, - non-sublicensable, non-exclusive, irrevocable license to - exercise the Licensed Rights in the Licensed Material to: - - a. reproduce and Share the Licensed Material, in whole or - in part; and - - b. produce, reproduce, and Share Adapted Material. - - 2. Exceptions and Limitations. For the avoidance of doubt, where - Exceptions and Limitations apply to Your use, this Public - License does not apply, and You do not need to comply with - its terms and conditions. - - 3. Term. The term of this Public License is specified in Section - 6(a). - - 4. Media and formats; technical modifications allowed. The - Licensor authorizes You to exercise the Licensed Rights in - all media and formats whether now known or hereafter created, - and to make technical modifications necessary to do so. The - Licensor waives and/or agrees not to assert any right or - authority to forbid You from making technical modifications - necessary to exercise the Licensed Rights, including - technical modifications necessary to circumvent Effective - Technological Measures. For purposes of this Public License, - simply making modifications authorized by this Section 2(a) - (4) never produces Adapted Material. - - 5. Downstream recipients. - - a. Offer from the Licensor -- Licensed Material. Every - recipient of the Licensed Material automatically - receives an offer from the Licensor to exercise the - Licensed Rights under the terms and conditions of this - Public License. - - b. No downstream restrictions. You may not offer or impose - any additional or different terms or conditions on, or - apply any Effective Technological Measures to, the - Licensed Material if doing so restricts exercise of the - Licensed Rights by any recipient of the Licensed - Material. - - 6. No endorsement. Nothing in this Public License constitutes or - may be construed as permission to assert or imply that You - are, or that Your use of the Licensed Material is, connected - with, or sponsored, endorsed, or granted official status by, - the Licensor or others designated to receive attribution as - provided in Section 3(a)(1)(A)(i). - -b. Other rights. - - 1. Moral rights, such as the right of integrity, are not - licensed under this Public License, nor are publicity, - privacy, and/or other similar personality rights; however, to - the extent possible, the Licensor waives and/or agrees not to - assert any such rights held by the Licensor to the limited - extent necessary to allow You to exercise the Licensed - Rights, but not otherwise. - - 2. Patent and trademark rights are not licensed under this - Public License. - - 3. To the extent possible, the Licensor waives any right to - collect royalties from You for the exercise of the Licensed - Rights, whether directly or through a collecting society - under any voluntary or waivable statutory or compulsory - licensing scheme. In all other cases the Licensor expressly - reserves any right to collect such royalties. - -Section 3 -- License Conditions. - -Your exercise of the Licensed Rights is expressly made subject to the -following conditions. - -a. Attribution. - - 1. If You Share the Licensed Material (including in modified - form), You must: - - a. retain the following if it is supplied by the Licensor - with the Licensed Material: - - i. identification of the creator(s) of the Licensed - Material and any others designated to receive - attribution, in any reasonable manner requested by - the Licensor (including by pseudonym if - designated); - - ii. a copyright notice; - - iii. a notice that refers to this Public License; - - iv. a notice that refers to the disclaimer of - warranties; - - v. a URI or hyperlink to the Licensed Material to the - extent reasonably practicable; - - b. indicate if You modified the Licensed Material and - retain an indication of any previous modifications; and - - c. indicate the Licensed Material is licensed under this - Public License, and include the text of, or the URI or - hyperlink to, this Public License. - - 2. You may satisfy the conditions in Section 3(a)(1) in any - reasonable manner based on the medium, means, and context in - which You Share the Licensed Material. For example, it may be - reasonable to satisfy the conditions by providing a URI or - hyperlink to a resource that includes the required - information. - - 3. If requested by the Licensor, You must remove any of the - information required by Section 3(a)(1)(A) to the extent - reasonably practicable. - - 4. If You Share Adapted Material You produce, the Adapter's - License You apply must not prevent recipients of the Adapted - Material from complying with this Public License. - -Section 4 -- Sui Generis Database Rights. - -Where the Licensed Rights include Sui Generis Database Rights that -apply to Your use of the Licensed Material: - -a. for the avoidance of doubt, Section 2(a)(1) grants You the right -to extract, reuse, reproduce, and Share all or a substantial -portion of the contents of the database; - -b. if You include all or a substantial portion of the database -contents in a database in which You have Sui Generis Database -Rights, then the database in which You have Sui Generis Database -Rights (but not its individual contents) is Adapted Material; and - -c. You must comply with the conditions in Section 3(a) if You Share -all or a substantial portion of the contents of the database. - -For the avoidance of doubt, this Section 4 supplements and does not -replace Your obligations under this Public License where the Licensed -Rights include other Copyright and Similar Rights. - -Section 5 -- Disclaimer of Warranties and Limitation of Liability. - -a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE -EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS -AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF -ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS, -IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION, -WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR -PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS, -ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT -KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT -ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU. - -b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE -TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION, -NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT, -INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES, -COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR -USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN -ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR -DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR -IN PART, THIS LIMITATION MAY NOT APPLY TO YOU. - -c. The disclaimer of warranties and limitation of liability provided -above shall be interpreted in a manner that, to the extent -possible, most closely approximates an absolute disclaimer and -waiver of all liability. - -Section 6 -- Term and Termination. - -a. This Public License applies for the term of the Copyright and -Similar Rights licensed here. However, if You fail to comply with -this Public License, then Your rights under this Public License -terminate automatically. - -b. Where Your right to use the Licensed Material has terminated under -Section 6(a), it reinstates: - - 1. automatically as of the date the violation is cured, provided - it is cured within 30 days of Your discovery of the - violation; or - - 2. upon express reinstatement by the Licensor. - - For the avoidance of doubt, this Section 6(b) does not affect any - right the Licensor may have to seek remedies for Your violations - of this Public License. - -c. For the avoidance of doubt, the Licensor may also offer the -Licensed Material under separate terms or conditions or stop -distributing the Licensed Material at any time; however, doing so -will not terminate this Public License. - -d. Sections 1, 5, 6, 7, and 8 survive termination of this Public -License. - -Section 7 -- Other Terms and Conditions. - -a. The Licensor shall not be bound by any additional or different -terms or conditions communicated by You unless expressly agreed. - -b. Any arrangements, understandings, or agreements regarding the -Licensed Material not stated herein are separate from and -independent of the terms and conditions of this Public License. - -Section 8 -- Interpretation. - -a. For the avoidance of doubt, this Public License does not, and -shall not be interpreted to, reduce, limit, restrict, or impose -conditions on any use of the Licensed Material that could lawfully -be made without permission under this Public License. - -b. To the extent possible, if any provision of this Public License is -deemed unenforceable, it shall be automatically reformed to the -minimum extent necessary to make it enforceable. If the provision -cannot be reformed, it shall be severed from this Public License -without affecting the enforceability of the remaining terms and -conditions. - -c. No term or condition of this Public License will be waived and no -failure to comply consented to unless expressly agreed to by the -Licensor. - -d. Nothing in this Public License constitutes or may be interpreted -as a limitation upon, or waiver of, any privileges and immunities -that apply to the Licensor or You, including from the legal -processes of any jurisdiction or authority. - -======================================================================= - -Creative Commons is not a party to its public -licenses. Notwithstanding, Creative Commons may elect to apply one of -its public licenses to material it publishes and in those instances -will be considered the “Licensor.” The text of the Creative Commons -public licenses is dedicated to the public domain under the CC0 Public -Domain Dedication. Except for the limited purpose of indicating that -material is shared under a Creative Commons public license or as -otherwise permitted by the Creative Commons policies published at -creativecommons.org/policies, Creative Commons does not authorize the -use of the trademark "Creative Commons" or any other trademark or logo -of Creative Commons without its prior written consent including, -without limitation, in connection with any unauthorized modifications -to any of its public licenses or any other arrangements, -understandings, or agreements concerning use of licensed material. For -the avoidance of doubt, this paragraph does not form part of the -public licenses. - -Creative Commons may be contacted at creativecommons.org. +Attribution 4.0 International + +======================================================================= + +Creative Commons Corporation ("Creative Commons") is not a law firm and +does not provide legal services or legal advice. Distribution of +Creative Commons public licenses does not create a lawyer-client or +other relationship. Creative Commons makes its licenses and related +information available on an "as-is" basis. Creative Commons gives no +warranties regarding its licenses, any material licensed under their +terms and conditions, or any related information. Creative Commons +disclaims all liability for damages resulting from their use to the +fullest extent possible. + +Using Creative Commons Public Licenses + +Creative Commons public licenses provide a standard set of terms and +conditions that creators and other rights holders may use to share +original works of authorship and other material subject to copyright +and certain other rights specified in the public license below. The +following considerations are for informational purposes only, are not +exhaustive, and do not form part of our licenses. + + Considerations for licensors: Our public licenses are + intended for use by those authorized to give the public + permission to use material in ways otherwise restricted by + copyright and certain other rights. Our licenses are + irrevocable. Licensors should read and understand the terms + and conditions of the license they choose before applying it. + Licensors should also secure all rights necessary before + applying our licenses so that the public can reuse the + material as expected. Licensors should clearly mark any + material not subject to the license. This includes other CC- + licensed material, or material used under an exception or + limitation to copyright. More considerations for licensors: + wiki.creativecommons.org/Considerations_for_licensors + + Considerations for the public: By using one of our public + licenses, a licensor grants the public permission to use the + licensed material under specified terms and conditions. If + the licensor's permission is not necessary for any reason--for + example, because of any applicable exception or limitation to + copyright--then that use is not regulated by the license. Our + licenses grant only permissions under copyright and certain + other rights that a licensor has authority to grant. Use of + the licensed material may still be restricted for other + reasons, including because others have copyright or other + rights in the material. A licensor may make special requests, + such as asking that all changes be marked or described. + Although not required by our licenses, you are encouraged to + respect those requests where reasonable. More_considerations + for the public: + wiki.creativecommons.org/Considerations_for_licensees + +======================================================================= + +Creative Commons Attribution 4.0 International Public License + +By exercising the Licensed Rights (defined below), You accept and agree +to be bound by the terms and conditions of this Creative Commons +Attribution 4.0 International Public License ("Public License"). To the +extent this Public License may be interpreted as a contract, You are +granted the Licensed Rights in consideration of Your acceptance of +these terms and conditions, and the Licensor grants You such rights in +consideration of benefits the Licensor receives from making the +Licensed Material available under these terms and conditions. + +Section 1 -- Definitions. + +a. Adapted Material means material subject to Copyright and Similar +Rights that is derived from or based upon the Licensed Material +and in which the Licensed Material is translated, altered, +arranged, transformed, or otherwise modified in a manner requiring +permission under the Copyright and Similar Rights held by the +Licensor. For purposes of this Public License, where the Licensed +Material is a musical work, performance, or sound recording, +Adapted Material is always produced where the Licensed Material is +synched in timed relation with a moving image. + +b. Adapter's License means the license You apply to Your Copyright +and Similar Rights in Your contributions to Adapted Material in +accordance with the terms and conditions of this Public License. + +c. Copyright and Similar Rights means copyright and/or similar rights +closely related to copyright including, without limitation, +performance, broadcast, sound recording, and Sui Generis Database +Rights, without regard to how the rights are labeled or +categorized. For purposes of this Public License, the rights +specified in Section 2(b)(1)-(2) are not Copyright and Similar +Rights. + +d. Effective Technological Measures means those measures that, in the +absence of proper authority, may not be circumvented under laws +fulfilling obligations under Article 11 of the WIPO Copyright +Treaty adopted on December 20, 1996, and/or similar international +agreements. + +e. Exceptions and Limitations means fair use, fair dealing, and/or +any other exception or limitation to Copyright and Similar Rights +that applies to Your use of the Licensed Material. + +f. Licensed Material means the artistic or literary work, database, +or other material to which the Licensor applied this Public +License. + +g. Licensed Rights means the rights granted to You subject to the +terms and conditions of this Public License, which are limited to +all Copyright and Similar Rights that apply to Your use of the +Licensed Material and that the Licensor has authority to license. + +h. Licensor means the individual(s) or entity(ies) granting rights +under this Public License. + +i. Share means to provide material to the public by any means or +process that requires permission under the Licensed Rights, such +as reproduction, public display, public performance, distribution, +dissemination, communication, or importation, and to make material +available to the public including in ways that members of the +public may access the material from a place and at a time +individually chosen by them. + +j. Sui Generis Database Rights means rights other than copyright +resulting from Directive 96/9/EC of the European Parliament and of +the Council of 11 March 1996 on the legal protection of databases, +as amended and/or succeeded, as well as other essentially +equivalent rights anywhere in the world. + +k. You means the individual or entity exercising the Licensed Rights +under this Public License. Your has a corresponding meaning. + +Section 2 -- Scope. + +a. License grant. + + 1. Subject to the terms and conditions of this Public License, + the Licensor hereby grants You a worldwide, royalty-free, + non-sublicensable, non-exclusive, irrevocable license to + exercise the Licensed Rights in the Licensed Material to: + + a. reproduce and Share the Licensed Material, in whole or + in part; and + + b. produce, reproduce, and Share Adapted Material. + + 2. Exceptions and Limitations. For the avoidance of doubt, where + Exceptions and Limitations apply to Your use, this Public + License does not apply, and You do not need to comply with + its terms and conditions. + + 3. Term. The term of this Public License is specified in Section + 6(a). + + 4. Media and formats; technical modifications allowed. The + Licensor authorizes You to exercise the Licensed Rights in + all media and formats whether now known or hereafter created, + and to make technical modifications necessary to do so. The + Licensor waives and/or agrees not to assert any right or + authority to forbid You from making technical modifications + necessary to exercise the Licensed Rights, including + technical modifications necessary to circumvent Effective + Technological Measures. For purposes of this Public License, + simply making modifications authorized by this Section 2(a) + (4) never produces Adapted Material. + + 5. Downstream recipients. + + a. Offer from the Licensor -- Licensed Material. Every + recipient of the Licensed Material automatically + receives an offer from the Licensor to exercise the + Licensed Rights under the terms and conditions of this + Public License. + + b. No downstream restrictions. You may not offer or impose + any additional or different terms or conditions on, or + apply any Effective Technological Measures to, the + Licensed Material if doing so restricts exercise of the + Licensed Rights by any recipient of the Licensed + Material. + + 6. No endorsement. Nothing in this Public License constitutes or + may be construed as permission to assert or imply that You + are, or that Your use of the Licensed Material is, connected + with, or sponsored, endorsed, or granted official status by, + the Licensor or others designated to receive attribution as + provided in Section 3(a)(1)(A)(i). + +b. Other rights. + + 1. Moral rights, such as the right of integrity, are not + licensed under this Public License, nor are publicity, + privacy, and/or other similar personality rights; however, to + the extent possible, the Licensor waives and/or agrees not to + assert any such rights held by the Licensor to the limited + extent necessary to allow You to exercise the Licensed + Rights, but not otherwise. + + 2. Patent and trademark rights are not licensed under this + Public License. + + 3. To the extent possible, the Licensor waives any right to + collect royalties from You for the exercise of the Licensed + Rights, whether directly or through a collecting society + under any voluntary or waivable statutory or compulsory + licensing scheme. In all other cases the Licensor expressly + reserves any right to collect such royalties. + +Section 3 -- License Conditions. + +Your exercise of the Licensed Rights is expressly made subject to the +following conditions. + +a. Attribution. + + 1. If You Share the Licensed Material (including in modified + form), You must: + + a. retain the following if it is supplied by the Licensor + with the Licensed Material: + + i. identification of the creator(s) of the Licensed + Material and any others designated to receive + attribution, in any reasonable manner requested by + the Licensor (including by pseudonym if + designated); + + ii. a copyright notice; + + iii. a notice that refers to this Public License; + + iv. a notice that refers to the disclaimer of + warranties; + + v. a URI or hyperlink to the Licensed Material to the + extent reasonably practicable; + + b. indicate if You modified the Licensed Material and + retain an indication of any previous modifications; and + + c. indicate the Licensed Material is licensed under this + Public License, and include the text of, or the URI or + hyperlink to, this Public License. + + 2. You may satisfy the conditions in Section 3(a)(1) in any + reasonable manner based on the medium, means, and context in + which You Share the Licensed Material. For example, it may be + reasonable to satisfy the conditions by providing a URI or + hyperlink to a resource that includes the required + information. + + 3. If requested by the Licensor, You must remove any of the + information required by Section 3(a)(1)(A) to the extent + reasonably practicable. + + 4. If You Share Adapted Material You produce, the Adapter's + License You apply must not prevent recipients of the Adapted + Material from complying with this Public License. + +Section 4 -- Sui Generis Database Rights. + +Where the Licensed Rights include Sui Generis Database Rights that +apply to Your use of the Licensed Material: + +a. for the avoidance of doubt, Section 2(a)(1) grants You the right +to extract, reuse, reproduce, and Share all or a substantial +portion of the contents of the database; + +b. if You include all or a substantial portion of the database +contents in a database in which You have Sui Generis Database +Rights, then the database in which You have Sui Generis Database +Rights (but not its individual contents) is Adapted Material; and + +c. You must comply with the conditions in Section 3(a) if You Share +all or a substantial portion of the contents of the database. + +For the avoidance of doubt, this Section 4 supplements and does not +replace Your obligations under this Public License where the Licensed +Rights include other Copyright and Similar Rights. + +Section 5 -- Disclaimer of Warranties and Limitation of Liability. + +a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE +EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS +AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF +ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS, +IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION, +WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR +PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS, +ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT +KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT +ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU. + +b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE +TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION, +NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT, +INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES, +COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR +USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN +ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR +DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR +IN PART, THIS LIMITATION MAY NOT APPLY TO YOU. + +c. The disclaimer of warranties and limitation of liability provided +above shall be interpreted in a manner that, to the extent +possible, most closely approximates an absolute disclaimer and +waiver of all liability. + +Section 6 -- Term and Termination. + +a. This Public License applies for the term of the Copyright and +Similar Rights licensed here. However, if You fail to comply with +this Public License, then Your rights under this Public License +terminate automatically. + +b. Where Your right to use the Licensed Material has terminated under +Section 6(a), it reinstates: + + 1. automatically as of the date the violation is cured, provided + it is cured within 30 days of Your discovery of the + violation; or + + 2. upon express reinstatement by the Licensor. + + For the avoidance of doubt, this Section 6(b) does not affect any + right the Licensor may have to seek remedies for Your violations + of this Public License. + +c. For the avoidance of doubt, the Licensor may also offer the +Licensed Material under separate terms or conditions or stop +distributing the Licensed Material at any time; however, doing so +will not terminate this Public License. + +d. Sections 1, 5, 6, 7, and 8 survive termination of this Public +License. + +Section 7 -- Other Terms and Conditions. + +a. The Licensor shall not be bound by any additional or different +terms or conditions communicated by You unless expressly agreed. + +b. Any arrangements, understandings, or agreements regarding the +Licensed Material not stated herein are separate from and +independent of the terms and conditions of this Public License. + +Section 8 -- Interpretation. + +a. For the avoidance of doubt, this Public License does not, and +shall not be interpreted to, reduce, limit, restrict, or impose +conditions on any use of the Licensed Material that could lawfully +be made without permission under this Public License. + +b. To the extent possible, if any provision of this Public License is +deemed unenforceable, it shall be automatically reformed to the +minimum extent necessary to make it enforceable. If the provision +cannot be reformed, it shall be severed from this Public License +without affecting the enforceability of the remaining terms and +conditions. + +c. No term or condition of this Public License will be waived and no +failure to comply consented to unless expressly agreed to by the +Licensor. + +d. Nothing in this Public License constitutes or may be interpreted +as a limitation upon, or waiver of, any privileges and immunities +that apply to the Licensor or You, including from the legal +processes of any jurisdiction or authority. + +======================================================================= + +Creative Commons is not a party to its public +licenses. Notwithstanding, Creative Commons may elect to apply one of +its public licenses to material it publishes and in those instances +will be considered the “Licensor.” The text of the Creative Commons +public licenses is dedicated to the public domain under the CC0 Public +Domain Dedication. Except for the limited purpose of indicating that +material is shared under a Creative Commons public license or as +otherwise permitted by the Creative Commons policies published at +creativecommons.org/policies, Creative Commons does not authorize the +use of the trademark "Creative Commons" or any other trademark or logo +of Creative Commons without its prior written consent including, +without limitation, in connection with any unauthorized modifications +to any of its public licenses or any other arrangements, +understandings, or agreements concerning use of licensed material. For +the avoidance of doubt, this paragraph does not form part of the +public licenses. + +Creative Commons may be contacted at creativecommons.org. diff --git a/Sprint-2/1-key-exercises/1-count.js b/Sprint-2/1-key-exercises/1-count.js index 117bcb2b6..7323f68ed 100644 --- a/Sprint-2/1-key-exercises/1-count.js +++ b/Sprint-2/1-key-exercises/1-count.js @@ -1,6 +1,7 @@ -let count = 0; - -count = count + 1; - -// Line 1 is a variable declaration, creating the count variable with an initial value of 0 -// Describe what line 3 is doing, in particular focus on what = is doing +let count = 0; + +count = count + 1; +//Line 1 is variable declaration, creating the count variable with an initial value of 0 +//Line 3 takes the current value of count (0), adds 1 to it (0 + 1 = 1), and uses the assignment operator (=) to reassign and store this new value (1) back into the count variable. +// Line 1 is a variable declaration, creating the count variable with an initial value of 0 +// Describe what line 3 is doing, in particular focus on what = is doing diff --git a/Sprint-2/1-key-exercises/2-initials.js b/Sprint-2/1-key-exercises/2-initials.js index 964c9563c..b42b68be7 100644 --- a/Sprint-2/1-key-exercises/2-initials.js +++ b/Sprint-2/1-key-exercises/2-initials.js @@ -1,10 +1,12 @@ -const firstName = "Creola"; -const middleName = "Katherine"; -const lastName = "Johnson"; - -// Declare a variable called initials that stores the first character of each string. -// This should produce the string "CKJ", but you must not write the characters C, K, or J in the code of your solution. - -const initials = ``; - -// https://www.google.com/search?q=get+first+character+of+string+mdn +const firstName = "Creola"; +const middleName = "Katherine"; +const lastName = "Johnson"; + +// Declare a variable called initials that stores the first character of each string. +// This should produce the string "CKJ", but you must not write the characters C, K, or J in the code of your solution. + +const initials = firstName[0] + middleName[0] + lastName[0]; + +console.log(initials); + +// https://www.google.com/search?q=get+first+character+of+string+mdn diff --git a/Sprint-2/1-key-exercises/3-paths.js b/Sprint-2/1-key-exercises/3-paths.js index ab90ebb28..af1de47a8 100644 --- a/Sprint-2/1-key-exercises/3-paths.js +++ b/Sprint-2/1-key-exercises/3-paths.js @@ -1,23 +1,26 @@ -// The diagram below shows the different names for parts of a file path on a Unix operating system - -// ┌─────────────────────┬────────────┐ -// │ dir │ base │ -// ├──────┬ ├──────┬─────┤ -// │ root │ │ name │ ext │ -// " / home/user/dir / file .txt " -// └──────┴──────────────┴──────┴─────┘ - -// (All spaces in the "" line should be ignored. They are purely for formatting.) - -const filePath = "/Users/mitch/cyf/Module-JS1/week-1/interpret/file.txt"; -const lastSlashIndex = filePath.lastIndexOf("/"); -const base = filePath.slice(lastSlashIndex + 1); -console.log(`The base part of ${filePath} is ${base}`); - -// Create a variable to store the dir part of the filePath variable -// Create a variable to store the ext part of the variable - -const dir = ; -const ext = ; - +// The diagram below shows the different names for parts of a file path on a Unix operating system + +// ┌─────────────────────┬────────────┐ +// │ dir │ base │ +// ├──────┬ ├──────┬─────┤ +// │ root │ │ name │ ext │ +// " / home/user/dir / file .txt " +// └──────┴──────────────┴──────┴─────┘ + +// (All spaces in the "" line should be ignored. They are purely for formatting.) + +const filePath = "/Users/mitch/cyf/Module-JS1/week-1/interpret/file.txt"; +const lastSlashIndex = filePath.lastIndexOf("/"); +const base = filePath.slice(lastSlashIndex + 1); +console.log(`The base part of ${filePath} is ${base}`); + +// Create a variable to store the dir part of the filePath variable +// Create a variable to store the ext part of the variable + +const dir = filePath.slice(0, lastSlashIndex); +const ext = filePath.slice(filePath.lastIndexOf(".")); + +console.log(dir); +console.log(ext); + // https://www.google.com/search?q=slice+mdn \ No newline at end of file diff --git a/Sprint-2/1-key-exercises/4-random.js b/Sprint-2/1-key-exercises/4-random.js index 292f83aab..b0e5933f6 100644 --- a/Sprint-2/1-key-exercises/4-random.js +++ b/Sprint-2/1-key-exercises/4-random.js @@ -1,9 +1,14 @@ -const minimum = 1; -const maximum = 100; - -const num = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum; - -// In this exercise, you will need to work out what num represents? -// Try breaking down the expression and using documentation to explain what it means -// It will help to think about the order in which expressions are evaluated -// Try logging the value of num and running the program several times to build an idea of what the program is doing +const minimum = 1; +const maximum = 100; + +const num = Math.floor(Math.random() * (maximum - minimum + 1)) + minimum; + +console.log(num); + +// In this exercise, you will need to work out what num represents? +// Try breaking down the expression and using documentation to explain what it means +// It will help to think about the order in which expressions are evaluated +// Try logging the value of num and running the program several times to build an idea of what the program is doing +// Breakdown of the expression +// 1. Math.random() this generates a decimal number from 0 up to , but not including 1 +//num represents a random number between minimum and maximum \ No newline at end of file diff --git a/Sprint-2/2-mandatory-errors/0.js b/Sprint-2/2-mandatory-errors/0.js index cf6c5039f..7c1ace807 100644 --- a/Sprint-2/2-mandatory-errors/0.js +++ b/Sprint-2/2-mandatory-errors/0.js @@ -1,2 +1,4 @@ -This is just an instruction for the first activity - but it is just for human consumption -We don't want the computer to run these 2 lines - how can we solve this problem? \ No newline at end of file +//This is just an instruction for the first activity - but it is just for human consumption +//We don't want the computer to run these 2 lines - how can we solve this problem? + + //answer: by adding the 2 forward slashes before every line \ No newline at end of file diff --git a/Sprint-2/2-mandatory-errors/1.js b/Sprint-2/2-mandatory-errors/1.js index 7a43cbea7..ad09ad1ef 100644 --- a/Sprint-2/2-mandatory-errors/1.js +++ b/Sprint-2/2-mandatory-errors/1.js @@ -1,4 +1,6 @@ -// trying to create an age variable and then reassign the value by 1 - -const age = 33; -age = age + 1; +// trying to create an age variable and then reassign the value by 1 + +const age = 33; +age = age + 1; + +console.log(age); diff --git a/Sprint-2/2-mandatory-errors/2.js b/Sprint-2/2-mandatory-errors/2.js index e09b89831..e26fcdc27 100644 --- a/Sprint-2/2-mandatory-errors/2.js +++ b/Sprint-2/2-mandatory-errors/2.js @@ -1,5 +1,8 @@ -// Currently trying to print the string "I was born in Bolton" but it isn't working... -// what's the error ? - -console.log(`I was born in ${cityOfBirth}`); -const cityOfBirth = "Bolton"; +// Currently trying to print the string "I was born in Bolton" but it isn't working... +// what's the error ? + +const cityOfBirth = "Bolton"; +console.log(`I was born in ${cityOfBirth}`); + +//reason is the console.log was entered before the text + diff --git a/Sprint-2/2-mandatory-errors/3.js b/Sprint-2/2-mandatory-errors/3.js index ec101884d..4ed86ec56 100644 --- a/Sprint-2/2-mandatory-errors/3.js +++ b/Sprint-2/2-mandatory-errors/3.js @@ -1,9 +1,10 @@ -const cardNumber = 4533787178994213; -const last4Digits = cardNumber.slice(-4); - -// The last4Digits variable should store the last 4 digits of cardNumber -// However, the code isn't working -// Before running the code, make and explain a prediction about why the code won't work -// Then run the code and see what error it gives. -// Consider: Why does it give this error? Is this what I predicted? If not, what's different? -// Then try updating the expression last4Digits is assigned to, in order to get the correct value +const cardNumber = "4533787178994213"; +const last4Digits = cardNumber.slice(-4); +console.log(last4Digits); + +// The last4Digits variable should store the last 4 digits of cardNumber +// However, the code isn't working +// Before running the code, make and explain a prediction about why the code won't work +// Then run the code and see what error it gives. +// Consider: Why does it give this error? Is this what I predicted? If not, what's different? +// Then try updating the expression last4Digits is assigned to, in order to get the correct value diff --git a/Sprint-2/2-mandatory-errors/4.js b/Sprint-2/2-mandatory-errors/4.js index 5f86c730b..1d13773e8 100644 --- a/Sprint-2/2-mandatory-errors/4.js +++ b/Sprint-2/2-mandatory-errors/4.js @@ -1,2 +1,5 @@ -const 12HourClockTime = "8:53pm"; -const 24hourClockTime = "20:53"; +const twelveHourClockTime = "8:53pm"; +const twentyFourHourClockTime = "20:53"; + +console.log(twelveHourClockTime); +console.log(twentyFourHourClockTime); \ No newline at end of file diff --git a/Sprint-2/3-mandatory-interpret/1-percentage-change.js b/Sprint-2/3-mandatory-interpret/1-percentage-change.js index e24ecb8e1..169d7f69b 100644 --- a/Sprint-2/3-mandatory-interpret/1-percentage-change.js +++ b/Sprint-2/3-mandatory-interpret/1-percentage-change.js @@ -1,22 +1,30 @@ -let carPrice = "10,000"; -let priceAfterOneYear = "8,543"; - -carPrice = Number(carPrice.replaceAll(",", "")); -priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," "")); - -const priceDifference = carPrice - priceAfterOneYear; -const percentageChange = (priceDifference / carPrice) * 100; - -console.log(`The percentage change is ${percentageChange}`); - -// Read the code and then answer the questions below - -// a) How many function calls are there in this file? Write down all the lines where a function call is made - -// b) Run the code and identify the line where the error is coming from - why is this error occurring? How can you fix this problem? - -// c) Identify all the lines that are variable reassignment statements - -// d) Identify all the lines that are variable declarations - -// e) Describe what the expression Number(carPrice.replaceAll(",","")) is doing - what is the purpose of this expression? +let carPrice = "10,000"; +let priceAfterOneYear = "8,543"; + +carPrice = Number(carPrice.replaceAll(",", "")); +priceAfterOneYear = Number(priceAfterOneYear.replaceAll("," "")); + +const priceDifference = carPrice - priceAfterOneYear; +const percentageChange = (priceDifference / carPrice) * 100; + +console.log(`The percentage change is ${percentageChange}`); + +// Read the code and then answer the questions below + +// a) How many function calls are there in this file? Write down all the lines where a function call is made + //answer: we have 5 function calls across 3 lines: + //line 4 + //line 5 + //line 10 + +// b) Run the code and identify the line where the error is coming from - why is this error occurring? How can you fix this problem? + //answer: on line 5, there is an error caused by a missing comma replaceAll("," ""));. Can be fixed by changing it to priceAfterOneYear = Number(priceAfterOneYear.replaceAll(",", "")); + +// c) Identify all the lines that are variable reassignment statements + //answer: lines 4 and 5 + +// d) Identify all the lines that are variable declarations + //answer: line 1, 2, 7 and 8 + +// e) Describe what the expression Number(carPrice.replaceAll(",","")) is doing - what is the purpose of this expression? + //answer: .ReplaceAll(",", "") this will remove every comma from the price string and number will convert that clean string into a numeric value so mathematical calculations can be performed. \ No newline at end of file diff --git a/Sprint-2/3-mandatory-interpret/2-time-format.js b/Sprint-2/3-mandatory-interpret/2-time-format.js index 47d239558..a6175ebef 100644 --- a/Sprint-2/3-mandatory-interpret/2-time-format.js +++ b/Sprint-2/3-mandatory-interpret/2-time-format.js @@ -1,25 +1,31 @@ -const movieLength = 8784; // length of movie in seconds - -const remainingSeconds = movieLength % 60; -const totalMinutes = (movieLength - remainingSeconds) / 60; - -const remainingMinutes = totalMinutes % 60; -const totalHours = (totalMinutes - remainingMinutes) / 60; - -const result = `${totalHours}:${remainingMinutes}:${remainingSeconds}`; -console.log(result); - -// For the piece of code above, read the code and then answer the following questions - -// a) How many variable declarations are there in this program? - -// b) How many function calls are there? - -// c) Using documentation, explain what the expression movieLength % 60 represents -// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators - -// d) Interpret line 4, what does the expression assigned to totalMinutes mean? - -// e) What do you think the variable result represents? Can you think of a better name for this variable? - -// f) Try experimenting with different values of movieLength. Will this code work for all values of movieLength? Explain your answer +const movieLength = 8784; // length of movie in seconds + +const remainingSeconds = movieLength % 60; +const totalMinutes = (movieLength - remainingSeconds) / 60; + +const remainingMinutes = totalMinutes % 60; +const totalHours = (totalMinutes - remainingMinutes) / 60; + +const result = `${totalHours}:${remainingMinutes}:${remainingSeconds}`; +console.log(result); + +// For the piece of code above, read the code and then answer the following questions + +// a) How many variable declarations are there in this program? + //answer: we have 6 variable declarations + +// b) How many function calls are there? + //answer: there is 1 function call: line 10 + +// c) Using documentation, explain what the expression movieLength % 60 represents +// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators + //answer:% is a remainder operator, it calculates left over seconds when movie length is divided into full minutes + +// d) Interpret line 4, what does the expression assigned to totalMinutes mean? +//answer:it subtracts the left over seconds from the total movie length to get a multiple of 60, then divides by 60 to convert that duration into whole minutes. + +// e) What do you think the variable result represents? Can you think of a better name for this variable? + //answer: formattedMovieLength, it represents the movieLength format as a time string + +// f) Try experimenting with different values of movieLength. Will this code work for all values of movieLength? Explain your answer + //answer: yes it can work but only for positive numbers representing total seconds, if the movieLength is negative it will give off an output of an invalid time value \ No newline at end of file diff --git a/Sprint-2/3-mandatory-interpret/3-to-pounds.js b/Sprint-2/3-mandatory-interpret/3-to-pounds.js index 60c9ace69..418ec67e7 100644 --- a/Sprint-2/3-mandatory-interpret/3-to-pounds.js +++ b/Sprint-2/3-mandatory-interpret/3-to-pounds.js @@ -1,27 +1,37 @@ -const penceString = "399p"; - -const penceStringWithoutTrailingP = penceString.substring( - 0, - penceString.length - 1 -); - -const paddedPenceNumberString = penceStringWithoutTrailingP.padStart(3, "0"); -const pounds = paddedPenceNumberString.substring( - 0, - paddedPenceNumberString.length - 2 -); - -const pence = paddedPenceNumberString - .substring(paddedPenceNumberString.length - 2) - .padEnd(2, "0"); - -console.log(`£${pounds}.${pence}`); - -// This program takes a string representing a price in pence -// The program then builds up a string representing the price in pounds - -// You need to do a step-by-step breakdown of each line in this program -// Try and describe the purpose / rationale behind each step - -// To begin, we can start with -// 1. const penceString = "399p": initialises a string variable with the value "399p" +const penceString = "399p"; + +const penceStringWithoutTrailingP = penceString.substring( + 0, + penceString.length - 1 +); + +const paddedPenceNumberString = penceStringWithoutTrailingP.padStart(3, "0"); +const pounds = paddedPenceNumberString.substring( + 0, + paddedPenceNumberString.length - 2 +); + +const pence = paddedPenceNumberString + .substring(paddedPenceNumberString.length - 2) + .padEnd(2, "0"); + +console.log(`£${pounds}.${pence}`); + +// This program takes a string representing a price in pence +// The program then builds up a string representing the price in pounds + +// You need to do a step-by-step breakdown of each line in this program +// Try and describe the purpose / rationale behind each step + +// To begin, we can start with +// 1. const penceString = "399p": initializes a string variable with the value "399p" representing the price in pence including the trailing letter 'p' + +// 2. const penceStringWithoutTrailingP = penceString.substring(0, penceString.length - 1): Extract the numeric portion of the penceString by taking characters from index 0 up to the last character removing the 'p'because 399p is not a valid number for math. + +// 3. const paddedPenceNumberString = penceStringWithoutTrailingP . padStart(3, "0"): it ensures the penceString is at least 3 digits long by adding leading zeros if necessary ensuring there will always be 2 digits for pence and 1 for pound. + +// 4. const pounds = paddedPenceNumberString.substring(0, paddedPenceNumberString.length - 2): Extracts the pounds portion of the price by taking all digits except the last 2 + +// 5. const pence = paddedPenceNumberString.substring(paddedPenceNumberString.length - 2) padEnd(2, "0") it extracts the last 2 digits representing pence ensuring it is padded to 2 digits + +// 6. line 18 = formats and prints the final price string with the pound symbol, amount, period and pence amount i.e "£3.99" \ No newline at end of file diff --git a/Sprint-2/4-stretch-explore/chrome.md b/Sprint-2/4-stretch-explore/chrome.md index 962580b82..5de5e6331 100644 --- a/Sprint-2/4-stretch-explore/chrome.md +++ b/Sprint-2/4-stretch-explore/chrome.md @@ -1,15 +1,21 @@ -Open a new window in Chrome, right click an empty space on the page, select **Inspect** from the dropdown, then locate the **Console** tab. - -Voila! You now have access to the [Chrome V8 Engine](https://www.cloudflare.com/en-gb/learning/serverless/glossary/what-is-chrome-v8/). -Just like the Node REPL, you can input JavaScript code into the Console tab and the V8 engine will execute it. - -Let's try an example. - -In the Chrome console, invoke the function `alert` with one argument, the string `"Hello world!"`; - -What effect does calling the `alert` function have? - -Now try invoking the function `prompt` with a string input of `"What is your name?"` - store the return value of your call to `prompt` in an variable called `myName`. - -What effect does calling the `prompt` function have? -What is the return value of `prompt`? +Open a new window in Chrome, right click an empty space on the page, select **Inspect** from the dropdown, then locate the **Console** tab. + +Voila! You now have access to the [Chrome V8 Engine](https://www.cloudflare.com/en-gb/learning/serverless/glossary/what-is-chrome-v8/). +Just like the Node REPL, you can input JavaScript code into the Console tab and the V8 engine will execute it. + +Let's try an example. + +In the Chrome console, invoke the function `alert` with one argument, the string `"Hello world!"`; + +What effect does calling the `alert` function have? + + answer: it displays a pop-up dialog box in the browser window containing the message "Hello World!" and an ok button that pauses the page execution until the user dismisses it + +Now try invoking the function `prompt` with a string input of `"What is your name?"` - store the return value of your call to `prompt` in an variable called `myName`. + +What effect does calling the `prompt` function have? + answer: it pops up a box asking a question with a text field where you can type in your answer, plus an OK and cancel buttons. + +What is the return value of `prompt`? + + answer: it returns the text typed by the user as a string in the text input field when they click ok. diff --git a/Sprint-2/4-stretch-explore/objects.md b/Sprint-2/4-stretch-explore/objects.md index 0216dee56..05672ff8b 100644 --- a/Sprint-2/4-stretch-explore/objects.md +++ b/Sprint-2/4-stretch-explore/objects.md @@ -1,16 +1,27 @@ -## Objects - -In this activity, we'll explore some additional concepts that you'll encounter in more depth later on in the course. - -Open the Chrome devtools Console, type in `console.log` and then hit enter - -What output do you get? - -Now enter just `console` in the Console, what output do you get back? - -Try also entering `typeof console` - -Answer the following questions: - -What does `console` store? -What does the syntax `console.log` or `console.assert` mean? In particular, what does the `.` mean? +## Objects + +In this activity, we'll explore some additional concepts that you'll encounter in more depth later on in the course. + +Open the Chrome devtools Console, type in `console.log` and then hit enter + +What output do you get? + + answer: the output gives the function definition, i.e ƒ log() { [native code] } + +Now enter just `console` in the Console, what output do you get back? + + answer: it returns the console object with all its methods i.e (log,warn,error,assert,etc) + +Try also entering `typeof console` + + answer: it outputs "object" + +Answer the following questions: + +What does `console` store? + + answer: it is a built-in global object that stores methods used to output messages, errors and warnings to the browser console + +What does the syntax `console.log` or `console.assert` mean? In particular, what does the `.` mean? + + answer: the "." is a property accessor used to access a property or a method in an object. so console.log mean go into the object and grab the log diff --git a/Sprint-2/README.md b/Sprint-2/README.md index a47afc540..52fb6198f 100644 --- a/Sprint-2/README.md +++ b/Sprint-2/README.md @@ -1,35 +1,35 @@ -# 🧭 Guide to Sprint 2 exercises - -> https://curriculum.codeyourfuture.io/itp/javascript-fundamentals/sprints/2/prep/ - -> [!TIP] -> You should always do the prep work _before_ attempting the coursework. -> The prep shows you _how_ to do the coursework. -> There is often a step by step video you can code along with too. -> Do the prep. - -This README will guide you through the different sections for this week. - -## 1 Exercises - -In this section, you'll have a short program and task. Some of the syntax may be unfamiliar - in this case, you'll need to look things up in documentation. - -https://developer.mozilla.org/en-US/docs/Web/JavaScript - -## 2 Errors - -In this section, you'll need to go to each file in `errors` directory and run the file with node to check what the error is. Your task is to interpret the error message and explain why it occurs. The [errors documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors) will help you figure out the solution. - -## 3 Interpret - -In these tasks, you have to interpret a slightly larger program with some syntax / operators / functions that may be unfamiliar. - -You must use documentation to make sense of anything unfamiliar - learning how to look things up this way is a fundamental part of being a developer! - -You can also use `console.log` to check the value of different variables in the code. - -https://developer.mozilla.org/en-US/docs/Web/JavaScript - -## 4 Explore - Stretch 💪 - -This stretch activity will get you to start exploring new concepts and environments by yourself. It will do so by prompting you to reflect on some questions. +# 🧭 Guide to Sprint 2 exercises + +> https://curriculum.codeyourfuture.io/itp/javascript-fundamentals/sprints/2/prep/ + +> [!TIP] +> You should always do the prep work _before_ attempting the coursework. +> The prep shows you _how_ to do the coursework. +> There is often a step by step video you can code along with too. +> Do the prep. + +This README will guide you through the different sections for this week. + +## 1 Exercises + +In this section, you'll have a short program and task. Some of the syntax may be unfamiliar - in this case, you'll need to look things up in documentation. + +https://developer.mozilla.org/en-US/docs/Web/JavaScript + +## 2 Errors + +In this section, you'll need to go to each file in `errors` directory and run the file with node to check what the error is. Your task is to interpret the error message and explain why it occurs. The [errors documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors) will help you figure out the solution. + +## 3 Interpret + +In these tasks, you have to interpret a slightly larger program with some syntax / operators / functions that may be unfamiliar. + +You must use documentation to make sense of anything unfamiliar - learning how to look things up this way is a fundamental part of being a developer! + +You can also use `console.log` to check the value of different variables in the code. + +https://developer.mozilla.org/en-US/docs/Web/JavaScript + +## 4 Explore - Stretch 💪 + +This stretch activity will get you to start exploring new concepts and environments by yourself. It will do so by prompting you to reflect on some questions. diff --git a/Sprint-3/1-key-errors/0.js b/Sprint-3/1-key-errors/0.js index 653d6f5a0..a3386b201 100644 --- a/Sprint-3/1-key-errors/0.js +++ b/Sprint-3/1-key-errors/0.js @@ -1,13 +1,13 @@ -// Predict and explain first... -// =============> write your prediction here - -// call the function capitalise with a string input -// interpret the error message and figure out why an error is occurring - -function capitalise(str) { - let str = `${str[0].toUpperCase()}${str.slice(1)}`; - return str; -} - -// =============> write your explanation here -// =============> write your new code here +// Predict and explain first... +// =============> write your prediction here + +// call the function capitalise with a string input +// interpret the error message and figure out why an error is occurring + +function capitalise(str) { + let str = `${str[0].toUpperCase()}${str.slice(1)}`; + return str; +} + +// =============> write your explanation here +// =============> write your new code here diff --git a/Sprint-3/1-key-errors/1.js b/Sprint-3/1-key-errors/1.js index f2d56151f..167e7e212 100644 --- a/Sprint-3/1-key-errors/1.js +++ b/Sprint-3/1-key-errors/1.js @@ -1,20 +1,20 @@ -// Predict and explain first... - -// Why will an error occur when this program runs? -// =============> write your prediction here - -// Try playing computer with the example to work out what is going on - -function convertToPercentage(decimalNumber) { - const decimalNumber = 0.5; - const percentage = `${decimalNumber * 100}%`; - - return percentage; -} - -console.log(decimalNumber); - -// =============> write your explanation here - -// Finally, correct the code to fix the problem -// =============> write your new code here +// Predict and explain first... + +// Why will an error occur when this program runs? +// =============> write your prediction here + +// Try playing computer with the example to work out what is going on + +function convertToPercentage(decimalNumber) { + const decimalNumber = 0.5; + const percentage = `${decimalNumber * 100}%`; + + return percentage; +} + +console.log(decimalNumber); + +// =============> write your explanation here + +// Finally, correct the code to fix the problem +// =============> write your new code here diff --git a/Sprint-3/1-key-errors/2.js b/Sprint-3/1-key-errors/2.js index aad57f7cf..62ac17d11 100644 --- a/Sprint-3/1-key-errors/2.js +++ b/Sprint-3/1-key-errors/2.js @@ -1,20 +1,20 @@ - -// Predict and explain first BEFORE you run any code... - -// this function should square any number but instead we're going to get an error - -// =============> write your prediction of the error here - -function square(3) { - return num * num; -} - -// =============> write the error message here - -// =============> explain this error message here - -// Finally, correct the code to fix the problem - -// =============> write your new code here - - + +// Predict and explain first BEFORE you run any code... + +// this function should square any number but instead we're going to get an error + +// =============> write your prediction of the error here + +function square(3) { + return num * num; +} + +// =============> write the error message here + +// =============> explain this error message here + +// Finally, correct the code to fix the problem + +// =============> write your new code here + + diff --git a/Sprint-3/2-mandatory-debug/0.js b/Sprint-3/2-mandatory-debug/0.js index b27511b41..84ef9a69c 100644 --- a/Sprint-3/2-mandatory-debug/0.js +++ b/Sprint-3/2-mandatory-debug/0.js @@ -1,14 +1,14 @@ -// Predict and explain first... - -// =============> write your prediction here - -function multiply(a, b) { - console.log(a * b); -} - -console.log(`The result of multiplying 10 and 32 is ${multiply(10, 32)}`); - -// =============> write your explanation here - -// Finally, correct the code to fix the problem -// =============> write your new code here +// Predict and explain first... + +// =============> write your prediction here + +function multiply(a, b) { + console.log(a * b); +} + +console.log(`The result of multiplying 10 and 32 is ${multiply(10, 32)}`); + +// =============> write your explanation here + +// Finally, correct the code to fix the problem +// =============> write your new code here diff --git a/Sprint-3/2-mandatory-debug/1.js b/Sprint-3/2-mandatory-debug/1.js index 37cedfbcf..4e144da7b 100644 --- a/Sprint-3/2-mandatory-debug/1.js +++ b/Sprint-3/2-mandatory-debug/1.js @@ -1,13 +1,13 @@ -// Predict and explain first... -// =============> write your prediction here - -function sum(a, b) { - return; - a + b; -} - -console.log(`The sum of 10 and 32 is ${sum(10, 32)}`); - -// =============> write your explanation here -// Finally, correct the code to fix the problem -// =============> write your new code here +// Predict and explain first... +// =============> write your prediction here + +function sum(a, b) { + return; + a + b; +} + +console.log(`The sum of 10 and 32 is ${sum(10, 32)}`); + +// =============> write your explanation here +// Finally, correct the code to fix the problem +// =============> write your new code here diff --git a/Sprint-3/2-mandatory-debug/2.js b/Sprint-3/2-mandatory-debug/2.js index 57d3f5dc3..ead743aac 100644 --- a/Sprint-3/2-mandatory-debug/2.js +++ b/Sprint-3/2-mandatory-debug/2.js @@ -1,24 +1,24 @@ -// Predict and explain first... - -// Predict the output of the following code: -// =============> Write your prediction here - -const num = 103; - -function getLastDigit() { - return num.toString().slice(-1); -} - -console.log(`The last digit of 42 is ${getLastDigit(42)}`); -console.log(`The last digit of 105 is ${getLastDigit(105)}`); -console.log(`The last digit of 806 is ${getLastDigit(806)}`); - -// Now run the code and compare the output to your prediction -// =============> write the output here -// Explain why the output is the way it is -// =============> write your explanation here -// Finally, correct the code to fix the problem -// =============> write your new code here - -// This program should tell the user the last digit of each number. -// Explain why getLastDigit is not working properly - correct the problem +// Predict and explain first... + +// Predict the output of the following code: +// =============> Write your prediction here + +const num = 103; + +function getLastDigit() { + return num.toString().slice(-1); +} + +console.log(`The last digit of 42 is ${getLastDigit(42)}`); +console.log(`The last digit of 105 is ${getLastDigit(105)}`); +console.log(`The last digit of 806 is ${getLastDigit(806)}`); + +// Now run the code and compare the output to your prediction +// =============> write the output here +// Explain why the output is the way it is +// =============> write your explanation here +// Finally, correct the code to fix the problem +// =============> write your new code here + +// This program should tell the user the last digit of each number. +// Explain why getLastDigit is not working properly - correct the problem diff --git a/Sprint-3/3-mandatory-implement/1-bmi.js b/Sprint-3/3-mandatory-implement/1-bmi.js index 58b1085f1..270f7f567 100644 --- a/Sprint-3/3-mandatory-implement/1-bmi.js +++ b/Sprint-3/3-mandatory-implement/1-bmi.js @@ -1,19 +1,19 @@ -// Below are the steps for how BMI is calculated - -// The BMI calculation divides an adult's weight in kilograms (kg) by their height in metres (m) squared. - -// For example, if you weigh 70kg (around 11 stone) and are 1.73m (around 5 feet 8 inches) tall, you work out your BMI by: - -// squaring your height: 1.73 x 1.73 = 2.99 -// dividing 70 by 2.99 = 23.41 -// Your result will be displayed to 1 decimal place, for example '23.4'. - -// You will need to implement a function that calculates the BMI of someone based off their weight and height - -// Given someone's weight in kg and height in metres -// Then when we call this function with the weight and height -// It should return a string of their Body Mass Index to 1 decimal place - -function calculateBMI(weight, height) { - // return the BMI of someone based off their weight and height -} +// Below are the steps for how BMI is calculated + +// The BMI calculation divides an adult's weight in kilograms (kg) by their height in metres (m) squared. + +// For example, if you weigh 70kg (around 11 stone) and are 1.73m (around 5 feet 8 inches) tall, you work out your BMI by: + +// squaring your height: 1.73 x 1.73 = 2.99 +// dividing 70 by 2.99 = 23.41 +// Your result will be displayed to 1 decimal place, for example '23.4'. + +// You will need to implement a function that calculates the BMI of someone based off their weight and height + +// Given someone's weight in kg and height in metres +// Then when we call this function with the weight and height +// It should return a string of their Body Mass Index to 1 decimal place + +function calculateBMI(weight, height) { + // return the BMI of someone based off their weight and height +} diff --git a/Sprint-3/3-mandatory-implement/2-cases.js b/Sprint-3/3-mandatory-implement/2-cases.js index 5b0ef77ad..6e0491a8b 100644 --- a/Sprint-3/3-mandatory-implement/2-cases.js +++ b/Sprint-3/3-mandatory-implement/2-cases.js @@ -1,16 +1,16 @@ -// A set of words can be grouped together in different cases. - -// For example, "hello there" in snake case would be written "hello_there" -// UPPER_SNAKE_CASE means taking a string and writing it in all caps with underscores instead of spaces. - -// Implement a function that: - -// Given a string input like "hello there" -// When we call this function with the input string -// it returns the string in UPPER_SNAKE_CASE, so "HELLO_THERE" - -// Another example: "lord of the rings" should be "LORD_OF_THE_RINGS" - -// You will need to come up with an appropriate name for the function -// Use the MDN string documentation to help you find a solution -// This might help https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase +// A set of words can be grouped together in different cases. + +// For example, "hello there" in snake case would be written "hello_there" +// UPPER_SNAKE_CASE means taking a string and writing it in all caps with underscores instead of spaces. + +// Implement a function that: + +// Given a string input like "hello there" +// When we call this function with the input string +// it returns the string in UPPER_SNAKE_CASE, so "HELLO_THERE" + +// Another example: "lord of the rings" should be "LORD_OF_THE_RINGS" + +// You will need to come up with an appropriate name for the function +// Use the MDN string documentation to help you find a solution +// This might help https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase diff --git a/Sprint-3/3-mandatory-implement/3-to-pounds.js b/Sprint-3/3-mandatory-implement/3-to-pounds.js index 10754da73..eb2711685 100644 --- a/Sprint-3/3-mandatory-implement/3-to-pounds.js +++ b/Sprint-3/3-mandatory-implement/3-to-pounds.js @@ -1,6 +1,6 @@ -// In Sprint-1, there is a program written in 3-mandatory-interpret/3-to-pounds.js - -// You will need to take this code and turn it into a reusable block of code. -// You will need to declare a function called toPounds with an appropriately named parameter. - -// You should call this function a number of times to check it works for different inputs +// In Sprint-1, there is a program written in 3-mandatory-interpret/3-to-pounds.js + +// You will need to take this code and turn it into a reusable block of code. +// You will need to declare a function called toPounds with an appropriately named parameter. + +// You should call this function a number of times to check it works for different inputs diff --git a/Sprint-3/4-mandatory-interpret/time-format.js b/Sprint-3/4-mandatory-interpret/time-format.js index c0dd9c9a5..f88fe3ca5 100644 --- a/Sprint-3/4-mandatory-interpret/time-format.js +++ b/Sprint-3/4-mandatory-interpret/time-format.js @@ -1,38 +1,38 @@ -function pad(num) { - let numString = num.toString(); - while (numString.length < 2) { - numString = "0" + numString; - } - return numString; -} - -function formatTimeDisplay(seconds) { - const remainingSeconds = seconds % 60; - const totalMinutes = (seconds - remainingSeconds) / 60; - const remainingMinutes = totalMinutes % 60; - const totalHours = (totalMinutes - remainingMinutes) / 60; - - return `${pad(totalHours)}:${pad(remainingMinutes)}:${pad(remainingSeconds)}`; -} - -// You will need to play computer with this example - use the Python Visualiser https://pythontutor.com/visualize.html#mode=edit -// to help you answer these questions - -// Questions - -// a) When formatTimeDisplay is called how many times will pad be called? -// =============> write your answer here - -// Call formatTimeDisplay with an input of 61, now answer the following: - -// b) What is the value assigned to num when pad is called for the first time? -// =============> write your answer here - -// c) What is the return value of pad when it is called for the first time? -// =============> write your answer here - -// d) What is the value assigned to num when pad is called for the last time in this program? Explain your answer -// =============> write your answer here - -// e) What is the return value of pad when it is called for the last time in this program? Explain your answer -// =============> write your answer here +function pad(num) { + let numString = num.toString(); + while (numString.length < 2) { + numString = "0" + numString; + } + return numString; +} + +function formatTimeDisplay(seconds) { + const remainingSeconds = seconds % 60; + const totalMinutes = (seconds - remainingSeconds) / 60; + const remainingMinutes = totalMinutes % 60; + const totalHours = (totalMinutes - remainingMinutes) / 60; + + return `${pad(totalHours)}:${pad(remainingMinutes)}:${pad(remainingSeconds)}`; +} + +// You will need to play computer with this example - use the Python Visualiser https://pythontutor.com/visualize.html#mode=edit +// to help you answer these questions + +// Questions + +// a) When formatTimeDisplay is called how many times will pad be called? +// =============> write your answer here + +// Call formatTimeDisplay with an input of 61, now answer the following: + +// b) What is the value assigned to num when pad is called for the first time? +// =============> write your answer here + +// c) What is the return value of pad when it is called for the first time? +// =============> write your answer here + +// d) What is the value assigned to num when pad is called for the last time in this program? Explain your answer +// =============> write your answer here + +// e) What is the return value of pad when it is called for the last time in this program? Explain your answer +// =============> write your answer here diff --git a/Sprint-3/5-stretch-extend/format-time.js b/Sprint-3/5-stretch-extend/format-time.js index 32a32e66b..09483e2e2 100644 --- a/Sprint-3/5-stretch-extend/format-time.js +++ b/Sprint-3/5-stretch-extend/format-time.js @@ -1,25 +1,25 @@ -// This is the latest solution to the problem from the prep. -// Make sure to do the prep before you do the coursework -// Your task is to write tests for as many different groups of input data or edge cases as you can, and fix any bugs you find. - -function formatAs12HourClock(time) { - const hours = Number(time.slice(0, 2)); - if (hours > 12) { - return `${hours - 12}:00 pm`; - } - return `${time} am`; -} - -const currentOutput = formatAs12HourClock("08:00"); -const targetOutput = "08:00 am"; -console.assert( - currentOutput === targetOutput, - `current output: ${currentOutput}, target output: ${targetOutput}` -); - -const currentOutput2 = formatAs12HourClock("23:00"); -const targetOutput2 = "11:00 pm"; -console.assert( - currentOutput2 === targetOutput2, - `current output: ${currentOutput2}, target output: ${targetOutput2}` -); +// This is the latest solution to the problem from the prep. +// Make sure to do the prep before you do the coursework +// Your task is to write tests for as many different groups of input data or edge cases as you can, and fix any bugs you find. + +function formatAs12HourClock(time) { + const hours = Number(time.slice(0, 2)); + if (hours > 12) { + return `${hours - 12}:00 pm`; + } + return `${time} am`; +} + +const currentOutput = formatAs12HourClock("08:00"); +const targetOutput = "08:00 am"; +console.assert( + currentOutput === targetOutput, + `current output: ${currentOutput}, target output: ${targetOutput}` +); + +const currentOutput2 = formatAs12HourClock("23:00"); +const targetOutput2 = "11:00 pm"; +console.assert( + currentOutput2 === targetOutput2, + `current output: ${currentOutput2}, target output: ${targetOutput2}` +); diff --git a/Sprint-3/README.md b/Sprint-3/README.md index 992ae7906..1e2e71c38 100644 --- a/Sprint-3/README.md +++ b/Sprint-3/README.md @@ -1,41 +1,41 @@ -# 🧭 Guide to Sprint 3 exercises - -> https://curriculum.codeyourfuture.io/itp/javascript-fundamentals/sprints/3/prep/ - -> [!TIP] -> You should always do the prep work _before_ attempting the coursework. -> The prep shows you how to do the coursework. -> There is often a step by step video you can code along with too. -> Do the prep. - -## 1 Errors - -In this section, you need to go to each file in `errors` directory. Read the file and predict what error will happen. Then run the file with node to check what the error is. Your task is to interpret the error message and explain why it occurs. The [errors documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors) will help you figure out the solution. - -## 2 Debug - -In this section, you need to go to each file in `debug` to **explain and predict** why the program isn't behaving as intended. Then you'll need to run the program with node to check your prediction. You will also need to correct the code too. - -## 3 Implement - -In this section, you will have a short set of requirements about a function. You will need to implement a function based off this set of requirements. Make sure you check your function works for a number of different inputs. - -Here is a recommended order: - -1. `1-bmi.js` -1. `2-cases.js` -1. `3-to-pounds.js` - -## 4 Interpret - -In these tasks, you have to interpret a slightly larger program with some syntax / operators / functions that may be unfamiliar. - -You must use documentation to make sense of anything unfamiliar. Learning how to look things up this way is a fundamental part of being a developer! - -You can also use `console.log` to check the value of different variables in the code. - -## 5 Extend - -In the prep for this sprint, we developed a function to convert 24 hour clock times to 12 hour clock times. - -Your task is to write tests for as many different groups of input data or edge cases as you can, and fix any bugs you find. This section is not mandatory, but it will also help you solve some similar kata in Codewars. +# 🧭 Guide to Sprint 3 exercises + +> https://curriculum.codeyourfuture.io/itp/javascript-fundamentals/sprints/3/prep/ + +> [!TIP] +> You should always do the prep work _before_ attempting the coursework. +> The prep shows you how to do the coursework. +> There is often a step by step video you can code along with too. +> Do the prep. + +## 1 Errors + +In this section, you need to go to each file in `errors` directory. Read the file and predict what error will happen. Then run the file with node to check what the error is. Your task is to interpret the error message and explain why it occurs. The [errors documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors) will help you figure out the solution. + +## 2 Debug + +In this section, you need to go to each file in `debug` to **explain and predict** why the program isn't behaving as intended. Then you'll need to run the program with node to check your prediction. You will also need to correct the code too. + +## 3 Implement + +In this section, you will have a short set of requirements about a function. You will need to implement a function based off this set of requirements. Make sure you check your function works for a number of different inputs. + +Here is a recommended order: + +1. `1-bmi.js` +1. `2-cases.js` +1. `3-to-pounds.js` + +## 4 Interpret + +In these tasks, you have to interpret a slightly larger program with some syntax / operators / functions that may be unfamiliar. + +You must use documentation to make sense of anything unfamiliar. Learning how to look things up this way is a fundamental part of being a developer! + +You can also use `console.log` to check the value of different variables in the code. + +## 5 Extend + +In the prep for this sprint, we developed a function to convert 24 hour clock times to 12 hour clock times. + +Your task is to write tests for as many different groups of input data or edge cases as you can, and fix any bugs you find. This section is not mandatory, but it will also help you solve some similar kata in Codewars. diff --git a/Wireframe/README.md b/Wireframe/README.md index b1712c4b3..31300832e 100644 --- a/Wireframe/README.md +++ b/Wireframe/README.md @@ -1,55 +1,55 @@ -# Wireframe - -## Learning Objectives - - - -- [ ] Use semantic HTML tags to structure the webpage -- [ ] Create three articles, each including an image, title, summary, and a link -- [ ] Use CSS to lay out and style elements so they match a wireframe design -- [ ] Test web code using [Lighthouse](https://programming.codeyourfuture.io/guides/testing/lighthouse) -- [ ] Use version control by committing often and pushing regularly to GitHub -- [ ] Develop the habit of writing clean, well-structured, and error-free code - - -## Task -![Wireframe](./wireframe.png) - -Using the provided wireframe and resources, write a new webpage explaining: - -1. What is the purpose of a README file? -1. What is the purpose of a wireframe? -1. What is a branch in Git? - -Then arrange and style the elements so the page closely matches the wireframe. Exact replication is the goal, but small differences may be accepted. - -You can add image files, but you _must_ modify `index.html` and `style.css` to meet the acceptance criteria and you must check this criteria yourself before you submit your work. - -## Acceptance Criteria - -- [ ] Semantic HTML tags are used to structure the webpage. -- [ ] The page scores 100 for Accessibility in the Lighthouse audit. -- [ ] The webpage is styled using a linked .css file. -- [ ] The webpage is properly committed and pushed to a branch on GitHub. -- [ ] The articles section contains three distinct articles, each with its own unique image, title, summary, and link. -- [ ] The page footer is fixed to the bottom of the viewport; it remains in place when the page scrolls. -- [ ] The page layout closely match the wireframe. - -### Developers must adhere to professional standards. - -> Before you say you're done: Is your code readable? Does it run correctly? Does it look professional? - -These practices reflect the level of quality expected in professional work. -They ensure your code is reliable, maintainable, and presents a polished, credible experience to users. - -- [ ] My HTML code has no errors or warnings when validated using https://validator.w3.org/ -- [ ] My code is consistently formatted -- [ ] My page content is free of typos and grammatical mistakes -- [ ] I commit often and push regularly to GitHub - -## Resources - -- [Wireframe](https://www.productplan.com/glossary/wireframe/) -- [Semantic HTML](https://www.w3schools.com/html/html5_semantic_elements.asp) -- [:first-child](https://developer.mozilla.org/en-US/docs/Web/CSS/:first-child) -- [Format Code and Make Logical Commits in VS Code](../practical_guide.md) +# Wireframe + +## Learning Objectives + + + +- [ ] Use semantic HTML tags to structure the webpage +- [ ] Create three articles, each including an image, title, summary, and a link +- [ ] Use CSS to lay out and style elements so they match a wireframe design +- [ ] Test web code using [Lighthouse](https://programming.codeyourfuture.io/guides/testing/lighthouse) +- [ ] Use version control by committing often and pushing regularly to GitHub +- [ ] Develop the habit of writing clean, well-structured, and error-free code + + +## Task +![Wireframe](./wireframe.png) + +Using the provided wireframe and resources, write a new webpage explaining: + +1. What is the purpose of a README file? +1. What is the purpose of a wireframe? +1. What is a branch in Git? + +Then arrange and style the elements so the page closely matches the wireframe. Exact replication is the goal, but small differences may be accepted. + +You can add image files, but you _must_ modify `index.html` and `style.css` to meet the acceptance criteria and you must check this criteria yourself before you submit your work. + +## Acceptance Criteria + +- [ ] Semantic HTML tags are used to structure the webpage. +- [ ] The page scores 100 for Accessibility in the Lighthouse audit. +- [ ] The webpage is styled using a linked .css file. +- [ ] The webpage is properly committed and pushed to a branch on GitHub. +- [ ] The articles section contains three distinct articles, each with its own unique image, title, summary, and link. +- [ ] The page footer is fixed to the bottom of the viewport; it remains in place when the page scrolls. +- [ ] The page layout closely match the wireframe. + +### Developers must adhere to professional standards. + +> Before you say you're done: Is your code readable? Does it run correctly? Does it look professional? + +These practices reflect the level of quality expected in professional work. +They ensure your code is reliable, maintainable, and presents a polished, credible experience to users. + +- [ ] My HTML code has no errors or warnings when validated using https://validator.w3.org/ +- [ ] My code is consistently formatted +- [ ] My page content is free of typos and grammatical mistakes +- [ ] I commit often and push regularly to GitHub + +## Resources + +- [Wireframe](https://www.productplan.com/glossary/wireframe/) +- [Semantic HTML](https://www.w3schools.com/html/html5_semantic_elements.asp) +- [:first-child](https://developer.mozilla.org/en-US/docs/Web/CSS/:first-child) +- [Format Code and Make Logical Commits in VS Code](../practical_guide.md) diff --git a/Wireframe/index.html b/Wireframe/index.html index 0e014e535..7216baf9c 100644 --- a/Wireframe/index.html +++ b/Wireframe/index.html @@ -1,33 +1,33 @@ - - - - - - Wireframe - - - -
-

Wireframe

-

- This is the default, provided code and no changes have been made yet. -

-
-
-
- -

Title

-

- Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, - voluptates. Quisquam, voluptates. -

- Read more -
-
- - - + + + + + + Wireframe + + + +
+

Wireframe

+

+ This is the default, provided code and no changes have been made yet. +

+
+
+
+ +

Title

+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, + voluptates. Quisquam, voluptates. +

+ Read more +
+
+ + + diff --git a/Wireframe/placeholder.svg b/Wireframe/placeholder.svg index ac36a0abc..fc889c6da 100644 --- a/Wireframe/placeholder.svg +++ b/Wireframe/placeholder.svg @@ -1,6 +1,6 @@ - - - - - + + + + + \ No newline at end of file diff --git a/Wireframe/style.css b/Wireframe/style.css index aca09e1cc..22d3095ed 100644 --- a/Wireframe/style.css +++ b/Wireframe/style.css @@ -1,8 +1,8 @@ -/* - (Suggestion) Use a top-down approach when applying CSS: - 1. Lay out the top-level elements:
,
,
- - - Coursework - - - -

🧐 CYF Coursework Disposable Branch Previews

-
-
    -
  1. -

    Project 1: Wireframe

    -

    - Mentors: - open the assignment in a tab -

    -
    2. -
  2. -

    Project 2: Form Controls

    -

    - Mentors: - open the assignment in a tab -

    -
    3. -
-
- - - + + + + + + Coursework + + + +

🧐 CYF Coursework Disposable Branch Previews

+
+
    +
  1. +

    Project 1: Wireframe

    +

    + Mentors: + open the assignment in a tab +

    +
    2. +
  2. +

    Project 2: Form Controls

    +

    + Mentors: + open the assignment in a tab +

    +
    3. +
+
+ + + diff --git a/netlify.toml b/netlify.toml index 967c08285..aa2a57498 100644 --- a/netlify.toml +++ b/netlify.toml @@ -1,16 +1,16 @@ -[[plugins]] - package = "@netlify/plugin-lighthouse" - - [plugins.inputs] - fail_deploy_on_score_thresholds = true - - [plugins.inputs.thresholds] - accessibility = 1.0 - - [[plugins.inputs.audits]] - path = "/wireframe/" - output_path = "reports/wireframe.html" - - [[plugins.inputs.audits]] - path = "/form-controls/" - output_path = "reports/form-controls.html" +[[plugins]] + package = "@netlify/plugin-lighthouse" + + [plugins.inputs] + fail_deploy_on_score_thresholds = true + + [plugins.inputs.thresholds] + accessibility = 1.0 + + [[plugins.inputs.audits]] + path = "/wireframe/" + output_path = "reports/wireframe.html" + + [[plugins.inputs.audits]] + path = "/form-controls/" + output_path = "reports/form-controls.html" diff --git a/package.json b/package.json index eb798a7b6..029e8fb5d 100644 --- a/package.json +++ b/package.json @@ -1,15 +1,15 @@ -{ - "name": "module-javascript-fundamentals", - "version": "1.0.0", - "description": "Like learning a musical instrument, programming requires daily practice.", - "main": "index.js", - "scripts": { - "test": "jest" - }, - "keywords": [], - "author": "Code Your Future", - "license": "ISC", - "dependencies": { - "jest": "^29.7.0" - } -} +{ + "name": "module-javascript-fundamentals", + "version": "1.0.0", + "description": "Like learning a musical instrument, programming requires daily practice.", + "main": "index.js", + "scripts": { + "test": "jest" + }, + "keywords": [], + "author": "Code Your Future", + "license": "ISC", + "dependencies": { + "jest": "^29.7.0" + } +} diff --git a/practical_guide.md b/practical_guide.md index 90537cd76..e974f7285 100644 --- a/practical_guide.md +++ b/practical_guide.md @@ -1,58 +1,58 @@ -## Clean Code and Smart Commits: A Practical Guide - -### 1. Formatting code consistently - -- In VS Code, right-click anywhere in the editor and choose "Format Document" from the context menu. - -- You can also use the shortcut: - - Windows/Linux: `Shift + Alt + F` - - macOS: `Shift + Option + F` - -- More details: https://code.visualstudio.com/docs/editing/codebasics#_formatting - ---- -### 2. Enabling automatic formatting - -- Open your VS Code settings (user or workspace settings). - - Guide: https://code.visualstudio.com/docs/getstarted/settings#_creating-user-and-workspace-settings -- Search for `editor format` -- Set `editor.formatOnSave` and `editor.formatOnPaste` to true - -This ensures your code stays clean without needing manual formatting each time. - ---- - -### 3. Committing files often, in meaningful groups - -Creating small, focused commits improves both your workflow and team collaboration. - -Why this matters: -- **Clarity**: Each commit tells a clear story (one feature, one fix, one change). -- **Debugging**: Easy to find and undo the commit that caused a bug. -- **Collaboration**: Teammates can review and understand changes faster. -- **History**: Project log becomes a readable timeline, not a messy dump. -- **Safety**: Progress is saved in safe, logical steps—less risk of losing work. - -#### Appraoch 1: Using VS Code - -- In the Source Control panel, stage individual files instead of all changes. -- Commit only what is staged. -- Watch this video (around 12:50): https://www.youtube.com/watch?v=z5jZ9lrSpqk&t=705 - -#### Approach 2: Using Git commands - -1. Stage a changed file (`git add`) - -e.g.: To stage a modified file named `index.html` -``` -git add index.html -``` - -2. Commit the staged changes: (`git commit`) - -e.g.: To commit the staged changes with a short commit message -``` -git commit -m "Fix syntax error" -``` - -- Additional resource: [W3School Git Tutorial](https://www.w3schools.com/git/default.asp?remote=github) +## Clean Code and Smart Commits: A Practical Guide + +### 1. Formatting code consistently + +- In VS Code, right-click anywhere in the editor and choose "Format Document" from the context menu. + +- You can also use the shortcut: + - Windows/Linux: `Shift + Alt + F` + - macOS: `Shift + Option + F` + +- More details: https://code.visualstudio.com/docs/editing/codebasics#_formatting + +--- +### 2. Enabling automatic formatting + +- Open your VS Code settings (user or workspace settings). + - Guide: https://code.visualstudio.com/docs/getstarted/settings#_creating-user-and-workspace-settings +- Search for `editor format` +- Set `editor.formatOnSave` and `editor.formatOnPaste` to true + +This ensures your code stays clean without needing manual formatting each time. + +--- + +### 3. Committing files often, in meaningful groups + +Creating small, focused commits improves both your workflow and team collaboration. + +Why this matters: +- **Clarity**: Each commit tells a clear story (one feature, one fix, one change). +- **Debugging**: Easy to find and undo the commit that caused a bug. +- **Collaboration**: Teammates can review and understand changes faster. +- **History**: Project log becomes a readable timeline, not a messy dump. +- **Safety**: Progress is saved in safe, logical steps—less risk of losing work. + +#### Appraoch 1: Using VS Code + +- In the Source Control panel, stage individual files instead of all changes. +- Commit only what is staged. +- Watch this video (around 12:50): https://www.youtube.com/watch?v=z5jZ9lrSpqk&t=705 + +#### Approach 2: Using Git commands + +1. Stage a changed file (`git add`) + +e.g.: To stage a modified file named `index.html` +``` +git add index.html +``` + +2. Commit the staged changes: (`git commit`) + +e.g.: To commit the staged changes with a short commit message +``` +git commit -m "Fix syntax error" +``` + +- Additional resource: [W3School Git Tutorial](https://www.w3schools.com/git/default.asp?remote=github)