diff --git a/.github/workflows/e2e-playwright.yml b/.github/workflows/e2e-playwright.yml index 1bf883a04d105f..8c3f76fba03584 100644 --- a/.github/workflows/e2e-playwright.yml +++ b/.github/workflows/e2e-playwright.yml @@ -157,10 +157,16 @@ jobs: pnpm run start-ci & sleep 10 npx playwright test --project="${{ matrix.browsers }}" --grep-invert 'third-party-donation.spec.ts' - - uses: actions/upload-artifact@v4 if: ${{ !cancelled() }} with: name: playwright-report-${{ matrix.browsers }} path: playwright/reporter retention-days: 30 + - name: Upload screenshots + if: failure() + uses: actions/upload-artifact@v4 + with: + name: screenshots-${{ matrix.browsers }} + path: playwright/test-results + retention-days: 14 diff --git a/LICENSE.md b/LICENSE.md index fdd6370f0f96ec..17ec4908623714 100644 --- a/LICENSE.md +++ b/LICENSE.md @@ -1,6 +1,6 @@ BSD 3-Clause License -Copyright (c) 2024, freeCodeCamp. +Copyright (c) 2025, freeCodeCamp. All rights reserved. Redistribution and use in source and binary forms, with or without diff --git a/README.md b/README.md index 4a4ae06f622184..f3382cf80ad371 100644 --- a/README.md +++ b/README.md @@ -263,9 +263,9 @@ The general platform status for all our applications is available at [`status.fr ### License -Copyright © 2024 freeCodeCamp.org +Copyright © 2025 freeCodeCamp.org The content of this repository is bound by the following licenses: - The computer software is licensed under the [BSD-3-Clause](LICENSE.md) license. -- The learning resources in the [`/curriculum`](/curriculum) directory including their subdirectories thereon are copyright © 2024 freeCodeCamp.org +- The learning resources in the [`/curriculum`](/curriculum) directory including their subdirectories thereon are copyright © 2025 freeCodeCamp.org diff --git a/api/README.md b/api/README.md index 14919f7207f3cc..b6100ba58c6d85 100644 --- a/api/README.md +++ b/api/README.md @@ -25,6 +25,16 @@ cd ../.. # back to the root of the repo pnpm seed ``` +### Troubleshooting + +If you have any issues connecting to the database (e.g. MongoServerError: not primary), try removing the volume and recreating the containers. + +```bash +cd tools +docker compose down -v +docker compose up -d +``` + ## Login in development/testing During development and testing, the api exposes the endpoint GET auth/dev-callback. Calling this will log you in as the user with the email `foo@bar.com` by setting the session cookie for that user. diff --git a/api/__mocks__/env-exam.ts b/api/__mocks__/env-exam.ts index 2a863283b1f8af..e56d7b0512284c 100644 --- a/api/__mocks__/env-exam.ts +++ b/api/__mocks__/env-exam.ts @@ -45,7 +45,8 @@ export const config: EnvConfig = { numberOfCorrectAnswers: 1, numberOfIncorrectAnswers: 1 } - ] + ], + retakeTimeInMS: 24 * 60 * 60 * 1000 }; export const questionSets: EnvQuestionSet[] = [ @@ -292,8 +293,7 @@ export const examAttempt: EnvExamAttempt = { } ], startTimeInMS: Date.now(), - userId: defaultUserId, - submissionTimeInMS: null + userId: defaultUserId }; export const examAttemptSansSubmissionTimeInMS: Static< diff --git a/api/prisma/schema.prisma b/api/prisma/schema.prisma index 914d557063cfa0..d31ac2e1de045a 100644 --- a/api/prisma/schema.prisma +++ b/api/prisma/schema.prisma @@ -69,6 +69,12 @@ type SavedChallenge { lastSavedDate Float } +type QuizAttempt { + challengeId String + quizId String + timestamp Float +} + /// Corresponds to the `user` collection. model user { id String @id @default(auto()) @map("_id") @db.ObjectId @@ -76,6 +82,7 @@ model user { acceptedPrivacyTerms Boolean completedChallenges CompletedChallenge[] completedExams CompletedExam[] // Undefined + quizAttempts QuizAttempt[] // Undefined currentChallengeId String? donationEmails String[] // Undefined | String[] (only possible for built in Types like String) email String @@ -108,7 +115,7 @@ model user { is2018DataVisCert Boolean? // Undefined is2018FullStackCert Boolean? // Undefined isCollegeAlgebraPyCertV8 Boolean? // Undefined - isUpcomingPythonCertV8 Boolean? // Undefined + // isUpcomingPythonCertV8 Boolean? // Undefined. It is in the db but has never been used. keyboardShortcuts Boolean? // Undefined linkedin String? // Null | Undefined location String? // Null @@ -223,15 +230,17 @@ type EnvAnswer { /// Configuration for an exam in the Exam Environment App type EnvConfig { /// Human-readable exam name - name String + name String /// Notes given about exam - note String + note String /// Category configuration for question selection - tags EnvTagConfig[] + tags EnvTagConfig[] /// Total time allocated for exam in milliseconds - totalTimeInMS Int + totalTimeInMS Int /// Configuration for sets of questions - questionSets EnvQuestionSetConfig[] + questionSets EnvQuestionSetConfig[] + /// Duration after exam completion before a retake is allowed in milliseconds + retakeTimeInMS Int } /// Configuration for a set of questions in the Exam Environment App @@ -267,14 +276,10 @@ model EnvExamAttempt { /// Foreign key to generated exam id generatedExamId String @db.ObjectId - questionSets EnvQuestionSetAttempt[] + questionSets EnvQuestionSetAttempt[] /// Time exam was started as milliseconds since epoch - startTimeInMS Int - /// Time exam was submitted as milliseconds since epoch - /// - /// As attempt might not be submitted (disconnection or quit), field is optional - submissionTimeInMS Int? - needsRetake Boolean + startTimeInMS Int + needsRetake Boolean // Relations user user @relation(fields: [userId], references: [id], onDelete: Cascade) @@ -301,7 +306,6 @@ type EnvMultipleChoiceQuestionAttempt { /// A generated exam for the Exam Environment App /// /// This is the user-facing information for an exam. -/// TODO: Add userId? model EnvGeneratedExam { id String @id @default(auto()) @map("_id") @db.ObjectId /// Foreign key to exam diff --git a/api/src/app.ts b/api/src/app.ts index fec71629751e44..1596468b2ca2d6 100644 --- a/api/src/app.ts +++ b/api/src/app.ts @@ -38,7 +38,8 @@ import { FCC_ENABLE_DEV_LOGIN_MODE, FCC_ENABLE_SWAGGER_UI, FCC_ENABLE_SHADOW_CAPTURE, - FCC_ENABLE_EXAM_ENVIRONMENT + FCC_ENABLE_EXAM_ENVIRONMENT, + FCC_ENABLE_SENTRY_ROUTES } from './utils/env'; import { isObjectID } from './utils/validation'; import { @@ -198,6 +199,10 @@ export const build = async ( void fastify.register(examEnvironmentOpenRoutes); } + if (FCC_ENABLE_SENTRY_ROUTES) { + void fastify.register(publicRoutes.sentryRoutes); + } + void fastify.register(publicRoutes.chargeStripeRoute); void fastify.register(publicRoutes.signoutRoute); void fastify.register(publicRoutes.emailSubscribtionRoutes); diff --git a/api/src/exam-environment/generate/index.ts b/api/src/exam-environment/generate/index.ts index 1f3d10b5122253..401d179fd7ea13 100644 --- a/api/src/exam-environment/generate/index.ts +++ b/api/src/exam-environment/generate/index.ts @@ -24,7 +24,9 @@ const prisma = new PrismaClient({ /// TODO: /// 1. Deprecate all previous generated exams for a given exam id? async function main() { + console.info('Connecting to cluster...'); await prisma.$connect(); + console.info('Connected.'); const exam = await prisma.envExam.findUnique({ where: { @@ -38,6 +40,9 @@ async function main() { let numberOfExamsGenerated = 0; + console.info( + `Exam with _id ${ENV_EXAM_ID} found. Generating ${NUMBER_OF_EXAMS_TO_GENERATE} exams...` + ); while (numberOfExamsGenerated < NUMBER_OF_EXAMS_TO_GENERATE) { try { const generatedExam = generateExam(exam); @@ -45,10 +50,12 @@ async function main() { data: generatedExam }); numberOfExamsGenerated++; + console.info(`Generated ${numberOfExamsGenerated} exams`); } catch (e) { console.log(e); } } + console.log(`Finished generating exams.`); } void main(); diff --git a/api/src/exam-environment/routes/exam-environment.test.ts b/api/src/exam-environment/routes/exam-environment.test.ts index de4a35b1dd949e..c153a04517307d 100644 --- a/api/src/exam-environment/routes/exam-environment.test.ts +++ b/api/src/exam-environment/routes/exam-environment.test.ts @@ -1,4 +1,6 @@ import { Static } from '@fastify/type-provider-typebox'; +import jwt from 'jsonwebtoken'; + import { createSuperRequest, defaultUserId, @@ -11,6 +13,7 @@ import { } from '../schemas'; import * as mock from '../../../__mocks__/env-exam'; import { constructUserExam } from '../utils/exam'; +import { JWT_SECRET } from '../../utils/env'; jest.mock('../../utils/env', () => { // eslint-disable-next-line @typescript-eslint/no-unsafe-return @@ -435,8 +438,6 @@ describe('/exam-environment/', () => { 24 * 60 * 60 * 1000 - mock.exam.config.totalTimeInMS - 1 * 60 * 60 * 1000; - submittedAttempt.submissionTimeInMS = - Date.now() - mock.exam.config.totalTimeInMS - 24 * 60 * 60 * 1000; await fastifyTestInstance.prisma.envExamAttempt.create({ data: submittedAttempt }); @@ -492,7 +493,6 @@ describe('/exam-environment/', () => { generatedExamId: generatedExam!.id, questionSets: [], needsRetake: false, - submissionTimeInMS: null, // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment startTimeInMS: expect.any(Number) }); @@ -579,7 +579,8 @@ describe('/exam-environment/', () => { config: { name: mock.exam.config.name, note: mock.exam.config.note, - totalTimeInMS: mock.exam.config.totalTimeInMS + totalTimeInMS: mock.exam.config.totalTimeInMS, + retakeTimeInMS: mock.exam.config.retakeTimeInMS }, id: mock.examId } @@ -641,7 +642,7 @@ describe('/exam-environment/', () => { }); describe('GET /exam-environment/token-meta', () => { - it('should allow a valid request', async () => { + it('should reject invalid tokens', async () => { const res = await superGet('/exam-environment/token-meta').set( 'exam-environment-authorization-token', 'invalid-token' @@ -654,6 +655,24 @@ describe('/exam-environment/', () => { } }); }); + + it('should tell the requester if the token does not exist', async () => { + const validToken = jwt.sign( + { examEnvironmentAuthorizationToken: 'does-not-exist' }, + JWT_SECRET + ); + const res = await superGet('/exam-environment/token-meta').set( + 'exam-environment-authorization-token', + validToken + ); + + expect(res).toMatchObject({ + status: 418, + body: { + code: 'FCC_EINVAL_EXAM_ENVIRONMENT_AUTHORIZATION_TOKEN' + } + }); + }); }); describe('GET /exam-environment/exams', () => { diff --git a/api/src/exam-environment/routes/exam-environment.ts b/api/src/exam-environment/routes/exam-environment.ts index 3e8d5f288573ca..a9484e9c334192 100644 --- a/api/src/exam-environment/routes/exam-environment.ts +++ b/api/src/exam-environment/routes/exam-environment.ts @@ -8,13 +8,13 @@ import * as schemas from '../schemas'; import { mapErr, syncMapErr, UpdateReqType } from '../../utils'; import { JWT_SECRET } from '../../utils/env'; import { - checkAttemptAgainstGeneratedExam, checkPrerequisites, constructUserExam, userAttemptToDatabaseAttemptQuestionSets, validateAttempt } from '../utils/exam'; import { ERRORS } from '../utils/errors'; +import { isObjectID } from '../../utils/validation'; /** * Wrapper for endpoints related to the exam environment desktop app. @@ -92,8 +92,9 @@ async function tokenMetaHandler( ) { const { 'exam-environment-authorization-token': encodedToken } = req.headers; + let payload: JwtPayload; try { - jwt.verify(encodedToken, JWT_SECRET); + payload = jwt.verify(encodedToken, JWT_SECRET) as JwtPayload; } catch (e) { // Server refuses to brew (verify) coffee (jwts) with a teapot (random strings) void reply.code(418); @@ -102,14 +103,18 @@ async function tokenMetaHandler( ); } - const payload = jwt.decode(encodedToken) as JwtPayload; - - const examEnvironmentAuthorizationToken = - payload.examEnvironmentAuthorizationToken; + if (!isObjectID(payload.examEnvironmentAuthorizationToken)) { + void reply.code(418); + return reply.send( + ERRORS.FCC_EINVAL_EXAM_ENVIRONMENT_AUTHORIZATION_TOKEN( + 'Token is not valid' + ) + ); + } const token = await this.prisma.examEnvironmentAuthorizationToken.findUnique({ where: { - id: examEnvironmentAuthorizationToken + id: payload.examEnvironmentAuthorizationToken } }); @@ -209,16 +214,13 @@ async function postExamGeneratedExamHandler( : null; if (lastAttempt) { - const attemptIsExpired = - lastAttempt.startTimeInMS + exam.config.totalTimeInMS < Date.now(); - if (attemptIsExpired) { - // If exam is not submitted, use exam start time + time allocated for exam - const effectiveSubmissionTime = - lastAttempt.submissionTimeInMS ?? - lastAttempt.startTimeInMS + exam.config.totalTimeInMS; - const twentyFourHoursAgo = Date.now() - 24 * 60 * 60 * 1000; - - if (effectiveSubmissionTime > twentyFourHoursAgo) { + const examExpirationTime = + lastAttempt.startTimeInMS + exam.config.totalTimeInMS; + if (examExpirationTime < Date.now()) { + const retakeAllowed = + examExpirationTime + exam.config.retakeTimeInMS < Date.now(); + + if (!retakeAllowed) { void reply.code(429); // TODO: Consider sending last completed time return reply.send( @@ -429,20 +431,6 @@ async function postExamAttemptHandler( latest.startTimeInMS > current.startTimeInMS ? latest : current ); - // TODO: Currently, submission time is set when all questions have been answered. - // This might not necessarily be fully submitted. So, provided there is time - // left on the clock, the attempt should still be updated, even if the submission - // time is set. - // The submission time just needs to be updated. - // if (latestAttempt.submissionTimeInMS !== null) { - // void reply.code(403); - // return reply.send( - // ERRORS.FCC_EINVAL_EXAM_ENVIRONMENT_EXAM_ATTEMPT( - // 'Attempt has already been submitted.' - // ) - // ); - // } - const maybeExam = await mapErr( this.prisma.envExam.findUnique({ where: { @@ -515,12 +503,6 @@ async function postExamAttemptHandler( validateAttempt(generatedExam, databaseAttemptQuestionSets) ); - // If all questions have been answered, add submission time - const allQuestionsAnswered = checkAttemptAgainstGeneratedExam( - databaseAttemptQuestionSets, - generatedExam - ); - // Update attempt in database const maybeUpdatedAttempt = await mapErr( this.prisma.envExamAttempt.update({ @@ -528,8 +510,6 @@ async function postExamAttemptHandler( id: latestAttempt.id }, data: { - // NOTE: submission time is set to null, because it just depends on whether all questions have been answered. - submissionTimeInMS: allQuestionsAnswered ? Date.now() : null, questionSets: databaseAttemptQuestionSets, // If attempt is not valid, immediately flag attempt as needing retake // TODO: If `needsRetake`, prevent further submissions? @@ -592,7 +572,8 @@ async function getExams( config: { name: exam.config.name, note: exam.config.note, - totalTimeInMS: exam.config.totalTimeInMS + totalTimeInMS: exam.config.totalTimeInMS, + retakeTimeInMS: exam.config.retakeTimeInMS }, canTake: isExamPrerequisitesMet }; diff --git a/api/src/exam-environment/schemas/exams.ts b/api/src/exam-environment/schemas/exams.ts index 355ff2443e1295..748067b9e55816 100644 --- a/api/src/exam-environment/schemas/exams.ts +++ b/api/src/exam-environment/schemas/exams.ts @@ -5,21 +5,20 @@ export const examEnvironmentExams = { 'exam-environment-authorization-token': Type.String() }), response: { - 200: Type.Union([ - Type.Object({ - exams: Type.Array( - Type.Object({ - id: Type.String(), - config: Type.Object({ - name: Type.String(), - note: Type.String(), - totalTimeInMS: Type.Number() - }), - canTake: Type.Boolean() - }) - ) - }), - STANDARD_ERROR - ]) + 200: Type.Object({ + exams: Type.Array( + Type.Object({ + id: Type.String(), + config: Type.Object({ + name: Type.String(), + note: Type.String(), + totalTimeInMS: Type.Number(), + retakeTimeInMS: Type.Number() + }), + canTake: Type.Boolean() + }) + ) + }), + 500: STANDARD_ERROR } }; diff --git a/api/src/exam-environment/utils/exam.ts b/api/src/exam-environment/utils/exam.ts index 3d207cddb24cf1..18e4188e5b9012 100644 --- a/api/src/exam-environment/utils/exam.ts +++ b/api/src/exam-environment/utils/exam.ts @@ -101,7 +101,8 @@ export function constructUserExam( const config = { totalTimeInMS: exam.config.totalTimeInMS, name: exam.config.name, - note: exam.config.note + note: exam.config.note, + retakeTimeInMS: exam.config.retakeTimeInMS }; const userExam: UserExam = { diff --git a/api/src/plugins/__fixtures__/user.ts b/api/src/plugins/__fixtures__/user.ts index bbe7e8efcf1b0c..d41de813934388 100644 --- a/api/src/plugins/__fixtures__/user.ts +++ b/api/src/plugins/__fixtures__/user.ts @@ -12,6 +12,7 @@ export const newUser = (email: string) => ({ acceptedPrivacyTerms: false, completedChallenges: [], completedExams: [], + quizAttempts: [], currentChallengeId: '', donationEmails: [], email, @@ -48,7 +49,6 @@ export const newUser = (email: string) => ({ isCollegeAlgebraPyCertV8: false, isRespWebDesignCert: false, isSciCompPyCertV7: false, - isUpcomingPythonCertV8: null, keyboardShortcuts: false, linkedin: null, location: '', diff --git a/api/src/plugins/error-handling.ts b/api/src/plugins/error-handling.ts index c9f9a1ca3bb9c2..05fefba76528fa 100644 --- a/api/src/plugins/error-handling.ts +++ b/api/src/plugins/error-handling.ts @@ -2,7 +2,7 @@ import type { FastifyPluginCallback } from 'fastify'; import fastifySentry from '@immobiliarelabs/fastify-sentry'; import fp from 'fastify-plugin'; -import { SENTRY_DSN } from '../utils/env'; +import { SENTRY_DSN, SENTRY_ENVIRONMENT } from '../utils/env'; import { getRedirectParams } from '../utils/redirection'; /** @@ -15,6 +15,7 @@ import { getRedirectParams } from '../utils/redirection'; const errorHandling: FastifyPluginCallback = (fastify, _options, done) => { void fastify.register(fastifySentry, { dsn: SENTRY_DSN, + environment: SENTRY_ENVIRONMENT, maxValueLength: 8192, // the default is 250, which is too small. // No need to initialize if DSN is not provided (e.g. in development and // test environments) diff --git a/api/src/routes/protected/certificate.test.ts b/api/src/routes/protected/certificate.test.ts index 4466346372ef3a..83c96258d4364f 100644 --- a/api/src/routes/protected/certificate.test.ts +++ b/api/src/routes/protected/certificate.test.ts @@ -6,7 +6,6 @@ import { setupServer, superRequest } from '../../../jest.utils'; -import { SHOW_UPCOMING_CHANGES } from '../../utils/env'; describe('certificate routes', () => { setupServer(); @@ -396,12 +395,6 @@ describe('certificate routes', () => { ]; const unclaimableCerts = ['fake-slug']; - if (SHOW_UPCOMING_CHANGES) { - claimableCerts.push(Certification.UpcomingPython); - } else { - unclaimableCerts.push(Certification.UpcomingPython); - } - for (const certSlug of claimableCerts) { const response = await superRequest('/certificate/verify', { method: 'PUT', diff --git a/api/src/routes/protected/certificate.ts b/api/src/routes/protected/certificate.ts index 144dd2464d52cf..f6e6173d3e3d78 100644 --- a/api/src/routes/protected/certificate.ts +++ b/api/src/routes/protected/certificate.ts @@ -39,8 +39,7 @@ const { machineLearningPyV7Id, relationalDatabaseV8Id, collegeAlgebraPyV8Id, - foundationalCSharpV8Id, - upcomingPythonV8Id + foundationalCSharpV8Id } = certIds; function isCertAllowed(certSlug: string): boolean { @@ -68,7 +67,7 @@ function renderCertifiedEmail({ Congratulations on completing all of the freeCodeCamp certifications! -All of your certifications are now live at at: https://www.freecodecamp.org/${username} +All of your certifications are now live at: https://www.freecodecamp.org/${username} Please tell me a bit more about you and your near-term goals. @@ -157,10 +156,9 @@ function createCertTypeIds(challenges: ReturnType) { [certTypes.foundationalCSharpV8]: getCertById( foundationalCSharpV8Id, challenges - ), + ) // upcoming - [certTypes.upcomingPythonV8]: getCertById(upcomingPythonV8Id, challenges) }; } @@ -184,7 +182,6 @@ interface CertI { isRelationalDatabaseCertV8?: boolean; isCollegeAlgebraPyCertV8?: boolean; isFoundationalCSharpCertV8?: boolean; - isUpcomingPythonCertV8?: boolean; } function getUserIsCertMap(user: CertI) { @@ -207,8 +204,7 @@ function getUserIsCertMap(user: CertI) { isMachineLearningPyCertV7 = false, isRelationalDatabaseCertV8 = false, isCollegeAlgebraPyCertV8 = false, - isFoundationalCSharpCertV8 = false, - isUpcomingPythonCertV8 = false + isFoundationalCSharpCertV8 = false } = user; return { @@ -230,8 +226,7 @@ function getUserIsCertMap(user: CertI) { isMachineLearningPyCertV7, isRelationalDatabaseCertV8, isCollegeAlgebraPyCertV8, - isFoundationalCSharpCertV8, - isUpcomingPythonCertV8 + isFoundationalCSharpCertV8 }; } @@ -390,8 +385,7 @@ export const protectedCertificateRoutes: FastifyPluginCallbackTypebox = ( isQaCertV7: true, isRelationalDatabaseCertV8: true, isRespWebDesignCert: true, - isSciCompPyCertV7: true, - isUpcomingPythonCertV8: true + isSciCompPyCertV7: true } }); diff --git a/api/src/routes/protected/challenge.test.ts b/api/src/routes/protected/challenge.test.ts index c9f464a0212f91..d76c22c48ee6dd 100644 --- a/api/src/routes/protected/challenge.test.ts +++ b/api/src/routes/protected/challenge.test.ts @@ -35,6 +35,9 @@ import { import { Answer } from '../../utils/exam-types'; import type { getSessionUser } from '../../schemas/user/get-session-user'; +const EXISTING_COMPLETED_DATE = new Date('2024-11-08').getTime(); +const DATE_NOW = Date.now(); + jest.mock('../helpers/challenge-helpers', () => { const originalModule = jest.requireActual< typeof import('../helpers/challenge-helpers') @@ -909,9 +912,9 @@ describe('challengeRoutes', () => { }); }); - describe('/save-challenge', () => { + describe('POST /save-challenge', () => { describe('validation', () => { - test('POST returns 403 status for unsavable challenges', async () => { + test('returns 400 status for unsavable challenges', async () => { const response = await superPost('/save-challenge').send({ savedChallenges: { // valid mongo id, but not a saveable one @@ -938,7 +941,23 @@ describe('challengeRoutes', () => { }); }); - test('POST update the user savedchallenges and return them', async () => { + test('rejects requests for challenges that cannot be saved', async () => { + const response = await superPost('/save-challenge').send({ + id: '66ebd4ae2812430bb883c786', + files: multiFileCertProjectBody.files + }); + + const { savedChallenges } = + await fastifyTestInstance.prisma.user.findFirstOrThrow({ + where: { email: 'foo@bar.com' } + }); + + expect(response.statusCode).toBe(400); + expect(response.text).toEqual('That challenge type is not saveable.'); + expect(savedChallenges).toHaveLength(0); + }); + + test('update the user savedchallenges and return them', async () => { const response = await superPost('/save-challenge').send({ id: multiFileCertProjectId, files: updatedMultiFileCertProjectBody.files @@ -1676,6 +1695,143 @@ describe('challengeRoutes', () => { }); }); }); + + describe('/submit-quiz-attempt', () => { + describe('validation', () => { + test('POST rejects requests without challengeId', async () => { + const response = await superPost('/submit-quiz-attempt').send({ + quizId: 'id' + }); + + expect(response.body).toStrictEqual({ + type: 'error', + message: + 'That does not appear to be a valid quiz attempt submission.' + }); + expect(response.statusCode).toBe(400); + }); + + test('POST rejects requests without quizId', async () => { + const response = await superPost('/submit-quiz-attempt').send({ + challengeId: '66df3b712c41c499e9d31e5b' + }); + + expect(response.body).toStrictEqual({ + type: 'error', + message: + 'That does not appear to be a valid quiz attempt submission.' + }); + expect(response.statusCode).toBe(400); + }); + + test('POST rejects requests without valid ObjectID', async () => { + const response = await superPost('/submit-quiz-attempt').send({ + challengeId: 'not-a-valid-id' + }); + + expect(response.body).toStrictEqual({ + type: 'error', + message: + 'That does not appear to be a valid quiz attempt submission.' + }); + expect(response.statusCode).toBe(400); + }); + }); + + describe('handling', () => { + beforeAll(() => { + jest.useFakeTimers({ + doNotFake: ['nextTick'] + }); + jest.setSystemTime(DATE_NOW); + }); + + afterAll(() => { + jest.useRealTimers(); + }); + + afterEach(async () => { + await fastifyTestInstance.prisma.user.updateMany({ + where: { email: 'foo@bar.com' }, + data: { + completedChallenges: [], + quizAttempts: [] + } + }); + }); + + test('POST adds new attempt to quizAttempts', async () => { + const response = await superPost('/submit-quiz-attempt').send({ + challengeId: '66df3b712c41c499e9d31e5b', + quizId: '0' + }); + + const user = await fastifyTestInstance.prisma.user.findFirstOrThrow({ + where: { email: 'foo@bar.com' } + }); + + expect(user).toMatchObject({ + quizAttempts: [ + { + challengeId: '66df3b712c41c499e9d31e5b', + quizId: '0', + timestamp: DATE_NOW + } + ] + }); + + expect(response.statusCode).toBe(200); + expect(response.body).toStrictEqual({}); + }); + + test('POST updates the timestamp of the existing attempt', async () => { + await fastifyTestInstance.prisma.user.updateMany({ + where: { id: defaultUserId }, + data: { + quizAttempts: [ + { + challengeId: '66df3b712c41c499e9d31e5b', // quiz-basic-html + quizId: '0', + timestamp: EXISTING_COMPLETED_DATE + }, + { + challengeId: '66ed903cf45ce3ece4053ebe', // quiz-semantic-html + quizId: '1', + timestamp: EXISTING_COMPLETED_DATE + } + ] + } + }); + + const response = await superPost('/submit-quiz-attempt').send({ + challengeId: '66df3b712c41c499e9d31e5b', + quizId: '1' + }); + + const user = await fastifyTestInstance.prisma.user.findFirstOrThrow({ + where: { email: 'foo@bar.com' } + }); + + expect(user).toMatchObject({ + quizAttempts: [ + { + challengeId: '66df3b712c41c499e9d31e5b', + quizId: '1', + timestamp: DATE_NOW + }, + { + challengeId: '66ed903cf45ce3ece4053ebe', + quizId: '1', + timestamp: EXISTING_COMPLETED_DATE + } + ] + }); + + expect(response.statusCode).toBe(200); + expect(response.body).toStrictEqual({}); + }); + }); + }); }); describe('Unauthenticated user', () => { diff --git a/api/src/routes/protected/challenge.ts b/api/src/routes/protected/challenge.ts index 99848b7385cfa6..85cfd1758f401e 100644 --- a/api/src/routes/protected/challenge.ts +++ b/api/src/routes/protected/challenge.ts @@ -1,6 +1,6 @@ import { type FastifyPluginCallbackTypebox } from '@fastify/type-provider-typebox'; import jwt from 'jsonwebtoken'; -import { uniqBy } from 'lodash'; +import { uniqBy, matches } from 'lodash'; import { CompletedExam, ExamResults } from '@prisma/client'; import isURL from 'validator/lib/isURL'; @@ -391,7 +391,9 @@ export const challengeRoutes: FastifyPluginCallbackTypebox = ( !multifileCertProjectIds.includes(challengeId) && !multifilePythonCertProjectIds.includes(challengeId) ) { - void reply.code(403).send('That challenge type is not saveable.'); + return void reply + .code(400) + .send('That challenge type is not saveable.'); } const userSavedChallenges = saveUserChallengeData( @@ -776,5 +778,56 @@ export const challengeRoutes: FastifyPluginCallbackTypebox = ( } ); + fastify.post( + '/submit-quiz-attempt', + { + schema: schemas.submitQuizAttempt, + errorHandler(error, request, reply) { + if (error.validation) { + void reply.code(400); + void reply.send({ + type: 'error', + message: + 'That does not appear to be a valid quiz attempt submission.' + }); + } else { + fastify.errorHandler(error, request, reply); + } + } + }, + async req => { + const { challengeId, quizId } = req.body; + + const user = await fastify.prisma.user.findUniqueOrThrow({ + where: { id: req.user?.id }, + select: { + id: true, + quizAttempts: true + } + }); + + const existingAttempt = user.quizAttempts.find(matches({ challengeId })); + + const newAttempt = { + challengeId, + quizId, + timestamp: Date.now() + }; + + await fastify.prisma.user.update({ + where: { id: user.id }, + data: { + quizAttempts: existingAttempt + ? { + updateMany: { where: { challengeId }, data: newAttempt } + } + : { push: newAttempt } + } + }); + + return {}; + } + ); + done(); }; diff --git a/api/src/routes/protected/user.test.ts b/api/src/routes/protected/user.test.ts index 8299ae7a02dda1..e8f068ae65d74f 100644 --- a/api/src/routes/protected/user.test.ts +++ b/api/src/routes/protected/user.test.ts @@ -78,6 +78,13 @@ const testUserData: Prisma.userCreateInput = { ], partiallyCompletedChallenges: [{ id: '123', completedDate: 123 }], completedExams: [], + quizAttempts: [ + { + challengeId: '66df3b712c41c499e9d31e5b', + quizId: '0', + timestamp: 1731924665902 + } + ], githubProfile: 'github.com/foobar', website: 'https://www.freecodecamp.org', donationEmails: ['an@add.ress'], @@ -211,6 +218,7 @@ const publicUserData = { ], completedExams: testUserData.completedExams, completedSurveys: [], // TODO: add surveys + quizAttempts: testUserData.quizAttempts, githubProfile: testUserData.githubProfile, is2018DataVisCert: testUserData.is2018DataVisCert, is2018FullStackCert: testUserData.is2018FullStackCert, // TODO: should this be returned? The client doesn't use it at the moment. @@ -717,6 +725,7 @@ describe('userRoutes', () => { partiallyCompletedChallenges: [], portfolio: [], savedChallenges: [], + quizAttempts: [], yearsTopContributor: [], is2018DataVisCert: false, is2018FullStackCert: false, diff --git a/api/src/routes/protected/user.ts b/api/src/routes/protected/user.ts index a54de1a25e777d..adb063d97eb721 100644 --- a/api/src/routes/protected/user.ts +++ b/api/src/routes/protected/user.ts @@ -449,6 +449,7 @@ export const userGetRoutes: FastifyPluginCallbackTypebox = ( completedChallenges: true, completedExams: true, currentChallengeId: true, + quizAttempts: true, email: true, emailVerified: true, githubProfile: true, diff --git a/api/src/routes/public/certificate.test.ts b/api/src/routes/public/certificate.test.ts index 568c6155e96fa4..e4f2163d0751d2 100644 --- a/api/src/routes/public/certificate.test.ts +++ b/api/src/routes/public/certificate.test.ts @@ -7,11 +7,24 @@ import { } from '../../../jest.utils'; import { getFallbackFullStackDate } from '../helpers/certificate-utils'; +const DATE_NOW = Date.now(); + describe('certificate routes', () => { setupServer(); describe('Unauthenticated user', () => { - beforeAll(async () => resetDefaultUser()); + beforeAll(async () => { + await resetDefaultUser(); + + jest.useFakeTimers({ + doNotFake: ['nextTick'] + }); + jest.setSystemTime(DATE_NOW); + }); + + afterAll(() => { + jest.useRealTimers(); + }); describe('GET /certificate/showCert/:username/:certSlug', () => { beforeEach(async () => { @@ -204,6 +217,70 @@ describe('certificate routes', () => { expect(response.status).toBe(200); }); + test('should not return user full name if `showName` is `false`', async () => { + await fastifyTestInstance.prisma.user.update({ + where: { id: defaultUserId }, + data: { + profileUI: { + showTimeLine: true, + showCerts: true, + isLocked: false, + showName: false + }, + isJsAlgoDataStructCert: true, + completedChallenges: [ + { + id: '561abd10cb81ac38a17513bc', // Cert ID + completedDate: DATE_NOW + } + ] + } + }); + + const response = await superRequest( + '/certificate/showCert/foobar/javascript-algorithms-and-data-structures', + { + method: 'GET' + } + ); + + // TODO: delete this assertion once there's only one status 200 response + expect(response.body).toHaveProperty('username', 'foobar'); + expect(response.body).not.toHaveProperty('name'); + expect(response.status).toBe(200); + }); + + test('should return user full name if `showName` is `true`', async () => { + await fastifyTestInstance.prisma.user.update({ + where: { id: defaultUserId }, + data: { + profileUI: { + showTimeLine: true, + showCerts: true, + isLocked: false, + showName: true + }, + isJsAlgoDataStructCert: true, + completedChallenges: [ + { + id: '561abd10cb81ac38a17513bc', // Cert ID + completedDate: DATE_NOW + } + ] + } + }); + + const response = await superRequest( + '/certificate/showCert/foobar/javascript-algorithms-and-data-structures', + { + method: 'GET' + } + ); + + expect(response.body).toHaveProperty('name', 'foobar'); + expect(response.status).toBe(200); + }); + test('should return cert-not-found if there is no cert with that slug', async () => { const response = await superRequest( '/certificate/showCert/foobar/not-a-valid-cert-slug', diff --git a/api/src/routes/public/certificate.ts b/api/src/routes/public/certificate.ts index df245479ed9fed..c60a057a9e17ff 100644 --- a/api/src/routes/public/certificate.ts +++ b/api/src/routes/public/certificate.ts @@ -78,7 +78,6 @@ export const unprotectedCertificateRoutes: FastifyPluginCallbackTypebox = ( isRelationalDatabaseCertV8: true, isCollegeAlgebraPyCertV8: true, isFoundationalCSharpCertV8: true, - isUpcomingPythonCertV8: true, isHonest: true, username: true, name: true, diff --git a/api/src/routes/public/index.ts b/api/src/routes/public/index.ts index 95ad20bb34338d..7bbb12f5fd19f9 100644 --- a/api/src/routes/public/index.ts +++ b/api/src/routes/public/index.ts @@ -8,3 +8,4 @@ export * from './email-subscription'; export * from './signout'; export * from './status'; export * from './user'; +export * from './sentry'; diff --git a/api/src/routes/public/sentry.ts b/api/src/routes/public/sentry.ts new file mode 100644 index 00000000000000..60e7070545094a --- /dev/null +++ b/api/src/routes/public/sentry.ts @@ -0,0 +1,41 @@ +/* eslint-disable jsdoc/require-returns, jsdoc/require-param */ +import { type FastifyPluginCallbackTypebox } from '@fastify/type-provider-typebox'; +import { type FastifyInstance, type FastifyReply } from 'fastify'; + +import { UpdateReqType } from '../../utils'; +import * as schemas from '../../schemas'; + +/** + * Plugin for Sentry-related endpoints. + * + * @param fastify The Fastify instance. + * @param _options Options passed to the plugin via `fastify.register(plugin, + * options)`. + * @param done The callback to signal that the plugin is ready. + */ +export const sentryRoutes: FastifyPluginCallbackTypebox = ( + fastify, + _options, + done +) => { + fastify.post( + '/sentry/event', + { + schema: schemas.sentryPostEvent + }, + postSentryEventHandler + ); + + done(); +}; + +/** + * Creates a new event in Sentry. + */ +function postSentryEventHandler( + this: FastifyInstance, + req: UpdateReqType, + _reply: FastifyReply +) { + throw new Error(`Sentry Test: ${req.body.text}`); +} diff --git a/api/src/schemas.ts b/api/src/schemas.ts index d359ed7d3f33c7..8afb7f295ed752 100644 --- a/api/src/schemas.ts +++ b/api/src/schemas.ts @@ -10,6 +10,7 @@ export { modernChallengeCompleted } from './schemas/challenge/modern-challenge-c export { msTrophyChallengeCompleted } from './schemas/challenge/ms-trophy-challenge-completed'; export { projectCompleted } from './schemas/challenge/project-completed'; export { saveChallenge } from './schemas/challenge/save-challenge'; +export { submitQuizAttempt } from './schemas/challenge/submit-quiz-attempt'; export { deprecatedEndpoints } from './schemas/deprecated'; export { addDonation } from './schemas/donate/add-donation'; export { chargeStripeCard } from './schemas/donate/charge-stripe-card'; @@ -40,3 +41,4 @@ export { reportUser } from './schemas/user/report-user'; export { resetMyProgress } from './schemas/user/reset-my-progress'; export { submitSurvey } from './schemas/user/submit-survey'; export { userExamEnvironmentToken } from './schemas/user/exam-environment-token'; +export { sentryPostEvent } from './schemas/sentry/event'; diff --git a/api/src/schemas/certificate/cert-slug.ts b/api/src/schemas/certificate/cert-slug.ts index 402fb2fac408f0..9880b6f5232527 100644 --- a/api/src/schemas/certificate/cert-slug.ts +++ b/api/src/schemas/certificate/cert-slug.ts @@ -85,14 +85,7 @@ export const certSlug = { certSlug: Type.Enum(Certification), certTitle: Type.String(), username: Type.String(), - date: Type.Number(), - completionTime: Type.Number() - }), - Type.Object({ - certSlug: Type.Enum(Certification), - certTitle: Type.String(), - username: Type.String(), - name: Type.String(), + name: Type.Optional(Type.String()), date: Type.Number(), completionTime: Type.Number() }), diff --git a/api/src/schemas/challenge/submit-quiz-attempt.ts b/api/src/schemas/challenge/submit-quiz-attempt.ts new file mode 100644 index 00000000000000..07ed7e1bf49278 --- /dev/null +++ b/api/src/schemas/challenge/submit-quiz-attempt.ts @@ -0,0 +1,23 @@ +import { Type } from '@fastify/type-provider-typebox'; +import { genericError } from '../types'; + +export const submitQuizAttempt = { + body: Type.Object({ + challengeId: Type.String({ + format: 'objectid', + maxLength: 24, + minLength: 24 + }), + quizId: Type.String() + }), + response: { + 200: Type.Object({}), + 400: Type.Object({ + type: Type.Literal('error'), + message: Type.Literal( + 'That does not appear to be a valid quiz attempt submission.' + ) + }), + default: genericError + } +}; diff --git a/api/src/schemas/sentry/event.ts b/api/src/schemas/sentry/event.ts new file mode 100644 index 00000000000000..fc5150ccd25604 --- /dev/null +++ b/api/src/schemas/sentry/event.ts @@ -0,0 +1,13 @@ +import { Type } from '@fastify/type-provider-typebox'; + +export const sentryPostEvent = { + body: Type.Object({ + text: Type.String() + }), + response: { + 500: Type.Object({ + message: Type.Literal('flash.generic-error'), + type: Type.Literal('danger') + }) + } +}; diff --git a/api/src/schemas/user/get-session-user.ts b/api/src/schemas/user/get-session-user.ts index a1abab67ea3a12..fcab27ca7cfca7 100644 --- a/api/src/schemas/user/get-session-user.ts +++ b/api/src/schemas/user/get-session-user.ts @@ -41,6 +41,17 @@ export const getSessionUser = { examResults }) ), + quizAttempts: Type.Array( + Type.Object({ + challengeId: Type.String({ + format: 'objectid', + maxLength: 24, + minLength: 24 + }), + quizId: Type.String(), + timestamp: Type.Number() + }) + ), completedChallengeCount: Type.Number(), currentChallengeId: Type.String(), email: Type.String(), diff --git a/api/src/server.ts b/api/src/server.ts index a999115bd53bbe..c846c60e197c01 100644 --- a/api/src/server.ts +++ b/api/src/server.ts @@ -4,7 +4,12 @@ // eslint-disable-next-line @typescript-eslint/triple-slash-reference /// import { build } from './app'; -import { FREECODECAMP_NODE_ENV, HOST, PORT } from './utils/env'; +import { + FREECODECAMP_NODE_ENV, + FCC_API_LOG_LEVEL, + HOST, + PORT +} from './utils/env'; const envToLogger = { development: { @@ -15,10 +20,11 @@ const envToLogger = { ignore: 'pid,hostname' } }, - level: 'debug' + level: FCC_API_LOG_LEVEL || 'info' + }, + production: { + level: FCC_API_LOG_LEVEL || 'info' }, - // TODO: is this the right level for production or should we use 'error'? - production: { level: 'fatal' }, test: undefined }; diff --git a/api/src/utils/env.ts b/api/src/utils/env.ts index ea5ea69e379775..99ed813f053317 100644 --- a/api/src/utils/env.ts +++ b/api/src/utils/env.ts @@ -1,6 +1,7 @@ import assert from 'node:assert'; import path from 'node:path'; import { config } from 'dotenv'; +import { LogLevel } from 'fastify'; const envPath = path.resolve(__dirname, '../../../.env'); const { error } = config({ path: envPath }); @@ -57,12 +58,26 @@ assert.ok(process.env.SHOW_UPCOMING_CHANGES); assert.ok(process.env.MONGOHQ_URL); assert.ok(process.env.COOKIE_SECRET); +const LOG_LEVELS: LogLevel[] = [ + 'fatal', + 'error', + 'warn', + 'info', + 'debug', + 'trace', + 'silent' +] as const; + +function assertLogLevel(level: unknown): level is LogLevel { + return typeof level === 'string' && LOG_LEVELS.includes(level); +} + +assert.ok( + assertLogLevel(process.env.FCC_API_LOG_LEVEL), + `FCC_API_LOG_LEVEL must be one of ${LOG_LEVELS.join(',')}. Found ${process.env.FCC_API_LOG_LEVEL}` +); + if (process.env.FREECODECAMP_NODE_ENV !== 'development') { - assert.notEqual( - process.env.FCC_ENABLE_EXAM_ENVIRONMENT, - 'true', - 'Exam environment is not ready for production.' - ); assert.ok(process.env.SES_ID); assert.ok(process.env.SES_SECRET); assert.notEqual( @@ -76,6 +91,7 @@ if (process.env.FREECODECAMP_NODE_ENV !== 'development') { assert.ok(process.env.PORT); assert.ok(process.env.HOST); assert.ok(process.env.SENTRY_DSN); + assert.ok(process.env.SENTRY_ENVIRONMENT); // The following values can exist in development, but production-like // environments need to override the defaults. assert.notEqual( @@ -83,6 +99,11 @@ if (process.env.FREECODECAMP_NODE_ENV !== 'development') { 'dsn_from_sentry_dashboard', `The DSN from Sentry's dashboard should be used.` ); + assert.notEqual( + process.env.SENTRY_ENVIRONMENT, + 'development', + `The Sentry environment should be changed from the default.` + ); assert.notEqual( process.env.JWT_SECRET, 'a_jwt_secret', @@ -134,10 +155,17 @@ export const FCC_ENABLE_SHADOW_CAPTURE = process.env.FCC_ENABLE_SHADOW_CAPTURE === 'true'; export const FCC_ENABLE_EXAM_ENVIRONMENT = process.env.FCC_ENABLE_EXAM_ENVIRONMENT === 'true'; +export const FCC_ENABLE_SENTRY_ROUTES = + process.env.FCC_ENABLE_SENTRY_ROUTES === 'true'; +export const FCC_API_LOG_LEVEL = process.env.FCC_API_LOG_LEVEL; export const SENTRY_DSN = process.env.SENTRY_DSN === 'dsn_from_sentry_dashboard' ? '' : process.env.SENTRY_DSN; +export const SENTRY_ENVIRONMENT = + process.env.SENTRY_ENVIRONMENT === 'development' + ? '' + : process.env.SENTRY_ENVIRONMENT; export const COOKIE_DOMAIN = process.env.COOKIE_DOMAIN; export const COOKIE_SECRET = process.env.COOKIE_SECRET; export const JWT_SECRET = process.env.JWT_SECRET; diff --git a/api/tools/docker-compose.yml b/api/tools/docker-compose.yml index 750bdbe8bdbdea..72bf0a4e991f2f 100644 --- a/api/tools/docker-compose.yml +++ b/api/tools/docker-compose.yml @@ -1,4 +1,3 @@ -version: '3.8' services: db: image: mongo diff --git a/client/.babelrc.js b/client/.babelrc.js index 9106dc1e1edfea..5cb4efdcef78f4 100644 --- a/client/.babelrc.js +++ b/client/.babelrc.js @@ -42,6 +42,8 @@ const config = { 'css', 'html', 'javascript', + 'json', + 'jsx', 'markup', 'mathml', 'pug', diff --git a/client/config/cert-and-project-map.test.ts b/client/config/cert-and-project-map.test.ts deleted file mode 100644 index 3ab2883918d63f..00000000000000 --- a/client/config/cert-and-project-map.test.ts +++ /dev/null @@ -1,34 +0,0 @@ -import { uniq } from 'lodash'; -import { - currentCertifications, - upcomingCertifications, - legacyCertifications -} from '../../shared/config/certification-settings'; -import { - currentCertTitles, - upcomingCertTitles, - legacyCertTitles -} from './cert-and-project-map'; - -describe('cert-and-project-map', () => { - describe('currentCertTitles', () => { - it('should correspond to the currentCertifications config', () => { - expect(currentCertTitles).toHaveLength(uniq(currentCertTitles).length); - expect(currentCertTitles).toHaveLength(currentCertifications.length); - }); - }); - - describe('upcomingCertTitles', () => { - it('should correspond to the upcomingCertifications config', () => { - expect(upcomingCertTitles).toHaveLength(uniq(upcomingCertTitles).length); - expect(upcomingCertTitles).toHaveLength(upcomingCertifications.length); - }); - }); - - describe('legacyCertTitles', () => { - it('should correspond to the legacyCertifications config', () => { - expect(legacyCertTitles).toHaveLength(uniq(legacyCertTitles).length); - expect(legacyCertTitles).toHaveLength(legacyCertifications.length); - }); - }); -}); diff --git a/client/config/cert-and-project-map.ts b/client/config/cert-and-project-map.ts index f0e573d3e9561f..050796f2cd6990 100644 --- a/client/config/cert-and-project-map.ts +++ b/client/config/cert-and-project-map.ts @@ -32,7 +32,6 @@ const collegeAlgebraPyBase = '/learn/college-algebra-with-python'; const takeHomeBase = '/learn/coding-interview-prep/take-home-projects'; const foundationalCSharpBase = '/learn/foundational-c-sharp-with-microsoft/foundational-c-sharp-with-microsoft-certification-exam'; -const upcomingPythonBase = '/learn/upcoming-python'; const fullStackDeveloperBase = '/learn/full-stack-developer'; const a2EnglishBase = '/learn/a2-english-for-developers'; const b1EnglishBase = '/learn/b1-english-for-developers'; @@ -99,7 +98,7 @@ const allStandardCerts = [ }, { id: '658180220947283cdc0689ce', - title: 'JavaScript Algorithms and Data Structures (Beta)', + title: 'JavaScript Algorithms and Data Structures', certSlug: Certification.JsAlgoDataStructNew, projects: [ { @@ -811,19 +810,6 @@ const allStandardCerts = [ } ] }, - { - id: '64afc4e8f3b37856e035b85f', - title: 'Upcoming Python Certification', - certSlug: Certification.UpcomingPython, - projects: [ - { - id: '64afc37bf3b37856e035b85e', - title: 'Upcoming Python Project', - link: `${upcomingPythonBase}/upcoming-python-project`, - certSlug: Certification.UpcomingPython - } - ] - }, { id: '651dd7e01d697d0aab7833b7', title: 'A2 English for Developers', @@ -895,29 +881,19 @@ const liveCerts = showUpcomingChanges : [...currentCerts, ...legacyCerts, fullstackCert]; type CertsToProjects = Record< - (typeof allStandardCerts)[number]['title'], + (typeof allStandardCerts)[number]['certSlug'], (typeof allStandardCerts)[number]['projects'] >; const certsToProjects = allStandardCerts.reduce((acc, curr) => { return { ...acc, - [curr.title]: curr.projects + [curr.certSlug]: curr.projects }; }, {} as CertsToProjects); -const currentCertTitles = currentCerts.map(({ title }) => title); -const legacyCertTitles = legacyCerts.map(({ title }) => title); -const upcomingCertTitles = upcomingCerts.map(({ title }) => title); - export type CertTitle = | (typeof liveCerts)[number]['title'] | 'Legacy Full Stack'; -export { - currentCertTitles, - legacyCertTitles, - upcomingCertTitles, - liveCerts, - certsToProjects -}; +export { liveCerts, certsToProjects }; diff --git a/client/config/growthbook-features-default.json b/client/config/growthbook-features-default.json index 7a16d1bd9ef4cc..a0d853939f3a9e 100644 --- a/client/config/growthbook-features-default.json +++ b/client/config/growthbook-features-default.json @@ -94,5 +94,8 @@ "name": "prod-show-benefits" } ] + }, + "fcc-10": { + "defaultValue": true } -} \ No newline at end of file +} diff --git a/client/gatsby-node.js b/client/gatsby-node.js index 3e405884b0924a..b68ccccd970079 100644 --- a/client/gatsby-node.js +++ b/client/gatsby-node.js @@ -4,8 +4,8 @@ const { createFilePath } = require('gatsby-source-filesystem'); const uniq = require('lodash/uniq'); const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); const webpack = require('webpack'); -const env = require('./config/env.json'); +const env = require('./config/env.json'); const { createChallengePages, createBlockIntroPages, @@ -86,6 +86,7 @@ exports.createPages = async function createPages({ blockHashSlug } id + isLastChallengeInBlock order required { link @@ -134,8 +135,39 @@ exports.createPages = async function createPages({ } `); + const allChallengeNodes = result.data.allChallengeNode.edges.map( + ({ node }) => node + ); + + const createIdToNextPathMap = nodes => + nodes.reduce((map, node, index) => { + const nextNode = nodes[index + 1]; + const nextPath = nextNode ? nextNode.challenge.fields.slug : null; + if (nextPath) map[node.id] = nextPath; + return map; + }, {}); + + const createIdToPrevPathMap = nodes => + nodes.reduce((map, node, index) => { + const prevNode = nodes[index - 1]; + const prevPath = prevNode ? prevNode.challenge.fields.slug : null; + if (prevPath) map[node.id] = prevPath; + return map; + }, {}); + + const idToNextPathCurrentCurriculum = + createIdToNextPathMap(allChallengeNodes); + + const idToPrevPathCurrentCurriculum = + createIdToPrevPathMap(allChallengeNodes); + // Create challenge pages. - result.data.allChallengeNode.edges.forEach(createChallengePages(createPage)); + result.data.allChallengeNode.edges.forEach( + createChallengePages(createPage, { + idToNextPathCurrentCurriculum, + idToPrevPathCurrentCurriculum + }) + ); const blocks = uniq( result.data.allChallengeNode.edges.map( diff --git a/client/i18n/locales/chinese-traditional/intro.json b/client/i18n/locales/chinese-traditional/intro.json index bed5939a04edf4..9ec7e90f3046d5 100644 --- a/client/i18n/locales/chinese-traditional/intro.json +++ b/client/i18n/locales/chinese-traditional/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript 算法和數據結構（Beta）", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "開發者使用 HTML 和 CSS 來控制頁面的內容與樣式。他們還使用 JavaScript 來讓頁面可以交互。", "在這個 JavaScript 算法與數據結構認證中，你將學習如變量、數組、對象、循環、函數、DOM 等 JavaScript 的基礎知識。", @@ -584,10 +584,6 @@ "現在你學習瞭如何使用 D3 、 APIs 和 AJAX 技術，構建這 5 個數據可視化項目來測試你的技術吧。", "在這些項目中，你需要獲取數據並解析數據集，然後使用 D3 創建不同的數據可視化。完成之後，你可以獲得數據可視化認證。" ] - }, - "d3-dashboard": { - "title": "D3 面板", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Python 科學計算（Beta）", + "title": "Scientific Computing with Python", "intro": [ - "Python 科學計算（Beta）課程將使你掌握使用 Python 這種強大而通用的編程語言分析和處理數據的技能。你將學習數據結構、算法、面向對象編程等關鍵概念，以及如何使用各種工具進行復雜計算。", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "這個綜合課程將指導你學習科學計算的基礎知識，包括數據結構和算法。" ], "note": "", @@ -1152,7 +1148,8 @@ "title": "面試攻略", "intro": [ "如果你正在尋找免費的編程訓練來幫你爲下一個工作面試做準備，我們已經幫你準備好了。", - "這一部分包含了大量編程挑戰，可以測試你的算法、數據結構和數學知識。這裏還有一些你可以在家慢慢做的項目，用於提升你的技術，或者豐富你的作品集。" + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "歐拉計劃和羅塞塔代碼已移至各自的課程中。返回課程列表查看我們提供的課程。", "blocks": { @@ -1180,7 +1177,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp 版（Beta）", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project 由開發人員 Erik Trautman 創建於 2013 年。多年來，開源社區不斷維護和擴展該項目。", "freeCodeCamp 在開源課程的基礎上進行了擴展，使其可以在瀏覽器中交互運行，並通過測試來評估你的代碼，確保你理解了關鍵概念。", @@ -1376,23 +1373,8 @@ } } }, - "upcoming-python": { - "title": "即將推出的 Python ", - "intro": ["佔位符"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "通過創建 21 點遊戲學習 Python", - "intro": ["學習 Python。", ""] - }, - "upcoming-python-project": { - "title": "即將推出的 Python 項目", - "intro": ["佔位符"] - } - } - }, "a2-english-for-developers": { "title": "面向開發者的 A2 英語（Beta）", - "note": "該認證目前正在積極開發中。雖然目前還沒有可申請的認證，但很快就會有。在此期間，歡迎你探索我們在下面創建的課程。", "intro": [ "在開發者英語課程中，你將學習英語交流的基本要素。課程遵循歐洲共同語言參考標準（CEFR）的 A2 級，側重於對開發者有用的詞彙。", "課程的前半部分將幫助你熟悉英語語法和用法。你將通過大量的實踐練習學習自我介紹、聊天和討論工作等基礎知識。", @@ -1572,32 +1554,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1694,15 +1692,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1716,37 +1787,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1765,7 +1836,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1777,8 +1848,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1797,7 +1867,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1810,13 +1880,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1827,50 +1899,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1887,19 +1962,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1917,7 +1992,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1929,20 +2006,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1954,27 +2032,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -1989,19 +2071,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2020,13 +2102,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2045,36 +2128,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2083,59 +2168,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2148,7 +2232,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2161,45 +2245,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2212,85 +2294,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2302,25 +2388,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2333,26 +2420,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2364,25 +2452,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2392,46 +2481,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2444,76 +2540,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2526,25 +2632,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2556,65 +2661,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2627,55 +2732,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2685,152 +2796,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2848,74 +3003,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2924,91 +3090,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3019,155 +3214,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3176,118 +3346,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "muyw": { - "title": "266", - "intro": [] - }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3296,61 +3467,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3368,145 +3556,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3514,12 +3576,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3537,10 +3599,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3565,11 +3627,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3582,15 +3644,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3642,8 +3704,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3659,10 +3721,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3686,18 +3748,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3706,17 +3884,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3746,6 +3920,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/chinese-traditional/links.json b/client/i18n/locales/chinese-traditional/links.json index 0da85a86ebf1a7..d2c42331e2186d 100644 --- a/client/i18n/locales/chinese-traditional/links.json +++ b/client/i18n/locales/chinese-traditional/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/chinese/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://chinese.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/chinese-traditional/translations.json b/client/i18n/locales/chinese-traditional/translations.json index f29dc092bedd5b..2aadb4ad2d3d58 100644 --- a/client/i18n/locales/chinese-traditional/translations.json +++ b/client/i18n/locales/chinese-traditional/translations.json @@ -106,7 +106,10 @@ "donate-now": "立即捐款", "confirm-amount": "確認金額", "play-scene": "點擊播放", - "closed-caption": "關閉標題" + "closed-caption": "關閉標題", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "免費學習編程", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "免費獲得專業認證：", "interview-prep-heading": "爲開發人員面試求職做好準備：", "legacy-curriculum-heading": "探索我們的舊版課程：", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "即將推出的課程：", "faq": "常見問題：", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "爲整個網站添加令人愉快的吉他原聲音樂。在編輯器輸入、完成挑戰、申請認證等時刻，你將獲得音樂反饋。", "sound-volume": "營火音效音量", "scrollbar-width": "編輯器滾動條寬度", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "在一項挑戰中，按 ESC 鍵和問號可顯示可用的快捷方式列表。", "username": { "contains invalid characters": "用戶名 \"{{username}}\" 含有無效字符", @@ -346,13 +353,14 @@ "donated": "給社區捐款", "projects": "項目", "stats": "統計數據", + "activity": "Activity", "timeline": "時間線", "none-completed": "尚未完成任何挑戰。", "get-started": "從這裏開始。", "challenge": "挑戰", "completed": "已完成", "add-linkedin": "將此認證添加到我的 LinkedIn 個人資料", - "add-twitter": "將此認證分享到 Twitter", + "add-twitter": "Share this certification on X", "tweet": "我獲得了 {{certTitle}} 認證 @freeCodeCamp！在這裏查看：{{certURL}}", "avatar": "{{username}} 的頭像", "joined": "於 {{date}} 加入", @@ -361,7 +369,9 @@ "points": "{{date}} 獲得 {{count}} 分", "points_plural": "{{date}} 獲得 {{count}} 分", "page-number": "第 {{pageNumber}} 頁，共 {{totalPages}} 頁", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp 是捐助者支持的 501(c)(3) 條款下具有免稅資格的慈善組織（稅號：82-0779546）。", @@ -416,6 +426,7 @@ "assignments": "任務", "question": "問題", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "解決方案鏈接", "source-code-link": "源代碼鏈接", @@ -501,7 +512,9 @@ "complete-both-steps": "完成下面的兩個步驟來完成這一挑戰。", "runs-in-vm": "該項目在虛擬機中運行，完成在那裏描述的用戶故事，獲取所有測試並通過它們以完成步驟 1。", "completed": "已完成", + "not-completed": "Not completed", "not-started": "未開始", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "測試", "sorry-try-again": "抱歉，你的代碼未通過，再試一次。", "sorry-keep-trying": "抱歉，你的代碼未通過，再試試看。", @@ -583,6 +596,7 @@ "redirecting": "重新引導中...", "thanks": "感謝捐助", "thank-you": "謝謝你成爲我們的支持者。", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "你的卡片已經更新成功。", "additional": "你可以使用這個鏈接 <0>{{url}} 額外進行一次性捐款：", "help-more": "幫助我們的慈善機構做得更多", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "現在捐贈以幫助我們爲所有人開發免費的專業編程認證。", "help-us-reach-20k": "現在捐贈以幫助我們的慈善組織達成今年 20,000 名月度支持者的目標。", "beta-certification": "此認證目前處於測試階段。請考慮捐款以支持其開發完成。", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "幫助我們爲所有人開發免費的專業編程認證。", "nicely-done": "很棒，你已完成 {{block}}。", "credit-card": "信用卡", @@ -683,7 +701,7 @@ "bear-progress-alt": "插圖：一隻可愛的泰迪熊帶着懇求的表情抱着一個空錢罐。", "bear-completion-alt": "插圖：一隻可愛的泰迪熊抱着一個大獎盃。", "flying-bear": "插圖：一隻可愛的泰迪熊戴着畢業帽和支持者徽章飛翔。", - "crucial-contribution": "你的貢獻對於創建資源、使數百萬人能夠學習新技能並供養家庭至關重要。", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "成爲支持者的權益：", "support-benefits-1": "不再顯示捐款彈框", "support-benefits-2": "你將會獲得一個支持者徽章", @@ -710,6 +728,8 @@ "help-millions-learn": "幫助數百萬人學習", "reach-goals-faster": "更快地實現你的目標", "remove-distractions": "消除干擾", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "這是一個 20 秒的動畫廣告，旨在鼓勵學員成爲 freeCodeCamp 的支持者。動畫開頭是一隻泰迪熊成爲支持者。最後，彈窗消失了，泰迪熊完成了所有目標。它畢業了，成爲了幫助全世界人們的教育超級英雄。", "animation-countdown": "該動畫將在 {{secondsRemaining}} 秒後停止。" }, @@ -741,6 +761,7 @@ "result-list": "搜索結果" }, "misc": { + "coming-soon": "Coming Soon", "offline": "你已離線，學習進度可能不會被保存", "server-offline": "無法連接到服務器，你的進度可能無法保存。如果仍然出現此消息，請聯繫 <0>support。", "unsubscribed": "你已成功取消訂閱", @@ -852,7 +873,7 @@ "expired-link": "你點擊的鏈接似乎已過期，請刷新鏈接再登錄", "signin-success": "成功了！你已經登錄賬戶。", "social-auth-gone": "鑑於隱私原因，我們已取消社交賬戶授權。我們建議你下次使用你的郵箱地址登錄：{{email}} 。", - "name-needed": "我們需要將你的名字放在認證上。在你的賬戶設置中添加名字，點擊保存按鈕，然後我們會給你發佈認證。", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "你似乎未完成必要的步驟。請完成必做項目以申請 {{name}} 認證。", "already-claimed": "你似乎已申請 {{name}} 認證", "cert-claim-success": "@{{username}}，你已成功申請 {{name}} 認證！代表 freeCodeCamp.org 團隊恭喜你！", @@ -891,6 +912,7 @@ "invalid-update-flag": "你正在嘗試訪問禁止的資源。如果這是一個有效的請求，請在 https://forum.freecodecamp.org 上請求幫助。", "generate-exam-error": "生成考試時發生錯誤。", "cert-not-found": "認證 {{certSlug}} 不存在。", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "請在請求中包含一個 Microsoft 成績單的 URL。", @@ -951,6 +973,8 @@ "issued": "發佈日期", "fulltext": "<0>特證明 <1>{{user}} <2>已完成 <3>{{title}} <4>開發者認證課程，日期爲 {{time}}，<5>約 {{completionTime}} 課時", "fulltextNoHours": "<0>特證明 <1>{{user}} <2>已完成 <3>{{title}} <4>開發者認證課程，日期爲 {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "作爲舊版全棧認證的一部分，{{user}} 完成了以下認證：", "heading-exam": "作爲認證的一部分，{{user}} 通過了以下考試： ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "響應式網頁設計", - "responsive-web-design": "響應式 Web 設計認證", - "JavaScript Algorithms and Data Structures": "（舊版）JavaScript 算法和數據結構", - "javascript-algorithms-and-data-structures": "（舊版）JavaScript 算法和數據結構認證", - "javascript-algorithms-and-data-structures-v8": "JavaScript 算法和數據結構（Beta）認證", - "Front End Development Libraries": "前端開發庫", - "front-end-development-libraries": "前端開發庫認證", - "Data Visualization": "數據可視化", - "data-visualization": "數據可視化認證", - "Relational Database": "關係數據庫", - "relational-database-v8": "關係數據庫認證", - "Back End Development and APIs": "後端開發和 APIs", - "back-end-development-and-apis": "後端開發和 APIs 認證", - "Quality Assurance": "質量保證", - "quality-assurance-v7": "質量保證認證", - "Scientific Computing with Python": "Python 和科學計算", - "scientific-computing-with-python-v7": "Python 和科學計算認證", - "Data Analysis with Python": "Python 和數據分析", - "data-analysis-with-python-v7": "Python 和數據分析認證", - "Information Security": "信息安全", - "information-security-v7": "信息安全認證", - "Machine Learning with Python": "機器學習與Python", - "machine-learning-with-python-v7": "Python 和機器學習認證", - "College Algebra with Python": "Python 和大學代數", - "college-algebra-with-python-v8": "Python 和大學代數認證", - "Foundational C# with Microsoft": "微軟基礎 C# ", - "foundational-c-sharp-with-microsoft": "微軟基礎 C# 認證", - "A2 English for Developers": "面向開發者的 A2 英語", - "a2-english-for-developers": "面向開發者的 A2 英語認證", - "B1 English for Developers": "面向開發者的 B1 英語", - "b1-english-for-developers": "面向開發者的 B1 英語認證", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "舊版前端", - "legacy-front-end": "舊版前端認證", - "Legacy Back End": "舊版後端", - "legacy-back-end": "舊版後端認證", - "Legacy Data Visualization": "舊版數據可視化", - "legacy-data-visualization": "舊版數據可視化認證", - "Legacy Information Security and Quality Assurance": "舊版信息安全和質量保證", - "information-security-and-quality-assurance": "舊版信息安全和質量保證認證", - "Legacy Full Stack Certification": "舊版全棧認證", - "Legacy Full Stack": "舊版的全棧", - "full-stack": "舊版全棧認證" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/chinese/intro.json b/client/i18n/locales/chinese/intro.json index 26ddbe812a13da..72ce70af0b3138 100644 --- a/client/i18n/locales/chinese/intro.json +++ b/client/i18n/locales/chinese/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript 算法和数据结构（Beta）", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "开发者使用 HTML 和 CSS 来控制页面的内容与样式。他们还使用 JavaScript 来让页面可以交互。", "在这个 JavaScript 算法与数据结构认证中，你将学习如变量、数组、对象、循环、函数、DOM 等 JavaScript 的基础知识。", @@ -584,10 +584,6 @@ "现在你学习了如何使用 D3 、 APIs 和 AJAX 技术，构建这 5 个数据可视化项目来测试你的技术吧。", "在这些项目中，你需要获取数据并解析数据集，然后使用 D3 创建不同的数据可视化。完成之后，你可以获得数据可视化认证。" ] - }, - "d3-dashboard": { - "title": "D3 面板", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Python 科学计算（Beta）", + "title": "Scientific Computing with Python", "intro": [ - "Python 科学计算（Beta）课程将使你掌握使用 Python 这种强大而通用的编程语言分析和处理数据的技能。你将学习数据结构、算法、面向对象编程等关键概念，以及如何使用各种工具进行复杂计算。", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "这个综合课程将指导你学习科学计算的基础知识，包括数据结构和算法。" ], "note": "", @@ -1152,7 +1148,8 @@ "title": "面试攻略", "intro": [ "如果你正在寻找免费的编程训练来帮你为下一个工作面试做准备，我们已经帮你准备好了。", - "这一部分包含了大量编程挑战，可以测试你的算法、数据结构和数学知识。这里还有一些你可以在家慢慢做的项目，用于提升你的技术，或者丰富你的作品集。" + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "欧拉计划和罗塞塔代码已移至各自的课程中。返回课程列表查看我们提供的课程。", "blocks": { @@ -1180,7 +1177,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp 版（Beta）", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project 由开发人员 Erik Trautman 创建于 2013 年。多年来，开源社区不断维护和扩展该项目。", "freeCodeCamp 在开源课程的基础上进行了扩展，使其可以在浏览器中交互运行，并通过测试来评估你的代码，确保你理解了关键概念。", @@ -1376,23 +1373,8 @@ } } }, - "upcoming-python": { - "title": "即将推出的 Python ", - "intro": ["占位符"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "通过创建 21 点游戏学习 Python", - "intro": ["学习 Python。", ""] - }, - "upcoming-python-project": { - "title": "即将推出的 Python 项目", - "intro": ["占位符"] - } - } - }, "a2-english-for-developers": { "title": "面向开发者的 A2 英语（Beta）", - "note": "该认证目前正在积极开发中。虽然目前还没有可申请的认证，但很快就会有。在此期间，欢迎你探索我们在下面创建的课程。", "intro": [ "在开发者英语课程中，你将学习英语交流的基本要素。课程遵循欧洲共同语言参考标准（CEFR）的 A2 级，侧重于对开发者有用的词汇。", "课程的前半部分将帮助你熟悉英语语法和用法。你将通过大量的实践练习学习自我介绍、聊天和讨论工作等基础知识。", @@ -1572,32 +1554,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1694,15 +1692,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1716,37 +1787,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1765,7 +1836,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1777,8 +1848,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1797,7 +1867,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1810,13 +1880,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1827,50 +1899,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1887,19 +1962,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1917,7 +1992,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1929,20 +2006,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1954,27 +2032,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -1989,19 +2071,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2020,13 +2102,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2045,36 +2128,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2083,59 +2168,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2148,7 +2232,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2161,45 +2245,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2212,85 +2294,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2302,25 +2388,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2333,26 +2420,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2364,25 +2452,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2392,46 +2481,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2444,76 +2540,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2526,25 +2632,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2556,65 +2661,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2627,55 +2732,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2685,152 +2796,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2848,74 +3003,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2924,91 +3090,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3019,155 +3214,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3176,118 +3346,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "muyw": { - "title": "266", - "intro": [] - }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3296,61 +3467,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3368,145 +3556,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3514,12 +3576,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3537,10 +3599,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3565,11 +3627,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3582,15 +3644,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3642,8 +3704,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3659,10 +3721,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3686,18 +3748,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3706,17 +3884,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3746,6 +3920,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/chinese/links.json b/client/i18n/locales/chinese/links.json index 0da85a86ebf1a7..d2c42331e2186d 100644 --- a/client/i18n/locales/chinese/links.json +++ b/client/i18n/locales/chinese/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/chinese/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://chinese.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/chinese/translations.json b/client/i18n/locales/chinese/translations.json index 5b34c17aaeed59..688cc73a86d5f9 100644 --- a/client/i18n/locales/chinese/translations.json +++ b/client/i18n/locales/chinese/translations.json @@ -106,7 +106,10 @@ "donate-now": "立即捐款", "confirm-amount": "确认金额", "play-scene": "点击播放", - "closed-caption": "关闭标题" + "closed-caption": "关闭标题", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "免费学习编程", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "免费获得专业认证：", "interview-prep-heading": "为开发人员面试求职做好准备：", "legacy-curriculum-heading": "探索我们的旧版课程：", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "即将推出的课程：", "faq": "常见问题：", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "为整个网站添加令人愉快的吉他原声音乐。在编辑器输入、完成挑战、申请认证等时刻，你将获得音乐反馈。", "sound-volume": "营火音效音量", "scrollbar-width": "编辑器滚动条宽度", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "在一项挑战中，按 ESC 键和问号可显示可用的快捷方式列表。", "username": { "contains invalid characters": "用户名 \"{{username}}\" 含有无效字符", @@ -346,13 +353,14 @@ "donated": "给社区捐款", "projects": "项目", "stats": "统计数据", + "activity": "Activity", "timeline": "时间线", "none-completed": "尚未完成任何挑战。", "get-started": "从这里开始。", "challenge": "挑战", "completed": "已完成", "add-linkedin": "将此认证添加到我的 LinkedIn 个人资料", - "add-twitter": "将此认证分享到 Twitter", + "add-twitter": "Share this certification on X", "tweet": "我获得了 {{certTitle}} 认证 @freeCodeCamp！在这里查看：{{certURL}}", "avatar": "{{username}} 的头像", "joined": "于 {{date}} 加入", @@ -361,7 +369,9 @@ "points": "{{date}} 获得 {{count}} 分", "points_plural": "{{date}} 获得 {{count}} 分", "page-number": "第 {{pageNumber}} 页，共 {{totalPages}} 页", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp 是捐助者支持的 501(c)(3) 条款下具有免税资格的慈善组织（税号：82-0779546）。", @@ -416,6 +426,7 @@ "assignments": "任务", "question": "问题", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "解决方案链接", "source-code-link": "源代码链接", @@ -501,7 +512,9 @@ "complete-both-steps": "完成下面的两个步骤来完成这一挑战。", "runs-in-vm": "该项目在虚拟机中运行，完成在那里描述的用户故事，获取所有测试并通过它们以完成步骤 1。", "completed": "已完成", + "not-completed": "Not completed", "not-started": "未开始", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "测试", "sorry-try-again": "抱歉，你的代码未通过，再试一次。", "sorry-keep-trying": "抱歉，你的代码未通过，再试试看。", @@ -583,6 +596,7 @@ "redirecting": "重新引导中...", "thanks": "感谢捐助", "thank-you": "谢谢你成为我们的支持者。", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "你的卡片已经更新成功。", "additional": "你可以使用这个链接 <0>{{url}} 额外进行一次性捐款：", "help-more": "帮助我们的慈善机构做得更多", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "现在捐赠以帮助我们为所有人开发免费的专业编程认证。", "help-us-reach-20k": "现在捐赠以帮助我们的慈善组织达成今年 20,000 名月度支持者的目标。", "beta-certification": "此认证目前处于测试阶段。请考虑捐款以支持其开发完成。", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "帮助我们为所有人开发免费的专业编程认证。", "nicely-done": "很棒，你已完成 {{block}}。", "credit-card": "信用卡", @@ -683,7 +701,7 @@ "bear-progress-alt": "插图：一只可爱的泰迪熊带着恳求的表情抱着一个空钱罐。", "bear-completion-alt": "插图：一只可爱的泰迪熊抱着一个大奖杯。", "flying-bear": "插图：一只可爱的泰迪熊戴着毕业帽和支持者徽章飞翔。", - "crucial-contribution": "你的贡献对于创建资源、使数百万人能够学习新技能并供养家庭至关重要。", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "成为支持者的权益：", "support-benefits-1": "不再显示捐款弹框", "support-benefits-2": "你将会获得一个支持者徽章", @@ -710,6 +728,8 @@ "help-millions-learn": "帮助数百万人学习", "reach-goals-faster": "更快地实现你的目标", "remove-distractions": "消除干扰", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "这是一个 20 秒的动画广告，旨在鼓励学员成为 freeCodeCamp 的支持者。动画开头是一只泰迪熊成为支持者。最后，弹窗消失了，泰迪熊完成了所有目标。它毕业了，成为了帮助全世界人们的教育超级英雄。", "animation-countdown": "该动画将在 {{secondsRemaining}} 秒后停止。" }, @@ -741,6 +761,7 @@ "result-list": "搜索结果" }, "misc": { + "coming-soon": "Coming Soon", "offline": "你已离线，学习进度可能不会被保存", "server-offline": "无法连接到服务器，你的进度可能无法保存。如果仍然出现此消息，请联系 <0>support。", "unsubscribed": "你已成功取消订阅", @@ -852,7 +873,7 @@ "expired-link": "你点击的链接似乎已过期，请刷新链接再登录", "signin-success": "成功了！你已经登录账户。", "social-auth-gone": "鉴于隐私原因，我们已取消社交账户授权。我们建议你下次使用你的邮箱地址登录：{{email}} 。", - "name-needed": "我们需要将你的名字放在认证上。在你的账户设置中添加名字，点击保存按钮，然后我们会给你发布认证。", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "你似乎未完成必要的步骤。请完成必做项目以申请 {{name}} 认证。", "already-claimed": "你似乎已申请 {{name}} 认证", "cert-claim-success": "@{{username}}，你已成功申请 {{name}} 认证！代表 freeCodeCamp.org 团队恭喜你！", @@ -891,6 +912,7 @@ "invalid-update-flag": "你正在尝试访问禁止的资源。如果这是一个有效的请求，请在 https://forum.freecodecamp.org 上请求帮助。", "generate-exam-error": "生成考试时发生错误。", "cert-not-found": "认证 {{certSlug}} 不存在。", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "请在请求中包含一个 Microsoft 成绩单的 URL。", @@ -951,6 +973,8 @@ "issued": "发布日期", "fulltext": "<0>特证明 <1>{{user}} <2>已完成 <3>{{title}} <4>开发者认证课程，日期为 {{time}}，<5>约 {{completionTime}} 课时", "fulltextNoHours": "<0>特证明 <1>{{user}} <2>已完成 <3>{{title}} <4>开发者认证课程，日期为 {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "作为旧版全栈认证的一部分，{{user}} 完成了以下认证：", "heading-exam": "作为认证的一部分，{{user}} 通过了以下考试： ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "响应式网页设计", - "responsive-web-design": "响应式 Web 设计认证", - "JavaScript Algorithms and Data Structures": "（旧版）JavaScript 算法和数据结构", - "javascript-algorithms-and-data-structures": "（旧版）JavaScript 算法和数据结构认证", - "javascript-algorithms-and-data-structures-v8": "JavaScript 算法和数据结构（Beta）认证", - "Front End Development Libraries": "前端开发库", - "front-end-development-libraries": "前端开发库认证", - "Data Visualization": "数据可视化", - "data-visualization": "数据可视化认证", - "Relational Database": "关系数据库", - "relational-database-v8": "关系数据库认证", - "Back End Development and APIs": "后端开发和 APIs", - "back-end-development-and-apis": "后端开发和 APIs 认证", - "Quality Assurance": "质量保证", - "quality-assurance-v7": "质量保证认证", - "Scientific Computing with Python": "Python 和科学计算", - "scientific-computing-with-python-v7": "Python 和科学计算认证", - "Data Analysis with Python": "Python 和数据分析", - "data-analysis-with-python-v7": "Python 和数据分析认证", - "Information Security": "信息安全", - "information-security-v7": "信息安全认证", - "Machine Learning with Python": "机器学习与Python", - "machine-learning-with-python-v7": "Python 和机器学习认证", - "College Algebra with Python": "Python 和大学代数", - "college-algebra-with-python-v8": "Python 和大学代数认证", - "Foundational C# with Microsoft": "微软基础 C# ", - "foundational-c-sharp-with-microsoft": "微软基础 C# 认证", - "A2 English for Developers": "面向开发者的 A2 英语", - "a2-english-for-developers": "面向开发者的 A2 英语认证", - "B1 English for Developers": "面向开发者的 B1 英语", - "b1-english-for-developers": "面向开发者的 B1 英语认证", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "旧版前端", - "legacy-front-end": "旧版前端认证", - "Legacy Back End": "旧版后端", - "legacy-back-end": "旧版后端认证", - "Legacy Data Visualization": "旧版数据可视化", - "legacy-data-visualization": "旧版数据可视化认证", - "Legacy Information Security and Quality Assurance": "旧版信息安全和质量保证", - "information-security-and-quality-assurance": "旧版信息安全和质量保证认证", - "Legacy Full Stack Certification": "旧版全栈认证", - "Legacy Full Stack": "旧版的全栈", - "full-stack": "旧版全栈认证" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/english/intro.json b/client/i18n/locales/english/intro.json index 4f3f5a22701369..7695d9ee2d88b4 100644 --- a/client/i18n/locales/english/intro.json +++ b/client/i18n/locales/english/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript Algorithms and Data Structures (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Developers use HTML and CSS to control the content and styling of a page. And they use JavaScript to make that page interactive.", "In this JavaScript Algorithm and Data Structures Certification, you'll learn the JavaScript fundamentals like variables, arrays, objects, loops, functions, the DOM and more.", @@ -584,8 +584,7 @@ "Now that you learned how to work with D3, APIs, and AJAX technologies, put your skills to the test with these 5 Data Visualization projects.", "In these projects, you'll need to fetch data and parse a dataset, then use D3 to create different data visualizations. Finish them all to earn your Data Visualization certification." ] - }, - "d3-dashboard": { "title": "D3 Dashboard", "intro": ["", ""] } + } } }, "relational-database": { @@ -773,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Scientific Computing with Python (Beta)", + "title": "Scientific Computing with Python", "intro": [ - "The Scientific Computing with Python (Beta) curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "This comprehensive course will guide you through the fundamentals of scientific computing, including data structures, and algorithms." ], "note": "", @@ -1159,7 +1158,8 @@ "title": "Coding Interview Prep", "intro": [ "If you're looking for free coding exercises to prepare for your next job interview, we've got you covered.", - "This section contains hundreds of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "The Project Euler Project and Rosetta Code have been moved to their own courses. Go back to the curriculum to see the list of courses we offer.", "blocks": { @@ -1187,7 +1187,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project was created in 2013 by a lone developer, Erik Trautman. Over the years, an open source community has sprung up to maintain and expand the project.", "freeCodeCamp has expanded upon the open source curriculum to make it run interactively in the browser, with tests to evaluate your code and ensure you've understood key concepts.", @@ -1387,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Upcoming Python", - "intro": ["placeholder"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Learn Python by Building a Blackjack Game", - "intro": ["Learn Python.", ""] - }, - "upcoming-python-project": { - "title": "Upcoming Python Project", - "intro": ["placeholder"] - } - } - }, "a2-english-for-developers": { "title": "A2 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", "intro": [ "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the A2 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", "The first half of the curriculum will help you get comfortable with English grammar and usage. It will give you tons of hands-on practice. You'll learn basics like introducing yourself, making small talk, and discussing your work.", @@ -1583,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1705,6 +1706,77 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { "lecture-welcome-to-freecodecamp": { "title": "Welcome to freeCodeCamp", @@ -1715,7 +1787,7 @@ "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1729,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1778,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1790,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1810,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1823,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1840,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1897,19 +1973,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1927,7 +2003,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1939,20 +2017,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1964,24 +2043,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." + ] + }, + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." ] }, - "pahx": { "title": "45", "intro": [] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -1996,19 +2082,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2027,13 +2113,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2052,33 +2139,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." + ] + }, + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." ] }, - "ohhu": { "title": "58", "intro": [] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2087,56 +2179,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { "title": "64", "intro": [] }, + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] + }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2149,7 +2243,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2162,45 +2256,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2213,86 +2305,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Before you are quizzed on CSS and accessibility, you first need to review.", + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2304,25 +2399,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2335,26 +2431,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2366,25 +2463,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2394,34 +2492,39 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { "title": "114", "intro": [] }, + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] + }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS Grid, you first need to review.", + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, "workshop-ferris-wheel": { @@ -2434,7 +2537,8 @@ "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2447,21 +2551,19 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Before you are quizzed on working with CSS animations, you first need to review.", + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", @@ -2472,34 +2574,41 @@ }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { @@ -2512,13 +2621,13 @@ "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2531,7 +2640,7 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { @@ -2543,14 +2652,12 @@ }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2562,65 +2669,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2633,61 +2740,60 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Before you are quizzed on JavaScript functions, HTML, you first need to review the concepts.", + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." - ] + "intro": ["Test your knowledge of JavaScript functions with this quiz."] }, "lecture-working-with-arrays": { "title": "Working with Arrays", "intro": [ - "In these lecture videos, you will learn about working with JavaScript arrays." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, "lecture-working-with-common-array-methods": { "title": "Working with Common Array Methods", "intro": [ - "In these lecture videos, you will learn about common array methods." + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, "lecture-working-with-objects": { "title": "Working with Objects", "intro": [ - "In these lecture videos, you will learn about working with objects in JavaScript." + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." ] }, "workshop-recipe-tracker": { @@ -2698,95 +2804,114 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." - ] + "intro": ["Test your knowledge of JavaScript objects with this quiz."] }, "lecture-working-with-loops": { "title": "Working with Loops", "intro": [ - "In these lecture videos, you will learn about working with loops in JavaScript." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, "lecture-understanding-core-javascript-fundamentals": { "title": "Understanding Core JavaScript Fundamentals", "intro": [ - "In these lecture videos, you will learn more about core JavaScript fundamentals." + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, "lecture-the-var-keyword-and-hoisting": { "title": "The var Keyword and Hoisting", "intro": [ - "In these lecture videos, you will learn about the var keyword and hoisting in JavaScript." + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, "lecture-understanding-modules-imports-and-exports": { "title": "Understanding Modules, Imports, and Exports", "intro": [ - "In these lecture videos, you will learn about modules, imports, and exports in JavaScript." + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] + }, + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." ] }, - "lnmg": { "title": "179", "intro": [] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, "lecture-working-with-higher-order-functions-and-callbacks": { "title": "Working with Higher Order Functions and Callbacks", "intro": [ - "In these lecture videos, you will learn about working with higher order functions and callbacks." + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." ] }, "workshop-library-manager": { @@ -2795,26 +2920,31 @@ "In this workshop, you will learn higher order array methods by building a library manager" ] }, - "bxtv": { "title": "184", "intro": [] }, + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] + }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, "lecture-working-with-the-dom-click-events-and-web-apis": { "title": "Working with the DOM, Click Events, and Web APIs", "intro": [ - "In these lecture videos, you will learn how to work with the DOM, click events, and web APIs, using Javascript." + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." ] }, - "gibb": { "title": "188", "intro": [] }, "workshop-storytelling-app": { "title": "Build a Storytelling App", "intro": [ @@ -2824,25 +2954,26 @@ "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, "lecture-understanding-the-event-object-and-event-delegation": { "title": "Understanding the Event Object and Event Delegation", "intro": [ - "In these lecture videos, you will learn about the event object and event delegation." + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." ] }, "workshop-music-instrument-filter": { @@ -2853,12 +2984,16 @@ }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2876,39 +3011,49 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] + }, + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, - "kaqq": { "title": "201", "intro": [] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { "title": "205", "intro": [] }, "workshop-spam-filter": { "title": "Build a Spam Filter", "intro": [ @@ -2919,26 +3064,33 @@ "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." + ] + }, + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." ] }, - "zalp": { "title": "211", "intro": [] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", "intro": [ @@ -2946,62 +3098,121 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { "title": "213", "intro": [] }, + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] + }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." + ] + }, + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." ] }, - "lupt": { "title": "216", "intro": [] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] + }, + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] + }, + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] + }, + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, - "lvts": { "title": "220", "intro": [] }, - "foal": { "title": "221", "intro": [] }, - "crzf": { "title": "222", "intro": [] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." + ] + }, + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" ] }, - "pehm": { "title": "225", "intro": [] }, - "cvsw": { "title": "226", "intro": [] }, - "cvs1": { "title": "227", "intro": [] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] + }, + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] + }, + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", + "intro": [ + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." + ] + }, + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] + }, + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." ] }, - "cvs3": { "title": "229", "intro": [] }, - "fgbp": { "title": "230", "intro": [] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", "intro": [ @@ -3011,21 +3222,30 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." + ] + }, + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." ] }, - "jbst": { "title": "235", "intro": [] }, "workshop-shopping-cart": { "title": "Build a Shopping Cart", "intro": [ @@ -3036,59 +3256,97 @@ "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." + ] + }, + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." ] }, - "ndlf": { "title": "238", "intro": [] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." + ] + }, + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", + "intro": [ + "Test what you've learned about JavaScript Classes with this quiz." + ] + }, + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", + "intro": [ + "In this lecture video, you will learn about recursion and the call stack." + ] + }, + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", + "intro": [ + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." + ] + }, + "lab-permutation-generator": { + "title": "Build a Permutation Generator", + "intro": [ + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "ndl1": { "title": "240", "intro": [] }, - "ndl2": { "title": "241", "intro": [] }, - "ndl3": { "title": "242", "intro": [] }, - "ndl4": { "title": "243", "intro": [] }, "review-recursion": { "title": "Recursion Review", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, "quiz-recursion": { "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "yshh": { "title": "246", "intro": [] }, - "wyx1": { "title": "247", "intro": [] }, - "wyx2": { "title": "248", "intro": [] }, - "wyx3": { "title": "249", "intro": [] }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "dtfv": { "title": "240", "intro": [] }, - "bnvw": { "title": "241", "intro": [] }, - "workshop-decimal-to-binary-converter": { - "title": "Build a Decimal to Binary Converter", + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", "intro": [ - "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", - "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] + }, + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." ] }, - "xkhk": { "title": "243", "intro": [] }, - "yaxm": { "title": "245", "intro": [] }, - "udia": { "title": "248", "intro": [] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." + ] + }, + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", + "intro": [ + "Test what you've learned about JavaScript functional programming with this quiz." + ] + }, + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." ] }, - "mjbe": { "title": "251", "intro": [] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", "intro": [ @@ -3096,47 +3354,77 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { "title": "253", "intro": [] }, - "cvaf": { "title": "254", "intro": [] }, + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] + }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, "lecture-introduction-to-javascript-libraries-and-frameworks": { "title": "Introduction to JavaScript Libraries and Frameworks", "intro": [ - "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks." + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] + }, + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", + "intro": [ + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "oxiv": { "title": "260", "intro": [] }, - "fjvx": { "title": "261", "intro": [] }, + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] + }, "lecture-working-with-data-in-react": { "title": "Working with Data in React", "intro": [ - "In these lecture videos, you will learn about working with data in React." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." + ] + }, + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", + "intro": [ + "In this workshop, you will learn how to work with props by building a reusable profile card component." + ] + }, + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] + }, + "review-react-basics": { + "title": "React Basics Review", + "intro": [ + "Review basic React concepts to prepare for the upcoming quiz." ] }, - "cdfr": { "title": "263", "intro": [] }, - "bgtd": { "title": "264", "intro": [] }, - "ascd": { "title": "265", "intro": [] }, "quiz-react-basics": { "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] + "intro": ["Test your knowledge of React basics with this quiz."] }, "rugw": { "title": "267", "intro": [] }, "rmpy": { "title": "268", "intro": [] }, @@ -3148,20 +3436,28 @@ "quiz-react-state-and-hooks": { "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on React State and Hooks." + "Test what you've learned about React State and Hooks with this quiz." ] }, "ftmi": { "title": "275", "intro": [] }, "sgau": { "title": "276", "intro": [] }, "clak": { "title": "277", "intro": [] }, - "fcom": { "title": "278", "intro": [] }, + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] + }, "ffpt": { "title": "279", "intro": [] }, "lrof": { "title": "280", "intro": [] }, "vyzp": { "title": "281", "intro": [] }, "zagz": { "title": "282", "intro": [] }, "quiz-advanced-react": { "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] }, "zdsj": { "title": "284", "intro": [] }, "review-web-performance": { @@ -3172,7 +3468,9 @@ }, "quiz-web-performance": { "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, "review-css-libraries-and-frameworks": { @@ -3184,19 +3482,17 @@ "quiz-css-libraries-and-frameworks": { "title": "CSS Libraries and Frameworks Quiz", "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." + "Test what you've learned about CSS Libraries and Frameworks with this quiz." ] }, "khuu": { "title": "290", "intro": [] }, "review-testing": { "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, "quiz-testing": { "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", "intro": [] }, "kwmg": { "title": "294", "intro": [] }, @@ -3206,12 +3502,12 @@ "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3236,7 +3532,7 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, "voks": { "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3261,7 +3557,7 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, "pexz": { "title": "311", "intro": [] }, @@ -3275,12 +3571,12 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, "tkgg": { "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3346,7 +3642,7 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, "rhhl": { "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3370,16 +3666,16 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, "thsj": { "title": "335", "intro": [] }, diff --git a/client/i18n/locales/english/links.json b/client/i18n/locales/english/links.json index 1c6eace5e189cc..6d8d8c23bafd2b 100644 --- a/client/i18n/locales/english/links.json +++ b/client/i18n/locales/english/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/english/translations.json b/client/i18n/locales/english/translations.json index fc7d3f211beb93..3ae980717fdebc 100644 --- a/client/i18n/locales/english/translations.json +++ b/client/i18n/locales/english/translations.json @@ -106,7 +106,10 @@ "donate-now": "Donate Now", "confirm-amount": "Confirm amount", "play-scene": "Press Play", - "closed-caption": "Closed caption" + "closed-caption": "Closed caption", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Learn to code — for free.", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "Earn free professional certifications:", "interview-prep-heading": "Prepare for the developer interview job search:", "legacy-curriculum-heading": "Explore our Legacy Curriculum:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Upcoming curriculum:", "faq": "Frequently asked questions:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "This adds the pleasant sound of acoustic guitar throughout the website. You'll get musical feedback as you type in the editor, complete challenges, claim certifications, and more.", "sound-volume": "Campfire Volume:", "scrollbar-width": "Editor Scrollbar Width", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Within a challenge, press ESC followed by the question mark to show a list of available shortcuts.", "username": { "contains invalid characters": "Username \"{{username}}\" contains invalid characters", @@ -346,13 +353,14 @@ "donated": "Donated to the community", "projects": "Projects", "stats": "Stats", + "activity": "Activity", "timeline": "Timeline", "none-completed": "No challenges have been completed yet.", "get-started": "Get started here.", "challenge": "Challenge", "completed": "Completed", "add-linkedin": "Add this certification to my LinkedIn profile", - "add-twitter": "Share this certification on Twitter", + "add-twitter": "Share this certification on X", "tweet": "I just earned the {{certTitle}} certification @freeCodeCamp! Check it out here: {{certURL}}", "avatar": "{{username}}'s avatar", "joined": "Joined {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}} point on {{date}}", "points_plural": "{{count}} points on {{date}}", "page-number": "{{pageNumber}} of {{totalPages}}", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charitable organization (United States Federal Tax Identification Number: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Assignments", "question": "Question", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "Solution Link", "source-code-link": "Source Code Link", @@ -501,7 +512,9 @@ "complete-both-steps": "Complete both steps below to finish the challenge.", "runs-in-vm": "The project runs in a virtual machine, complete the user stories described in there and get all the tests to pass to finish step 1.", "completed": "Completed", + "not-completed": "Not completed", "not-started": "Not started", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Test", "sorry-try-again": "Sorry, your code does not pass. Try again.", "sorry-keep-trying": "Sorry, your code does not pass. Keep trying.", @@ -583,6 +596,7 @@ "redirecting": "Redirecting...", "thanks": "Thanks for donating", "thank-you": "Thank You for Being a Supporter", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Your card has been updated successfully.", "additional": "You can make an additional one-time donation of any amount using this link: <0>{{url}}", "help-more": "Help Our Charity Do More", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Donate now to help us develop free professional programming certifications for all.", "help-us-reach-20k": "Donate now to help our charity reach our goal of 20,000 monthly supporters this year.", "beta-certification": "This certification is currently in beta. Please consider donating to support the completion of its development.", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Help us develop free professional programming certifications for all.", "nicely-done": "Nicely done. You just completed {{block}}.", "credit-card": "Credit Card", @@ -683,13 +701,13 @@ "bear-progress-alt": "Illustration of an adorable teddy bear with a pleading expression holding an empty money jar.", "bear-completion-alt": "Illustration of an adorable teddy bear holding a large trophy.", "flying-bear": "Illustration of an adorable teddy bear wearing a graduation cap and flying with a Supporter badge.", - "crucial-contribution": "Your contribution will be crucial in creating resources that empower millions of people to learn new skills and support their families.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Benefits from becoming a Supporter:", "support-benefits-1": "No more donation prompt popups", "support-benefits-2": "You'll get a Supporter badge", "support-benefits-3": "Your profile image will get a golden halo around it", "support-benefits-4": "You'll gain access to special Supporter Discord channels - <0>join our Discord and use the <1>/supporter command to get access", - "support-benefits-5": "And more benefits to come in 2024", + "support-benefits-5": "And more benefits to come soon", "exclusive-features": "Here is the list of exclusive features for you as a Supporter:", "current-initiatives-title": "Current Initiatives:", "your-donation-helps-followings": "Your donation makes the following initiatives possible:", @@ -698,10 +716,10 @@ "current-initiatives-3": "Translating our curriculum and tutorials into 32 languages", "current-initiatives-4": "Creating a free accredited computer science bachelor's degree", "community-achivements-title": "Our Community Achievements This Year:", - "community-achivements-1": "Published <0>114 full-length courses on YouTube.", - "community-achivements-2": "Published <0>1,045 text-based coding tutorials and <0>20 free books through freeCodeCamp Press.", - "community-achivements-3": "Merged <0>2,753 code contributions into our open source repositories on GitHub", - "community-achivements-4": "Translated <0>2,106,203 words to make our curriculum and tutorials more accessible to speakers of many world languages", + "community-achivements-1": "Published <0>193 full-length courses on YouTube.", + "community-achivements-2": "Published <0>850 text-based coding tutorials and <0>5 free books through freeCodeCamp Press.", + "community-achivements-3": "Merged <0>2,455 code contributions into our open source repositories on GitHub", + "community-achivements-4": "Translated <0>1.5 million words to make our curriculum and tutorials more accessible to speakers of many world languages", "as-you-see": "As you can see, we're getting things done. So you can rest assured that we'll put your donations to good use.", "get-benefits": "Get the benefits and the knowledge that you’re helping our charity change education for the better. Become a supporter today.", "modal-benefits-title": "Support us", @@ -710,6 +728,8 @@ "help-millions-learn": "Help millions of people learn", "reach-goals-faster": "Reach your goals faster", "remove-distractions": "Remove distractions", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "This is a 20 second animated advertisement to encourage campers to become supporters of freeCodeCamp. The animation starts with a teddy bear who becomes a supporter. As a result, distracting pop-ups disappear and the bear gets to complete all of its goals. Then, it graduates and becomes an education super hero helping people around the world.", "animation-countdown": "This animation will stop after {{secondsRemaining}} seconds." }, @@ -741,6 +761,7 @@ "result-list": "Search results" }, "misc": { + "coming-soon": "Coming Soon", "offline": "You appear to be offline, your progress may not be saved", "server-offline": "The server could not be reached and your progress may not be saved. Please contact <0>support if this message persists", "unsubscribed": "You have successfully been unsubscribed", @@ -891,6 +912,7 @@ "invalid-update-flag": "You are attempting to access forbidden resources. Please request assistance on https://forum.freecodecamp.org if this is a valid request.", "generate-exam-error": "An error occurred trying to generate your exam.", "cert-not-found": "The certification {{certSlug}} does not exist.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Please include a Microsoft transcript URL in the request.", @@ -951,6 +973,8 @@ "issued": "Issued", "fulltext": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}} <5>representing approximately {{completionTime}} hours of work", "fulltextNoHours": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "As part of this Legacy Full Stack certification, {{user}} completed the following certifications:", "heading-exam": "As part of this certification, {{user}} passed the following exam: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Responsive Web Design", - "responsive-web-design": "Responsive Web Design Certification", - "JavaScript Algorithms and Data Structures": "Legacy JavaScript Algorithms and Data Structures", - "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures Certification", - "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures (Beta) Certification", - "Front End Development Libraries": "Front End Development Libraries", - "front-end-development-libraries": "Front End Development Libraries Certification", - "Data Visualization": "Data Visualization", - "data-visualization": "Data Visualization Certification", - "Relational Database": "Relational Database", - "relational-database-v8": "Relational Database Certification", - "Back End Development and APIs": "Back End Development and APIs", - "back-end-development-and-apis": "Back End Development and APIs Certification", - "Quality Assurance": "Quality Assurance", - "quality-assurance-v7": "Quality Assurance Certification", - "Scientific Computing with Python": "Scientific Computing with Python", - "scientific-computing-with-python-v7": "Scientific Computing with Python Certification", - "Data Analysis with Python": "Data Analysis with Python", - "data-analysis-with-python-v7": "Data Analysis with Python Certification", - "Information Security": "Information Security", - "information-security-v7": "Information Security Certification", - "Machine Learning with Python": "Machine Learning with Python", - "machine-learning-with-python-v7": "Machine Learning with Python Certification", - "College Algebra with Python": "College Algebra with Python", - "college-algebra-with-python-v8": "College Algebra with Python Certification", - "Foundational C# with Microsoft": "Foundational C# with Microsoft", - "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft Certification", - "A2 English for Developers": "A2 English for Developers", - "a2-english-for-developers": "A2 English for Developers Certification", - "B1 English for Developers": "B1 English for Developers", - "b1-english-for-developers": "B1 English for Developers Certification", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "Legacy Front End", - "legacy-front-end": "Legacy Front End Certification", - "Legacy Back End": "Legacy Back End", - "legacy-back-end": "Legacy Back End Certification", - "Legacy Data Visualization": "Legacy Data Visualization", - "legacy-data-visualization": "Legacy Data Visualization Certification", - "Legacy Information Security and Quality Assurance": "Legacy Information Security and Quality Assurance", - "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance Certification", - "Legacy Full Stack Certification": "Legacy Full Stack Certification", - "Legacy Full Stack": "Legacy Full Stack", - "full-stack": "Legacy Full Stack Certification" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/espanol/intro.json b/client/i18n/locales/espanol/intro.json index 6bfdf0611d1917..6122c2e8a6f69f 100644 --- a/client/i18n/locales/espanol/intro.json +++ b/client/i18n/locales/espanol/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "Algoritmos de JavaScript y Estructuras de Datos (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Los desarrolladores usan HTML y CSS para controlar el contenido y estilo de una página. También usan JavaScript para hacer interactiva la página.", "En esta certificación de Algoritmos de JavaScript y Estructura de Datos, aprenderas los fundamentos de JavaScript, como variables, arreglos, objetos, bucles, funciones, DOM y mucho más.", @@ -584,10 +584,6 @@ "Ahora que has aprendido a trabajar con las tecnologías D3, APIs y AJAX, pon a prueba tus habilidades con estos 5 proyectos de visualización de datos.", "En estos proyectos, necesitarás obtener datos y analizar un conjunto de datos y después usar D3 para crear diferentes visualizaciones de datos. Termínalos todos para obtener tu certificación de visualización de datos." ] - }, - "d3-dashboard": { - "title": "Panel D3", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Computación Científica con Python (Beta)", + "title": "Scientific Computing with Python", "intro": [ - "La computación científica con Python (Beta) currículum te equipará con habilidades para analizar y manipular datos usando Python, un poderoso y versátil lenguaje de programación. Aprenderas conceptos clave como la estructura de datos, algoritmos, programación orientada a objetos y como hacer calculos complejos usando una variedad de herramientas.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "Este curso guia te guiará hacia los fundamentos de la computación cientifica, incluyendo las estructuras de datos y algoritmos." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "Preparación de Entrevistas de Programación", "intro": [ "Si está buscando ejercicios gratuitos de programación para prepararse para tu próxima entrevista de trabajo, aquí los tenemos.", - "Esta sección contiene cientos de desafíos de programación que prueban su conocimiento de algoritmos, estructuras de datos y matemáticas. También tiene una serie de proyectos para llevarse a casa que puede utilizar para fortalecer sus habilidades, o añadir a su portafolio." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "El Proyecto Euler y el Proyecto Roseta de Codigo han sido trasladados a sus propio cursos. Volviendo al plan de estudio podemos ver la lista de cursos que nosotros ofrecemos.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "El proyecto Odin - Free CodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "El Proyecto Odin fue creado en 2013 por un solitario desarrollador, Erik Trautman. A través de los años, ha surgido una comunidad de código abierto para mantener y ampliar el proyecto.", "freeCodeCamp ha ampliado el plan de estudios para el código abierto y hacer que se ejecute de forma interactiva en el navegador, con pruebas para evaluar tu código y garantizar que hayas comprendido los conceptos clave.", @@ -1392,23 +1389,8 @@ } } }, - "upcoming-python": { - "title": "Próximamente Python", - "intro": ["marcador"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Aprende Python construyendo un juego de Blackjack", - "intro": ["Aprende Python.", ""] - }, - "upcoming-python-project": { - "title": "Próximo Proyecto Python", - "intro": ["marcador"] - } - } - }, "a2-english-for-developers": { "title": "Ingles A2 para Desarrolladores (Beta)", - "note": "Esta certificación está actualmente en desarrollo activo. Aunque no hay una certificación reclamable disponible en este momento para esta sección, estará disponible una pronto. Mientras tanto, eres bienvenido a explorar los cursos que hemos creado nosotros a continuación.", "intro": [ "En este plan de estudios de inglés para desarrolladores, aprenderá los conceptos básicos de la comunicación en inglés. Esto seguirá el nivel A2 del Marco Común Europeo de Referencia (MCER). Y nos hemos centrado en vocabulario que es particularmente útil para los desarrolladores.", "La primera mitad del plan de estudios te ayudará a sentirte cómodo con la gramática y el uso del inglés. Te brindará toneladas de práctica en tus manos. Aprenderá conceptos básicos de como presentarse, entablar una pequeña charla y discutir sobre tu trabajo.", @@ -1588,32 +1570,48 @@ }, "b1-english-for-developers": { "title": "B1 Inglés para desarrolladores (Beta)", - "note": "Esta certificación está actualmente en desarrollo activo. Aunque por el momento no hay una certificación reclamable disponible para esta sección, pronto habrá una disponible. Mientras tanto, le invitamos a explorar los cursos que hemos creado a continuación.", - "intro": ["Introducción con marcador de posición"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Aprende a describir lugares y acontecimientos", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Aprende a hablar de experiencias pasadas", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Aprende a hablar de actividades pasadas", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Aprende el presente perfecto hablando de accesibilidad", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Aprende a planificar eventos futuros", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Aprende el futuro continuo describiendo acciones", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Aprende a utilizar los condicionales", @@ -1710,15 +1708,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1732,37 +1803,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1781,7 +1852,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1793,8 +1864,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1813,7 +1883,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1826,13 +1896,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1843,50 +1915,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1903,19 +1978,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1933,7 +2008,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1945,20 +2022,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1970,27 +2048,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2005,19 +2087,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2036,13 +2118,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2061,36 +2144,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2099,59 +2184,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2164,7 +2248,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2177,45 +2261,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2228,85 +2310,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2318,25 +2404,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2349,26 +2436,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2380,25 +2468,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2408,46 +2497,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2460,76 +2556,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2542,25 +2648,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2572,65 +2677,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2643,55 +2748,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2701,152 +2812,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2864,74 +3019,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2940,91 +3106,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3035,155 +3230,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3192,118 +3362,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "muyw": { - "title": "266", - "intro": [] - }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3312,61 +3483,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3384,145 +3572,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3530,12 +3592,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3553,10 +3615,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3581,11 +3643,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3598,15 +3660,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3658,8 +3720,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3675,10 +3737,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3702,18 +3764,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3722,17 +3900,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3762,6 +3936,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/espanol/links.json b/client/i18n/locales/espanol/links.json index 13494826ab977e..142cd853f8a53d 100644 --- a/client/i18n/locales/espanol/links.json +++ b/client/i18n/locales/espanol/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/espanol/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/espanol/news/acerca-de-freecodecamp-preguntas-frecuentes/", diff --git a/client/i18n/locales/espanol/translations.json b/client/i18n/locales/espanol/translations.json index a326085c33fb14..81bb0254095fcb 100644 --- a/client/i18n/locales/espanol/translations.json +++ b/client/i18n/locales/espanol/translations.json @@ -106,7 +106,10 @@ "donate-now": "Donar ahora", "confirm-amount": "Confirmar cantidad", "play-scene": "Presiona Play", - "closed-caption": "Subtítulos cerrados" + "closed-caption": "Subtítulos cerrados", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Aprende a programar gratis.", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "Consigue certificaciones profesionales gratis:", "interview-prep-heading": "Prepárate para la búsqueda de empleo en la entrevista de desarrollador:", "legacy-curriculum-heading": "Explora nuestro Plan de Estudios Legado:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Próximo plan de estudio:", "faq": "Preguntas frecuentes:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "Esto agrega un placentero sonido de guitarra acústica en todo el sitio web. Obtendrás reacciones musicales a medida que escribas en el editor, completes desafíos, obtengas certificados y mucho más.", "sound-volume": "Volumen de fogata:", "scrollbar-width": "Ancho de la barra de desplazamiento", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Dentro de un desafío, pulse ESC seguido del signo de interrogación para mostrar una lista de atajos disponibles.", "username": { "contains invalid characters": "El nombre de usuario \"{{username}}\" contiene caracteres inválidos", @@ -346,13 +353,14 @@ "donated": "Donado a la comunidad", "projects": "Proyectos", "stats": "Estadísticas", + "activity": "Activity", "timeline": "Cronología", "none-completed": "Aún no se han completado desafíos.", "get-started": "Empieza aquí.", "challenge": "Desafío", "completed": "Completado", "add-linkedin": "Agregar esta certificación a mi perfil de LinkedIn", - "add-twitter": "Compartir esta certificación en Twitter", + "add-twitter": "Share this certification on X", "tweet": "¡Acabo de obtener la certificación {{certTitle}} @freeCodeCamp! Compruébalo aquí: {{certURL}}", "avatar": "Avatar de {{username}}", "joined": "Se unió {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}} punto en {{date}}", "points_plural": "{{count}} puntos en {{date}}", "page-number": "{{pageNumber}} de {{totalPages}}", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp es una organización 501(c)(3) exenta de impuestos y sin fines de lucro respaldada por donaciones (Número de Identificación Tributaria Federal de los Estados Unidos: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Asignaciones", "question": "Pregunta", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "Enlace a la solución", "source-code-link": "Enlace al código fuente", @@ -501,7 +512,9 @@ "complete-both-steps": "Completa los dos pasos a continuación para terminar el desafío.", "runs-in-vm": "El proyecto se ejecuta en una máquina virtual, completa las historias de usuario descritas en ella y consigue que todas las pruebas pasen hasta el paso 1.", "completed": "Completado", + "not-completed": "Not completed", "not-started": "Sin iniciar", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Prueba", "sorry-try-again": "Lo sentimos, tu código no pasa. Inténtalo de nuevo.", "sorry-keep-trying": "Lo sentimos, tu código no pasa. Continúa intentándolo.", @@ -583,6 +596,7 @@ "redirecting": "Redirigiendo...", "thanks": "Gracias por donar", "thank-you": "Gracias por Empezar a ser un Apoyo", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Tu tarjeta ha sido actualizada correctamente.", "additional": "Puede hacer una donación adicional única de cualquier monto utilizando este enlace: <0>{{url}}", "help-more": "Que Nuestra Caridad Haga Más Contigo", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Dona ahora para ayudarnos a desarrollar certificaciones profesionales gratuitas para todos.", "help-us-reach-20k": "Dona ahora para ayudar a que nuestra caridad logre nuestra meta de 20 000 colaboradores mensuales este año.", "beta-certification": "Esta certificación es recientemente en beta. Por favor considere donar para apoyar la compleción de su desarollo.", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Ayúdenos a desarollar certificados de programación profesional gratis para todos.", "nicely-done": "Bien hecho. Acabas de completar {{block}}.", "credit-card": "Tarjeta de crédito", @@ -683,7 +701,7 @@ "bear-progress-alt": "Illustración de un oso teddy adorable con una expressión de mendigo agarrando una alcancía vacía.", "bear-completion-alt": "Illustración de un oso teddy adorable agarrando un gran troféo.", "flying-bear": "Illustración de un oso adorable vestido con una gorra de graduación y volando con una medalla de apoyo.", - "crucial-contribution": "Tu contribución será crucial en crear recursos que les dará poder a millones de personas a aprender nuevas herramientas y apoyar a sus familias.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Beneficios de volverse un Colaborador:", "support-benefits-1": "No más interrupciones de donación", "support-benefits-2": "Obtendrás una medalla de Colaborador", @@ -710,6 +728,8 @@ "help-millions-learn": "Ayuda a millones de personas a aprender", "reach-goals-faster": "Alcanza tus metas más rápido", "remove-distractions": "Eliminar distracciones", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "Este es un anuncio animado de 20 segundos para animar a los campistas a convertirse en seguidores de freeCodeCamp. La animación comienza con un oso de téd que se convierte en un soporte. Como resultado, desaparecen los pop-ups de distracción y el oso llega a completar todas sus metas. Luego, se gradua y se convierte en un superhéroe educativo que ayuda a la gente de todo el mundo.", "animation-countdown": "Esta animación se detendrá después de {{secondesRemaining}} segundos." }, @@ -741,6 +761,7 @@ "result-list": "Resultados de búsqueda" }, "misc": { + "coming-soon": "Coming Soon", "offline": "Parece que no estás conectado, es posible que tu progreso no se guarde", "server-offline": "No se pudo acceder al servidor y es posible que tu progreso no se guarde. Ponte en contacto con <0>soporte si este mensaje persiste", "unsubscribed": "Haz cancelado tu subscripción exitosamente", @@ -852,7 +873,7 @@ "expired-link": "Parece que el enlace en el que hiciste clic ha expirado, solicita un enlace nuevo para iniciar sesión", "signin-success": "¡Éxito! Has iniciado sesión en tu cuenta. ¡Feliz día programando!", "social-auth-gone": "Nos estamos alejando de la autenticación social por razones de privacidad. La próxima vez, te recomendamos que utilices tu dirección de correo electrónico: {{email}} para iniciar sesión.", - "name-needed": "Necesitamos tu nombre para poder incluirlo en tu certificación. Agrega tu nombre a los ajustes de tu cuenta y haz clic en el botón Guardar. Entonces podremos emitir tu certificación.", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "Parece que no has completado los pasos necesarios. Por favor, completa los proyectos requeridos para reclamar la certificación {{name}}.", "already-claimed": "Parece que ya has reclamado la certificación {{name}}", "cert-claim-success": "¡@{{username}}, has reclamado con éxito la certificación {{name}}! ¡Felicitaciones en nombre del equipo de freeCodeCamp.org!", @@ -891,6 +912,7 @@ "invalid-update-flag": "Estás intentando acceder a recursos prohibidos. Por favor, solicita asistencia en https://forum.freecodecamp.org si es una solicitud válida.", "generate-exam-error": "Un error ocurrió intentando generar tu examen.", "cert-not-found": "La certificación {{certSlug}} no existe.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Por favor incluye un URL de transcripción de Microsoft en la solicitud.", @@ -951,6 +973,8 @@ "issued": "Emitido", "fulltext": "<0>Se certifica que <1>{{user}} <2>ha completado exitosamente la <3>{{title}} <4>Certificación de Desarrollador en {{time}} <5>que representa aproximadamente {{completionTime}} horas de trabajo en el curso", "fulltextNoHours": "<0>La presente certifica que <1>{{user}} <2>completó con éxito la <3>{{title}} <4>Certificación de desarrollador/a en {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "Como parte de esta certificación Legacy Full Stack, {{user}} completó las siguientes certificaciones:", "heading-exam": "Como parte de está certificación, {{user}} aprobó el examén de seguimiento: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Diseño Web Responsivo", - "responsive-web-design": "Certificado de Diseño Web Responsivo", - "JavaScript Algorithms and Data Structures": "Algoritmos para JavaScript y Estructuras de Datos", - "javascript-algorithms-and-data-structures": "Certifiación en Algortimos de JavaScript y Estructuras de Datos", - "javascript-algorithms-and-data-structures-v8": "Certificación Algoritmos de JavaScript y Estructuras de Datos (Beta)", - "Front End Development Libraries": "Librerías de desarrollo Front End", - "front-end-development-libraries": "Certificación en Librerías de Desarrollo Front End", - "Data Visualization": "Visualización de Datos", - "data-visualization": "Certificación en Visualización de Datos", - "Relational Database": "Bases de Datos Relacionales", - "relational-database-v8": "Certificación en Base de Datos Relacionales", - "Back End Development and APIs": "Desarrollo Back End y Proyectos APIs", - "back-end-development-and-apis": "Certificado de Desarrollo Back End y APIs", - "Quality Assurance": "Control de Calidad", - "quality-assurance-v7": "Certificado de Control de Calidad", - "Scientific Computing with Python": "Certificado de Computación Científica con Python", - "scientific-computing-with-python-v7": "Certificado de Computación Científica con Python", - "Data Analysis with Python": "Análisis de Datos con Python", - "data-analysis-with-python-v7": "Certificado de Análisis de Datos con Python", - "Information Security": "Seguridad informática", - "information-security-v7": "Certificación de seguridad de la información", - "Machine Learning with Python": "Certificado de Machine Learning con Python", - "machine-learning-with-python-v7": "Certificado de Machine Learning con Python", - "College Algebra with Python": "Algebra universitaria con Python", - "college-algebra-with-python-v8": "Algebra universitaria con certificación Python", - "Foundational C# with Microsoft": "C# básico con Microsoft", - "foundational-c-sharp-with-microsoft": "C# básico con certificación de Microsoft", - "A2 English for Developers": "Aprende Inglés A2 para Desarolladores", - "a2-english-for-developers": "Inglés A2 para Certificación de Desarrolladores", - "B1 English for Developers": "B1 Inglés para desarrolladores", - "b1-english-for-developers": "Certificación B1 de inglés para desarrolladores", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "Legacy Front End", - "legacy-front-end": "Certificación Legacy Front End", - "Legacy Back End": "Legacy Back End", - "legacy-back-end": "Certificación Legacy Back End", - "Legacy Data Visualization": "Visualización de Datos", - "legacy-data-visualization": "Certificación Legacy Data Visualization", - "Legacy Information Security and Quality Assurance": "Certificado de Información de Legado y Control de Calidad", - "information-security-and-quality-assurance": "Certificación Legacy Information Security y Quality Assurance", - "Legacy Full Stack Certification": "Certificado de Legacy Full Stack", - "Legacy Full Stack": "Legacy Full Stack", - "full-stack": "Certificación Legacy Full Stack" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/german/intro.json b/client/i18n/locales/german/intro.json index 2c20f172d77cc4..953017dc621db7 100644 --- a/client/i18n/locales/german/intro.json +++ b/client/i18n/locales/german/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript Algorithms and Data Structures (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Developers use HTML and CSS to control the content and styling of a page. And they use JavaScript to make that page interactive.", "In this JavaScript Algorithm and Data Structures Certification, you'll learn the JavaScript fundamentals like variables, arrays, objects, loops, functions, the DOM and more.", @@ -584,10 +584,6 @@ "Jetzt, wo du gelernt hast, wie man mit D3, APIs und AJAX-Technologien arbeitet, kannst du deine Fähigkeiten mit diesen 5 Datenvisualisierungsprojekten auf die Probe stellen.", "In diesen Projekten musst du Daten abrufen und einen Datensatz parsen und dann D3 verwenden, um verschiedene Datenvisualisierungen zu erstellen. Beende sie alle, um deine Datenvisualisierungs-Zertifizierung zu erhalten." ] - }, - "d3-dashboard": { - "title": "D3 Dashboard", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Scientific Computing with Python (Beta)", + "title": "Scientific Computing with Python", "intro": [ - "The Scientific Computing with Python (Beta) curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "This comprehensive course will guide you through the fundamentals of scientific computing, including data structures, and algorithms." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "Vorbereitung auf Bewerbungsgespräche", "intro": [ "Wenn du nach kostenlosen Coding-Übungen suchst, um dich auf dein nächstes Vorstellungsgespräch vorzubereiten, haben wir das Richtige für dich.", - "Dieser Bereich enthält hunderte von Coding Challenges, die dein Wissen über Algorithmen, Datenstrukturen und Mathematik testen. Es gibt auch eine Reihe von Projekten, die du mit nach Hause nehmen kannst, um deine Fähigkeiten zu stärken oder dein Portfolio zu erweitern." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "The Project Euler Project and Rosetta Code have been moved to their own courses. Go back to the curriculum to see the list of courses we offer.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project was created in 2013 by a lone developer, Erik Trautman. Over the years, an open source community has sprung up to maintain and expand the project.", "freeCodeCamp has expanded upon the open source curriculum to make it run interactively in the browser, with tests to evaluate your code and ensure you've understood key concepts.", @@ -1390,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Upcoming Python", - "intro": ["placeholder"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Learn Python by Building a Blackjack Game", - "intro": ["Learn Python.", ""] - }, - "upcoming-python-project": { - "title": "Upcoming Python Project", - "intro": ["placeholder"] - } - } - }, "a2-english-for-developers": { "title": "A2 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", "intro": [ "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the A2 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", "The first half of the curriculum will help you get comfortable with English grammar and usage. It will give you tons of hands-on practice. You'll learn basics like introducing yourself, making small talk, and discussing your work.", @@ -1586,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1708,15 +1706,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1730,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1779,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1791,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1811,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1824,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1841,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1901,19 +1976,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1931,7 +2006,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1943,20 +2020,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1968,27 +2046,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2003,19 +2085,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2034,13 +2116,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2059,36 +2142,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2097,59 +2182,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2162,7 +2246,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2175,45 +2259,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2226,85 +2308,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2316,25 +2402,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2347,26 +2434,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2378,25 +2466,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2406,46 +2495,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2458,76 +2554,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2540,25 +2646,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2570,65 +2675,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2641,55 +2746,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2699,152 +2810,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2862,74 +3017,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2938,91 +3104,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3033,155 +3228,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3190,118 +3360,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] - }, - "muyw": { - "title": "266", - "intro": [] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3310,61 +3481,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3382,145 +3570,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3528,12 +3590,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3551,10 +3613,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3579,11 +3641,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3596,15 +3658,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3656,8 +3718,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3673,10 +3735,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3700,18 +3762,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3720,17 +3898,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3760,6 +3934,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/german/links.json b/client/i18n/locales/german/links.json index dfc5c1a14b56b4..865c55e732e8d3 100644 --- a/client/i18n/locales/german/links.json +++ b/client/i18n/locales/german/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/german/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/german/translations.json b/client/i18n/locales/german/translations.json index 952ca7cca11657..80f3102227c8e4 100644 --- a/client/i18n/locales/german/translations.json +++ b/client/i18n/locales/german/translations.json @@ -106,7 +106,10 @@ "donate-now": "Donate Now", "confirm-amount": "Confirm amount", "play-scene": "Press Play", - "closed-caption": "Closed caption" + "closed-caption": "Closed caption", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Lerne zu programmieren — kostenlos.", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "Earn free professional certifications:", "interview-prep-heading": "Prepare for the developer interview job search:", "legacy-curriculum-heading": "Explore our Legacy Curriculum:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Upcoming curriculum:", "faq": "Frequently asked questions:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "Das sorgt für den angenehmen Klang der Akustikgitarre auf der gesamten Website. Du bekommst musikalisches Feedback, wenn du im Editor tippst, Aufgaben löst, Zertifizierungen beantragst und vieles mehr.", "sound-volume": "Lautstärke Lagerfeuer-Modus:", "scrollbar-width": "Editor Scrollbar Width", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Within a challenge, press ESC followed by the question mark to show a list of available shortcuts.", "username": { "contains invalid characters": "Der Benutzername \"{{username}}\" enthält ungültige Zeichen", @@ -346,13 +353,14 @@ "donated": "Donated to the community", "projects": "Projects", "stats": "Stats", + "activity": "Activity", "timeline": "Zeitleiste", "none-completed": "Es wurden noch keine Herausforderungen abgeschlossen.", "get-started": "Hier geht es los.", "challenge": "Herausforderung", "completed": "Abgeschlossen", "add-linkedin": "Dieses Zertifikat meinem LinkedIn-Profil hinzufügen", - "add-twitter": "Zertifikat auf Twitter teilen", + "add-twitter": "Share this certification on X", "tweet": "Ich habe mir gerade die {{certTitle}} -Zertifizierung @freeCodeCamp verdient! Hier kannst du es anschauen: {{certURL}}", "avatar": "Avatar von {{username}}", "joined": "{{date}} beigetreten", @@ -361,7 +369,9 @@ "points": "{{count}} Punkt am {{date}}", "points_plural": "{{count}} Punkte am {{date}}", "page-number": "{{pageNumber}} von {{totalPages}}", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charitable organization (United States Federal Tax Identification Number: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Assignments", "question": "Question", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "Lösungs-Link", "source-code-link": "Source Code Link", @@ -501,7 +512,9 @@ "complete-both-steps": "Schließe beide Schritte unten ab, um die Aufgabe zu beenden.", "runs-in-vm": "Das Projekt läuft in einer virtuellen Maschine. Vervollständige die dort beschriebenen User Stories und bestehe alle Tests, um Schritt 1 abzuschließen.", "completed": "Abgeschlossen", + "not-completed": "Not completed", "not-started": "Nicht gestartet", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Test", "sorry-try-again": "Tut mir leid, dein Code funktioniert nicht. Versuche es noch einmal.", "sorry-keep-trying": "Tut mir leid, dein Code funktioniert nicht. Versuche es weiter.", @@ -583,6 +596,7 @@ "redirecting": "Weiterleiten...", "thanks": "Thanks for donating", "thank-you": "Thank You for Being a Supporter", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Your card has been updated successfully.", "additional": "Du kannst eine zusätzliche einmalige Spende in beliebiger Höhe über diesen Link tätigen: <0>{{url}}", "help-more": "Help Our Charity Do More", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Donate now to help us develop free professional programming certifications for all.", "help-us-reach-20k": "Donate now to help our charity reach our goal of 20,000 monthly supporters this year.", "beta-certification": "This certification is currently in beta. Please consider donating to support the completion of its development.", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Help us develop free professional programming certifications for all.", "nicely-done": "Großartig. Du hast soeben {{block}} abgeschlossen.", "credit-card": "Kreditkarte", @@ -683,7 +701,7 @@ "bear-progress-alt": "Illustration of an adorable teddy bear with a pleading expression holding an empty money jar.", "bear-completion-alt": "Illustration of an adorable teddy bear holding a large trophy.", "flying-bear": "Illustration of an adorable teddy bear wearing a graduation cap and flying with a Supporter badge.", - "crucial-contribution": "Your contribution will be crucial in creating resources that empower millions of people to learn new skills and support their families.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Benefits from becoming a Supporter:", "support-benefits-1": "No more donation prompt popups", "support-benefits-2": "You'll get a Supporter badge", @@ -710,6 +728,8 @@ "help-millions-learn": "Help millions of people learn", "reach-goals-faster": "Reach your goals faster", "remove-distractions": "Remove distractions", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "This is a 20 second animated advertisement to encourage campers to become supporters of freeCodeCamp. The animation starts with a teddy bear who becomes a supporter. As a result, distracting pop-ups disappear and the bear gets to complete all of its goals. Then, it graduates and becomes an education super hero helping people around the world.", "animation-countdown": "This animation will stop after {{secondsRemaining}} seconds." }, @@ -741,6 +761,7 @@ "result-list": "Search results" }, "misc": { + "coming-soon": "Coming Soon", "offline": "Du scheinst offline zu sein, dein Fortschritt wird möglicherweise nicht gespeichert", "server-offline": "Der Server konnte nicht erreicht werden und dein Fortschritt wird möglicherweise nicht gespeichert. Bitte wende dich an den <0>Support, wenn diese Meldung weiterhin erscheint", "unsubscribed": "Du wurdest erfolgreich abgemeldet", @@ -852,7 +873,7 @@ "expired-link": "Es sieht so aus, als ob der Link, den du geklickt hast, abgelaufen wäre. Bitte fordere einen neuen Link an, um dich anzumelden.", "signin-success": "Geschafft! Du hast dich in deinem Konto angemeldet. Viel Spaß beim Programmieren!", "social-auth-gone": "Aus Gründen des Datenschutzes verabschieden wir uns von der sozialen Authentifizierung. Beim nächsten Mal empfehlen wir, deine E-Mail-Adresse zu verwenden: {{email}}, um sich stattdessen anzumelden.", - "name-needed": "Wir benötigen deinen Namen, damit wir ihn auf deinem Zertifikat eintragen können. Füge deinen Namen zu deinen Kontoeinstellungen hinzu und klicke auf den Speichern-Button. Dann können wir dein Zertifikat ausstellen.", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "Es sieht so aus, als hättest du die notwendigen Schritte nicht abgeschlossen. Bitte vervollständige die erforderlichen Projekte, um die {{name}} Zertifizierung zu erhalten.", "already-claimed": "Es sieht so aus, als hättest du bereits die {{name}} Zertifizierung erhalten", "cert-claim-success": "@{{username}}, du hast erfolgreich die {{name}} Zertifizierung bestanden! Herzlichen Glückwunsch im Namen des freeCodeCamp.org Teams!", @@ -891,6 +912,7 @@ "invalid-update-flag": "Du versuchst, auf verbotene Ressourcen zuzugreifen. Bitte fordere unter https://forum.freecodecamp.org Unterstützung an, wenn dies eine gültige Anfrage ist.", "generate-exam-error": "An error occurred trying to generate your exam.", "cert-not-found": "The certification {{certSlug}} does not exist.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Please include a Microsoft transcript URL in the request.", @@ -951,6 +973,8 @@ "issued": "Ausgestellt", "fulltext": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}} <5>representing approximately {{completionTime}} hours of work", "fulltextNoHours": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "Im Rahmen dieser Legacy-Full-Stack-Zertifizierung hat {{user}} folgende Zertifikate abgeschlossen:", "heading-exam": "As part of this certification, {{user}} passed the following exam: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Responsive Web Design", - "responsive-web-design": "Responsive Web Design Certification", - "JavaScript Algorithms and Data Structures": "Legacy JavaScript Algorithms and Data Structures", - "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures Certification", - "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures (Beta) Certification", - "Front End Development Libraries": "Front End Development Libraries", - "front-end-development-libraries": "Front End Development Libraries Certification", - "Data Visualization": "Data Visualization", - "data-visualization": "Data Visualization Certification", - "Relational Database": "Relational Database", - "relational-database-v8": "Relational Database Certification", - "Back End Development and APIs": "Back End Development and APIs", - "back-end-development-and-apis": "Back End Development and APIs Certification", - "Quality Assurance": "Quality Assurance", - "quality-assurance-v7": "Quality Assurance Certification", - "Scientific Computing with Python": "Scientific Computing with Python", - "scientific-computing-with-python-v7": "Scientific Computing with Python Certification", - "Data Analysis with Python": "Data Analysis with Python", - "data-analysis-with-python-v7": "Data Analysis with Python Certification", - "Information Security": "Information Security", - "information-security-v7": "Information Security Certification", - "Machine Learning with Python": "Machine Learning with Python", - "machine-learning-with-python-v7": "Machine Learning with Python Certification", - "College Algebra with Python": "College Algebra with Python", - "college-algebra-with-python-v8": "College Algebra with Python Certification", - "Foundational C# with Microsoft": "Foundational C# with Microsoft", - "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft Certification", - "A2 English for Developers": "A2 English for Developers", - "a2-english-for-developers": "A2 English for Developers Certification", - "B1 English for Developers": "B1 English for Developers", - "b1-english-for-developers": "B1 English for Developers Certification", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "Legacy Front End", - "legacy-front-end": "Legacy Front End Certification", - "Legacy Back End": "Legacy Back End", - "legacy-back-end": "Legacy Back End Certification", - "Legacy Data Visualization": "Legacy Data Visualization", - "legacy-data-visualization": "Legacy Data Visualization Certification", - "Legacy Information Security and Quality Assurance": "Legacy Information Security and Quality Assurance", - "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance Certification", - "Legacy Full Stack Certification": "Legacy Full Stack Certification", - "Legacy Full Stack": "Legacy Full Stack", - "full-stack": "Legacy Full Stack Certification" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/italian/intro.json b/client/i18n/locales/italian/intro.json index 69bbe612cddc52..deeadb8abdb216 100644 --- a/client/i18n/locales/italian/intro.json +++ b/client/i18n/locales/italian/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript Algorithms and Data Structures (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Developers use HTML and CSS to control the content and styling of a page. And they use JavaScript to make that page interactive.", "Nella certificazione JavaScript Algoritmi e Strutture di Dati, imparerai i fondamenti di JavaScript come variabili, array, oggetti, loop, funzioni, il DOM e altro ancora.", @@ -584,10 +584,6 @@ "Ora che hai imparato a lavorare con le tecnologie D3, API e AJAX, mettete alla prova le tue abilità con questi 5 progetti di visualizzazione dei dati.", "In questi progetti, è necessario recuperare i dati e analizzare un dataset, quindi utilizzare D3 per creare diverse visualizzazioni. Terminali tutti per ottenere la certificazione Visualizzazione dei Dati." ] - }, - "d3-dashboard": { - "title": "Dashboard D3", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Scientific Computing with Python (Beta)", + "title": "Scientific Computing with Python", "intro": [ - "The Scientific Computing with Python (Beta) curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "This comprehensive course will guide you through the fundamentals of scientific computing, including data structures, and algorithms." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "Preparazione per il colloquio di lavoro per programmatori", "intro": [ "Se stai cercando esercizi di programmazione gratuiti per prepararti al tuo prossimo colloquio di lavoro, sei nel posto giusto.", - "Questa sezione contiene centinaia di sfide di programmazione che testano la tua conoscenza di algoritmi, strutture di dati e matematica. Ha anche una serie di progetti pronti da portare a casa che puoi utilizzare per rafforzare le tue competenze, o aggiungere al tuo porfolio." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "The Project Euler Project and Rosetta Code have been moved to their own courses. Go back to the curriculum to see the list of courses we offer.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project was created in 2013 by a lone developer, Erik Trautman. Over the years, an open source community has sprung up to maintain and expand the project.", "freeCodeCamp has expanded upon the open source curriculum to make it run interactively in the browser, with tests to evaluate your code and ensure you've understood key concepts.", @@ -1390,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Upcoming Python", - "intro": ["placeholder"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Learn Python by Building a Blackjack Game", - "intro": ["Learn Python.", ""] - }, - "upcoming-python-project": { - "title": "Upcoming Python Project", - "intro": ["placeholder"] - } - } - }, "a2-english-for-developers": { "title": "A2 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", "intro": [ "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the A2 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", "The first half of the curriculum will help you get comfortable with English grammar and usage. It will give you tons of hands-on practice. You'll learn basics like introducing yourself, making small talk, and discussing your work.", @@ -1586,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1708,15 +1706,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1730,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1779,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1791,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1811,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1824,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1841,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1901,19 +1976,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1931,7 +2006,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1943,20 +2020,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1968,27 +2046,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2003,19 +2085,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2034,13 +2116,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2059,36 +2142,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2097,59 +2182,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2162,7 +2246,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2175,45 +2259,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2226,85 +2308,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2316,25 +2402,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2347,26 +2434,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2378,25 +2466,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2406,46 +2495,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2458,76 +2554,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2540,25 +2646,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2570,65 +2675,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2641,55 +2746,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2699,152 +2810,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2862,74 +3017,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2938,91 +3104,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3033,155 +3228,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3190,118 +3360,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] - }, - "muyw": { - "title": "266", - "intro": [] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3310,61 +3481,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3382,145 +3570,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3528,12 +3590,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3551,10 +3613,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3579,11 +3641,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3596,15 +3658,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3656,8 +3718,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3673,10 +3735,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3700,18 +3762,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3720,17 +3898,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3760,6 +3934,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/italian/links.json b/client/i18n/locales/italian/links.json index 98dcf1d05ba3ec..b135808600db09 100644 --- a/client/i18n/locales/italian/links.json +++ b/client/i18n/locales/italian/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/italian/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/italian/translations.json b/client/i18n/locales/italian/translations.json index 08e559b1737fb9..e7c7719ecfef1f 100644 --- a/client/i18n/locales/italian/translations.json +++ b/client/i18n/locales/italian/translations.json @@ -106,7 +106,10 @@ "donate-now": "Donate Now", "confirm-amount": "Confirm amount", "play-scene": "Press Play", - "closed-caption": "Closed caption" + "closed-caption": "Closed caption", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Impara a programmare — gratis.", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "Ottieni certificazioni professionali gratuite:", "interview-prep-heading": "Preparati per la ricerca di colloqui di lavoro da sviluppatore:", "legacy-curriculum-heading": "Explore our Legacy Curriculum:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Upcoming curriculum:", "faq": "Domande frequenti:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "Questo aggiunge i piacevoli suoni di una chitarra acustica nel sito. Suonerà mentre scrivi nell'editor, completi sfide, ottieni certificazioni, e altro.", "sound-volume": "Volume Campfire:", "scrollbar-width": "Larghezza barra di scorrimento editor", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Within a challenge, press ESC followed by the question mark to show a list of available shortcuts.", "username": { "contains invalid characters": "Il nome utente \"{{username}}\" contiene caratteri non validi", @@ -346,13 +353,14 @@ "donated": "Donated to the community", "projects": "Projects", "stats": "Stats", + "activity": "Activity", "timeline": "Timeline", "none-completed": "Nessuna sfida è stata ancora completata.", "get-started": "Inizia qui.", "challenge": "Sfida", "completed": "Completata", "add-linkedin": "Aggiungi questa certificazione al mio profilo LinkedIn", - "add-twitter": "Condividi questa certificazione su Twitter", + "add-twitter": "Share this certification on X", "tweet": "Ho appena ottenuto la {{certTitle}} @freeCodeCamp! Guarda qui: {{certURL}}", "avatar": "avatar di {{username}}", "joined": "Iscritto da {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}} punto il {{date}}", "points_plural": "{{count}} punti il {{date}}", "page-number": "{{pageNumber}} di {{totalPages}}", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charitable organization (United States Federal Tax Identification Number: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Attività", "question": "Domande", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "Link alla soluzione", "source-code-link": "Source Code Link", @@ -501,7 +512,9 @@ "complete-both-steps": "Completa entrambi gli step qua sotto per finire la sfida.", "runs-in-vm": "Il progetto esegue in una macchina virtuale, completa le user story descritte lì dentro e fai passare tutti i test per finire lo step 1.", "completed": "Completato", + "not-completed": "Not completed", "not-started": "Non iniziato", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Test", "sorry-try-again": "Il tuo codice non è corretto. Riprova.", "sorry-keep-trying": "Il tuo codice non è corretto. Continua a provare.", @@ -583,6 +596,7 @@ "redirecting": "Reindirizzamento...", "thanks": "Grazie per la donazione", "thank-you": "Thank You for Being a Supporter", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Your card has been updated successfully.", "additional": "Puoi effettuare una donazione una tantum aggiuntiva di qualsiasi importo utilizzando questo link: <0>{{url}}", "help-more": "Aiuta la nostra charity a fare di più", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Dona ora per aiutarci a sviluppare certificazioni di programmazione professionale gratuite per tutti.", "help-us-reach-20k": "Donate now to help our charity reach our goal of 20,000 monthly supporters this year.", "beta-certification": "This certification is currently in beta. Please consider donating to support the completion of its development.", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Help us develop free professional programming certifications for all.", "nicely-done": "Ben fatto. Hai appena completato {{block}}.", "credit-card": "Carta di credito", @@ -683,7 +701,7 @@ "bear-progress-alt": "Illustration of an adorable teddy bear with a pleading expression holding an empty money jar.", "bear-completion-alt": "Illustration of an adorable teddy bear holding a large trophy.", "flying-bear": "Illustration of an adorable teddy bear wearing a graduation cap and flying with a Supporter badge.", - "crucial-contribution": "Your contribution will be crucial in creating resources that empower millions of people to learn new skills and support their families.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Benefits from becoming a Supporter:", "support-benefits-1": "No more donation prompt popups", "support-benefits-2": "You'll get a Supporter badge", @@ -710,6 +728,8 @@ "help-millions-learn": "Help millions of people learn", "reach-goals-faster": "Reach your goals faster", "remove-distractions": "Remove distractions", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "This is a 20 second animated advertisement to encourage campers to become supporters of freeCodeCamp. The animation starts with a teddy bear who becomes a supporter. As a result, distracting pop-ups disappear and the bear gets to complete all of its goals. Then, it graduates and becomes an education super hero helping people around the world.", "animation-countdown": "This animation will stop after {{secondsRemaining}} seconds." }, @@ -741,6 +761,7 @@ "result-list": "Search results" }, "misc": { + "coming-soon": "Coming Soon", "offline": "Sembra che tu sia offline, i tuoi progressi potrebbero non essere salvati", "server-offline": "Il server non può essere raggiunto e i tuoi progressi potrebbero non essere salvati. Contatta il <0>supporto se questo messaggio persiste", "unsubscribed": "Hai annullato correttamente l'iscrizione", @@ -852,7 +873,7 @@ "expired-link": "Sembra che il link che hai cliccato sia scaduto, ti preghiamo di richiedere un nuovo link per accedere", "signin-success": "Successo! Hai effettuato l'accesso al tuo account. Happy Coding!", "social-auth-gone": "Ci stiamo allontanando dall'autenticazione social per motivi di privacy. La prossima volta ti consigliamo di utilizzare il tuo indirizzo email: {{email}} per accedere.", - "name-needed": "Abbiamo bisogno del tuo nome per poterlo mettere sulla tua certificazione. Aggiungi il tuo nome alle impostazioni del tuo account e fai clic sul pulsante Salva. A quel punto potremo rilasciare la certificazione.", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "Sembra che tu non abbia completato i passaggi necessari. Per favore completa i progetti richiesti per richiedere la Certificazione {{name}}.", "already-claimed": "Sembra che tu abbia già richiesto la Certificazione {{name}}", "cert-claim-success": "@{{username}}, hai richiesto con successo la Certificazione {{name}} ! Congratulazioni per conto del team freeCodeCamp.org!", @@ -891,6 +912,7 @@ "invalid-update-flag": "Stai cercando di accedere a risorse proibite. Per favore richiedi assistenza su https://forum.freecodecamp.org se questa è una richiesta valida.", "generate-exam-error": "An error occurred trying to generate your exam.", "cert-not-found": "The certification {{certSlug}} does not exist.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Please include a Microsoft transcript URL in the request.", @@ -951,6 +973,8 @@ "issued": "Emesso", "fulltext": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}} <5>representing approximately {{completionTime}} hours of work", "fulltextNoHours": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "Come parte di questa vecchia certificazione Full Stack, {{user}} ha completato le seguenti certificazioni:", "heading-exam": "As part of this certification, {{user}} passed the following exam: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Web Design Responsivo", - "responsive-web-design": "Certificazione Web Design Responsivo", - "JavaScript Algorithms and Data Structures": "Legacy JavaScript Algorithms and Data Structures", - "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures Certification", - "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures (Beta) Certification", - "Front End Development Libraries": "Librerie di Sviluppo Front End", - "front-end-development-libraries": "Certificazione Librerie di Sviluppo Front End", - "Data Visualization": "Visualizzazione Dati", - "data-visualization": "Certificazione Visualizzazione Dati", - "Relational Database": "Database Relazionale", - "relational-database-v8": "Certificazione Database Relazionale", - "Back End Development and APIs": "Sviluppo Back End e API", - "back-end-development-and-apis": "Certificazione di Sviluppo Back End e API", - "Quality Assurance": "Garanzia di Qualità", - "quality-assurance-v7": "Certificazione Garanzia di Qualità", - "Scientific Computing with Python": "Calcolo Scientifico con Python", - "scientific-computing-with-python-v7": "Certificazione Calcolo Scientifico con Python", - "Data Analysis with Python": "Analisi dei Dati con Python", - "data-analysis-with-python-v7": "Certificazione Analisi dei Dati con Python", - "Information Security": "Sicurezza dell'Informazione", - "information-security-v7": "Certificazione Sicurezza dell'Informazione", - "Machine Learning with Python": "Machine Learning con Python", - "machine-learning-with-python-v7": "Certificazione Machine Learning con Python", - "College Algebra with Python": "Algebra Universitaria con Python", - "college-algebra-with-python-v8": "Certificazione di Algebra Universitaria con Python", - "Foundational C# with Microsoft": "Foundational C# with Microsoft", - "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft Certification", - "A2 English for Developers": "A2 English for Developers", - "a2-english-for-developers": "A2 English for Developers Certification", - "B1 English for Developers": "B1 English for Developers", - "b1-english-for-developers": "B1 English for Developers Certification", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "Front End Legacy", - "legacy-front-end": "Legacy Front End Certification", - "Legacy Back End": "Back End Legacy", - "legacy-back-end": "Legacy Back End Certification", - "Legacy Data Visualization": "Visualizzazione Dati Legacy", - "legacy-data-visualization": "Legacy Data Visualization Certification", - "Legacy Information Security and Quality Assurance": "Sicurezza delle Informazioni e Garanzia di Qualità Legacy", - "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance Certification", - "Legacy Full Stack Certification": "Certificazione Full Stack Legacy", - "Legacy Full Stack": "Full Stack Legacy", - "full-stack": "Legacy Full Stack Certification" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/japanese/intro.json b/client/i18n/locales/japanese/intro.json index eeccc7d6b794c7..563ca4e0346663 100644 --- a/client/i18n/locales/japanese/intro.json +++ b/client/i18n/locales/japanese/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript アルゴリズムとデータ構造 (ベータ版)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Developers use HTML and CSS to control the content and styling of a page. And they use JavaScript to make that page interactive.", "In this JavaScript Algorithm and Data Structures Certification, you'll learn the JavaScript fundamentals like variables, arrays, objects, loops, functions, the DOM and more.", @@ -584,10 +584,6 @@ "D3、API、そして AJAX 技術を扱う方法を学習したので、下記 5 つのデータ可視化プロジェクトで技能をテストしましょう。", "これらのプロジェクトでは、データを取得し、解析し、D3 を使用して様々なデータ可視化を作成します。これらすべてを完成させ、データ可視化認定証を取得しましょう。" ] - }, - "d3-dashboard": { - "title": "D3 ダッシュボード", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Python を用いた科学計算 (ベータ版)", + "title": "Scientific Computing with Python", "intro": [ - "The Scientific Computing with Python (Beta) curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "This comprehensive course will guide you through the fundamentals of scientific computing, including data structures, and algorithms." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "コーディング面接対策", "intro": [ "次回の就職面接に備えて無料のコーディング演習をお探しでしたら、こちらにご用意しています。", - "このセクションはアルゴリズム、データ構造、および数学の知識をテストする何百ものコーディングチャレンジを含んでいます。技能を向上させ、またはポートフォリオに加えるために活用できる多くの宿題プロジェクトもあります。" + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "The Project Euler Project and Rosetta Code have been moved to their own courses. Go back to the curriculum to see the list of courses we offer.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project was created in 2013 by a lone developer, Erik Trautman. Over the years, an open source community has sprung up to maintain and expand the project.", "freeCodeCamp has expanded upon the open source curriculum to make it run interactively in the browser, with tests to evaluate your code and ensure you've understood key concepts.", @@ -1390,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Upcoming Python", - "intro": ["placeholder"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Learn Python by Building a Blackjack Game", - "intro": ["Learn Python.", ""] - }, - "upcoming-python-project": { - "title": "Upcoming Python Project", - "intro": ["placeholder"] - } - } - }, "a2-english-for-developers": { "title": "A2 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", "intro": [ "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the A2 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", "The first half of the curriculum will help you get comfortable with English grammar and usage. It will give you tons of hands-on practice. You'll learn basics like introducing yourself, making small talk, and discussing your work.", @@ -1586,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1708,15 +1706,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1730,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1779,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1791,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1811,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1824,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1841,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1901,19 +1976,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1931,7 +2006,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1943,20 +2020,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1968,27 +2046,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2003,19 +2085,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2034,13 +2116,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2059,36 +2142,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2097,59 +2182,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2162,7 +2246,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2175,45 +2259,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2226,85 +2308,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2316,25 +2402,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2347,26 +2434,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2378,25 +2466,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2406,46 +2495,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2458,76 +2554,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2540,25 +2646,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2570,65 +2675,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2641,55 +2746,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2699,152 +2810,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2862,74 +3017,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2938,91 +3104,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3033,155 +3228,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3190,118 +3360,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] - }, - "muyw": { - "title": "266", - "intro": [] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3310,61 +3481,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3382,145 +3570,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3528,12 +3590,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3551,10 +3613,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3579,11 +3641,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3596,15 +3658,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3656,8 +3718,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3673,10 +3735,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3700,18 +3762,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3720,17 +3898,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3760,6 +3934,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/japanese/links.json b/client/i18n/locales/japanese/links.json index d6a4f8c8ed22dd..5a21e249ee7cea 100644 --- a/client/i18n/locales/japanese/links.json +++ b/client/i18n/locales/japanese/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/japanese/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/japanese/news/about/", diff --git a/client/i18n/locales/japanese/translations.json b/client/i18n/locales/japanese/translations.json index 4f1e0bedf60e58..f025383965576e 100644 --- a/client/i18n/locales/japanese/translations.json +++ b/client/i18n/locales/japanese/translations.json @@ -47,7 +47,7 @@ "settings": "設定", "take-me": "チャレンジに移動", "check-answer": "解答をチェック", - "submit": "提出", + "submit": "送信", "get-hint": "ヒントを見る", "ask-for-help": "質問する", "create-post": "フォーラムにヘルプ投稿を作成", @@ -106,7 +106,10 @@ "donate-now": "寄付する", "confirm-amount": "金額を選択", "play-scene": "再生", - "closed-caption": "クローズドキャプション" + "closed-caption": "クローズドキャプション", + "share-on-x": "X でシェア", + "share-on-bluesky": "Bluesky でシェア", + "share-on-threads": "Threads でシェア" }, "landing": { "big-heading-1": "プログラミングを無料で学ぶ。", @@ -147,7 +150,7 @@ }, { "title": "無償教育", - "description": "チャリティから学び、学習費用を節約しましょう。有料限定の教材や隠れたコストは一切ありません。" + "description": "当チャリティで学ぶことで、学習費用を節約できます。マンスリーサポーターの皆さんによる寄付のおかげで、全教材が無料で提供されています。" }, { "title": "幅広い認定講座", @@ -166,6 +169,8 @@ "professional-certs-heading": "プロフェッショナル認定証を無料で取得:", "interview-prep-heading": "就職活動・技術面接に備える:", "legacy-curriculum-heading": "旧カリキュラムを見る:", + "next-heading": "ベータ版カリキュラムを試す:", + "next-english-heading": "最新の英語カリキュラムを試す:", "upcoming-heading": "公開予定カリキュラム:", "faq": "よくある質問:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "これは快適なアコースティックギターの音をウェブサイトの至る所へ追加します。エディターにタイプしたり、チャレンジを完了したり、認定証を請求したり、その他いろいろなことをする度に音のフィードバックを受け取ります。", "sound-volume": "キャンプファイアモードの音量:", "scrollbar-width": "エディターのスクロールバーの幅", + "reset-editor-layout-tooltip": "エディターのレイアウトをデフォルトに戻す", + "reset-editor-layout": "エディターレイアウトをリセット", "shortcuts-explained": "チャレンジの画面で、ESC キーを押した後、? キーを押すと、利用可能なショートカットキーの一覧が表示されます。", "username": { "contains invalid characters": "ユーザー名 \"{{username}}\" に無効な文字が含まれています", @@ -346,13 +353,14 @@ "donated": "freeCodeCamp コミュニティに寄付した", "projects": "プロジェクト", "stats": "統計", + "activity": "アクティビティ", "timeline": "タイムライン", "none-completed": "完了したチャレンジがありません。", "get-started": "ここから始めましょう。", "challenge": "チャレンジ", "completed": "完了日", "add-linkedin": "この認定証を LinkedIn のプロフィールに追加", - "add-twitter": "この認定証を Twitter で共有", + "add-twitter": "この認定証を X で共有", "tweet": "{{certTitle}} の認定証を @freeCodeCamp で取得しました！確認はこちら: {{certURL}}", "avatar": "{{username}} のアバター", "joined": "加入: {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}} ポイント ({{date}})", "points_plural": "{{count}} ポイント ({{date}})", "page-number": "{{pageNumber}} / {{totalPages}}", - "edit-my-profile": "プロフィールを編集" + "edit-my-profile": "プロフィールを編集", + "add-bluesky": "この認定証を Bluesky で共有", + "add-threads": "この認定証を Threads で共有" }, "footer": { "tax-exempt-status": "freeCodeCamp は皆様からの寄付により支えられている非課税の 501(c)(3) 慈善団体です。(United States Federal Tax Identification Number: 82-0779546)", @@ -416,6 +426,7 @@ "assignments": "課題", "question": "質問", "questions": "質問", + "answered-mcq": "未回答または不正解の質問があります。", "explanation": "解説", "solution-link": "回答のリンク", "source-code-link": "ソースコードのリンク", @@ -501,7 +512,9 @@ "complete-both-steps": "チャレンジを終えるには、以下 2 つのステップを完了させてください。", "runs-in-vm": "このプロジェクトは仮想マシン内で動作します。ステップ 1 を完了するには、そこに書かれたユーザーストーリーを実装し、すべてのテストが成功するようにしてください。", "completed": "完了", + "not-completed": "未完了", "not-started": "未着手", + "steps-completed": "{{completedSteps}} / {{totalSteps}} ステップ完了", "test": "テスト", "sorry-try-again": "残念ながら、テストが通りませんでした。もう一度挑戦しましょう。", "sorry-keep-trying": "残念ながら、テストが通りませんでした。続けて挑戦しましょう。", @@ -583,6 +596,7 @@ "redirecting": "リダイレクト中...", "thanks": "寄付ありがとうございます", "thank-you": "サポーターとなってくださって、ありがとうございます。", + "thank-you-continued": "継続的なご支援ありがとうございます", "success-card-update": "カード情報が更新されました。", "additional": "任意の金額を、追加で 1 回ずつご寄付いただけるリンクはこちら: <0>{{url}}", "help-more": "当団体のチャリティー活動をご支援ください", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "寄付を通して、無料で誰もが利用できる、専門的なプログラミング認定証の開発をご支援ください。", "help-us-reach-20k": "今年中にマンスリーサポーター 2 万人を目指しています。ぜひご協力ください。", "beta-certification": "この認定講座は現在ベータ版です。開発をサポートするための寄付をご検討いただければ幸いです。", + "unfinished-certification": "こちらの認定講座は現在開発中です。認定証は後日追加予定となっており、現時点では取得できません。以下に公開済みのコースは先行してご利用いただけます。", + "consider-donating": "開発をサポートするための寄付をご検討いただければ幸いです。", + "unfinished-certification-2": "この認定講座は修了までにかなりの時間と努力が必要です。最終試験は数ヶ月後に公開予定ですが、公開後すぐ受験できるよう準備するには今取り組み始めても良いかもしれません。", + "consider-donating-2": "カリキュラムの開発をスピードアップするには、<0>当団体への寄付をご検討ください。", "help-us-develop": "無料で誰もが利用できる、専門的なプログラミング認定証の開発をご支援ください。", "nicely-done": "おめでとうございます。「{{block}}」を完了しました。", "credit-card": "クレジットカード", @@ -683,7 +701,7 @@ "bear-progress-alt": "お願いの表情で空の募金箱を持っているかわいらしいテディベアのイラスト。", "bear-completion-alt": "大きなトロフィーを持っているかわいらしいテディベアのイラスト。", "flying-bear": "卒業生の角帽をかぶったかわいらしいテディベアが、サポーターバッジを付けて空に飛んでいくイラスト。", - "crucial-contribution": "何百万もの人々が新しい技能を習得し、手に職を付けるための教材を作り続けるには、あなたの寄付が不可欠です。", + "crucial-contribution": "何百万もの人々が新しい技能を習得し、手に職を付けられるような教材を作り続けるには、あなたの寄付が不可欠です。", "support-benefits-title": "サポーターになるメリット:", "support-benefits-1": "寄付のお願いのポップアップが表示されなくなります。", "support-benefits-2": "サポーターバッジを獲得できます。", @@ -710,6 +728,8 @@ "help-millions-learn": "世界中の人々の学びをサポートできます。", "reach-goals-faster": "さらにスピーディーにゴールへと近づけます。", "remove-distractions": "気が散る要素を減らせます。", + "remove-interruptions": "中断を減らせます。", + "acquire-skills-faster": "さらにスピーディーにスキルを習得できます。", "animation-description": "これは、キャンパーに freeCodeCamp サポーターとなることを促す 20 秒間のアニメーション広告です。アニメーションの内容は、とあるテディベアがサポーターになるところから始まります。サポーターになることで、余計なポップアップ画面が表示されなくなり、テディベアは目標をスムーズに達成します。そしてついに卒業し、学問のスーパーヒーローとなって世界中の人々を助ける様子が描かれています。", "animation-countdown": "このアニメーションは {{secondsRemaining}} 秒後に終了します。" }, @@ -741,6 +761,7 @@ "result-list": "検索結果" }, "misc": { + "coming-soon": "近日公開", "offline": "オフラインのようです。進捗が保存されない可能性があります。", "server-offline": "サーバーに接続できませんでした。進捗状況が保存されなかった可能性があります。このメッセージが引き続き表示される場合は<0>サポートまでご連絡ください。", "unsubscribed": "購読解除が完了しました", @@ -780,7 +801,7 @@ "heart": "ハート", "initial": "初期状態", "input-reset": "検索キーワードをクリア", - "input-search": "Submit search terms", + "input-search": "検索キーワードを送信", "info": "導入情報", "spacer": "スペーサー", "toggle": "トグルチェックマーク", @@ -852,7 +873,7 @@ "expired-link": "クリックされたリンクは有効期限が切れているようです。サインインするには新しいリンクをリクエストしてください。", "signin-success": "成功です！アカウントにサインインしました。コーディングを楽しみましょう！", "social-auth-gone": "私たちはプライバシー上の理由のため、ソーシャル認証の使用中止を検討しています。次回は代わりにあなたのメールアドレス ({{email}}) を用いてサインインされることをお勧めします。", - "name-needed": "認定証に記載するため、あなたの名前が必要です。アカウント設定に名前を追加し、保存ボタンをクリックしてください。その後、認定証を発行することができるようになります。", + "name-needed": "認定証に記載する名前が必要です。プロフィールに名前を追加し、保存してください。その後、認定証を発行することができるようになります。", "incomplete-steps": "必要な過程が完了していないようです。{{name}} 認定証を獲得するために必修のプロジェクトを完成させてください。", "already-claimed": "あなたはすでに {{name}} 認定証を獲得しているようです。", "cert-claim-success": "@{{username}} さん、あなたは無事に {{name}} 認定証を獲得しました！freeCodeCamp.org チームを代表してお祝い申し上げます！", @@ -891,6 +912,7 @@ "invalid-update-flag": "禁止されたリソースにアクセスしようとしています。正当なリクエストの場合、https://forum.freecodecamp.org でサポートを依頼してください。", "generate-exam-error": "試験の準備中にエラーが発生しました。", "cert-not-found": "この認定証は存在しません。({{certSlug}})", + "reset-editor-layout": "エディターレイアウトがリセットされました。", "ms": { "transcript": { "link-err-1": "リクエストに Microsoft の成績証明書の URL を含めてください。", @@ -951,6 +973,8 @@ "issued": "発行日", "fulltext": "<0>{{time}} <1>{{user}} <2>が <3>{{title}} <4>開発者認定講座を修了したことを証明します。 <5>(約 {{completionTime}} 時間相当)", "fulltextNoHours": "<0>{{time}} <1>{{user}} <2>が <3>{{title}} <4>開発者認定講座を修了したことを証明します。", + "quincy-larson-signature": "Quincy Larson の署名", + "julia-liuson-signature": "Julia Liuson の署名", "project": { "heading-legacy-full-stack": "レガシーフルスタック認定講座の一環として、{{user}} は以下の認定講座を修了しました:", "heading-exam": "この認定講座の一環として、{{user}} は以下の試験に合格しました: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "レスポンシブウェブデザイン", - "responsive-web-design": "レスポンシブウェブデザイン認定証", - "JavaScript Algorithms and Data Structures": "(レガシー) JavaScript アルゴリズムとデータ構造", - "javascript-algorithms-and-data-structures": "(レガシー) JavaScript アルゴリズムとデータ構造認定証", - "javascript-algorithms-and-data-structures-v8": "JavaScript アルゴリズムとデータ構造 (ベータ版) 認定証", - "Front End Development Libraries": "フロントエンド開発ライブラリ", - "front-end-development-libraries": "フロントエンド開発ライブラリ認定証", - "Data Visualization": "データ可視化", - "data-visualization": "データ可視化認定証", - "Relational Database": "リレーショナルデータベース", - "relational-database-v8": "リレーショナルデータベース認定証", - "Back End Development and APIs": "バックエンド開発と API", - "back-end-development-and-apis": "バックエンド開発と API 認定証", - "Quality Assurance": "品質保証", - "quality-assurance-v7": "品質保証認定証", - "Scientific Computing with Python": "Python を用いた科学計算", - "scientific-computing-with-python-v7": "Python を用いた科学計算認定証", - "Data Analysis with Python": "Python を用いたデータ分析", - "data-analysis-with-python-v7": "Python を用いたデータ分析認定証", - "Information Security": "情報セキュリティ", - "information-security-v7": "情報セキュリティ認定証", - "Machine Learning with Python": "Python を用いた機械学習", - "machine-learning-with-python-v7": "Python を用いた機械学習認定証", - "College Algebra with Python": "Python を用いた代数学", - "college-algebra-with-python-v8": "Python を用いた代数学認定証", - "Foundational C# with Microsoft": "Microsoft 連携・基礎 C#", - "foundational-c-sharp-with-microsoft": "Microsoft 連携・基礎 C# 認定証", - "A2 English for Developers": "開発者のための A2 レベル英語", - "a2-english-for-developers": "開発者のための A2 レベル英語認定証", - "B1 English for Developers": "開発者のための B1 レベル英語", - "b1-english-for-developers": "開発者のための B1 レベル英語認定証", - "Full Stack Developer": "フルスタック開発者", - "full-stack-developer-v9": "認定フルスタック開発者", - "Legacy Front End": "(レガシー) フロントエンド", - "legacy-front-end": "(レガシー) フロントエンド認定証", - "Legacy Back End": "(レガシー) バックエンド", - "legacy-back-end": "(レガシー) バックエンド認定証", - "Legacy Data Visualization": "(レガシー) データ可視化", - "legacy-data-visualization": "(レガシー) データ可視化認定証", - "Legacy Information Security and Quality Assurance": "(レガシー) 情報セキュリティと品質保証", - "information-security-and-quality-assurance": "(レガシー) 情報セキュリティと品質保証認定証", - "Legacy Full Stack Certification": "(レガシー) フルスタック認定証", - "Legacy Full Stack": "(レガシー) フルスタック", - "full-stack": "(レガシー) フルスタック認定証" + "responsive-web-design": "レスポンシブウェブデザイン", + "responsive-web-design-cert": "レスポンシブウェブデザイン認定証", + "javascript-algorithms-and-data-structures": "旧 JavaScript アルゴリズムとデータ構造", + "javascript-algorithms-and-data-structures-cert": "旧 JavaScript アルゴリズムとデータ構造認定証", + "javascript-algorithms-and-data-structures-v8": "JavaScript アルゴリズムとデータ構造", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript アルゴリズムとデータ構造認定証", + "front-end-development-libraries": "フロントエンド開発ライブラリ", + "front-end-development-libraries-cert": "フロントエンド開発ライブラリ認定証", + "data-visualization": "データ可視化", + "data-visualization-cert": "データ可視化認定証", + "relational-database-v8": "リレーショナルデータベース", + "relational-database-v8-cert": "リレーショナルデータベース認定証", + "back-end-development-and-apis": "バックエンド開発と API", + "back-end-development-and-apis-cert": "バックエンド開発と API 認定証", + "quality-assurance-v7": "品質保証", + "quality-assurance-v7-cert": "品質保証認定証", + "scientific-computing-with-python-v7": "Python を用いた科学計算", + "scientific-computing-with-python-v7-cert": "Python を用いた科学計算認定証", + "data-analysis-with-python-v7": "Python を用いたデータ分析", + "data-analysis-with-python-v7-cert": "Python を用いたデータ分析認定証", + "information-security-v7": "情報セキュリティ", + "information-security-v7-cert": "情報セキュリティ認定証", + "machine-learning-with-python-v7": "Python を用いた機械学習", + "machine-learning-with-python-v7-cert": "Python を用いた機械学習認定証", + "college-algebra-with-python-v8": "Python を用いた代数学", + "college-algebra-with-python-v8-cert": "Python を用いた代数学認定証", + "foundational-c-sharp-with-microsoft": "Microsoft 連携・基礎 C#", + "foundational-c-sharp-with-microsoft-cert": "Microsoft 連携・基礎 C# 認定証", + "a2-english-for-developers": "開発者のための A2 レベル英語", + "a2-english-for-developers-cert": "開発者のための A2 レベル英語認定証", + "b1-english-for-developers": "開発者のための B1 レベル英語", + "b1-english-for-developers-cert": "開発者のための B1 レベル英語認定証", + "full-stack-developer-v9": "フルスタック開発者", + "full-stack-developer-v9-cert": "フルスタック開発者認定証", + "legacy-front-end": "旧フロントエンド", + "legacy-front-end-cert": "旧フロントエンド認定証", + "legacy-back-end": "旧バックエンド", + "legacy-back-end-cert": "旧バックエンド認定証", + "legacy-data-visualization": "旧データ可視化", + "legacy-data-visualization-cert": "旧データ可視化認定証", + "information-security-and-quality-assurance": "旧情報セキュリティと品質保証", + "information-security-and-quality-assurance-cert": "旧情報セキュリティと品質保証認定証", + "full-stack": "旧フルスタック", + "full-stack-cert": "旧フルスタック認定証" } }, "certification-card": { diff --git a/client/i18n/locales/korean/intro.json b/client/i18n/locales/korean/intro.json index 24c376eb36d1c1..fc01dcfa9519f7 100644 --- a/client/i18n/locales/korean/intro.json +++ b/client/i18n/locales/korean/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript Algorithms and Data Structures (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Developers use HTML and CSS to control the content and styling of a page. And they use JavaScript to make that page interactive.", "In this JavaScript Algorithm and Data Structures Certification, you'll learn the JavaScript fundamentals like variables, arrays, objects, loops, functions, the DOM and more.", @@ -584,10 +584,6 @@ "Now that you learned how to work with D3, APIs, and AJAX technologies, put your skills to the test with these 5 Data Visualization projects.", "In these projects, you'll need to fetch data and parse a dataset, then use D3 to create different data visualizations. Finish them all to earn your Data Visualization certification." ] - }, - "d3-dashboard": { - "title": "D3 Dashboard", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Scientific Computing with Python (Beta)", + "title": "Scientific Computing with Python", "intro": [ - "The Scientific Computing with Python (Beta) curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "This comprehensive course will guide you through the fundamentals of scientific computing, including data structures, and algorithms." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "Coding Interview Prep", "intro": [ "If you're looking for free coding exercises to prepare for your next job interview, we've got you covered.", - "This section contains hundreds of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "The Project Euler Project and Rosetta Code have been moved to their own courses. Go back to the curriculum to see the list of courses we offer.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project was created in 2013 by a lone developer, Erik Trautman. Over the years, an open source community has sprung up to maintain and expand the project.", "freeCodeCamp has expanded upon the open source curriculum to make it run interactively in the browser, with tests to evaluate your code and ensure you've understood key concepts.", @@ -1390,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Upcoming Python", - "intro": ["placeholder"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Learn Python by Building a Blackjack Game", - "intro": ["Learn Python.", ""] - }, - "upcoming-python-project": { - "title": "Upcoming Python Project", - "intro": ["placeholder"] - } - } - }, "a2-english-for-developers": { "title": "A2 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", "intro": [ "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the A2 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", "The first half of the curriculum will help you get comfortable with English grammar and usage. It will give you tons of hands-on practice. You'll learn basics like introducing yourself, making small talk, and discussing your work.", @@ -1586,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1708,15 +1706,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1730,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1779,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1791,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1811,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1824,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1841,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1901,19 +1976,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1931,7 +2006,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1943,20 +2020,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1968,27 +2046,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2003,19 +2085,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2034,13 +2116,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2059,36 +2142,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2097,59 +2182,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2162,7 +2246,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2175,45 +2259,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2226,85 +2308,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2316,25 +2402,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2347,26 +2434,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2378,25 +2466,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2406,46 +2495,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2458,76 +2554,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2540,25 +2646,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2570,65 +2675,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2641,55 +2746,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2699,152 +2810,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2862,74 +3017,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2938,91 +3104,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3033,155 +3228,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3190,118 +3360,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] - }, - "muyw": { - "title": "266", - "intro": [] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3310,61 +3481,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3382,145 +3570,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3528,12 +3590,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3551,10 +3613,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3579,11 +3641,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3596,15 +3658,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3656,8 +3718,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3673,10 +3735,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3700,18 +3762,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3720,17 +3898,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3760,6 +3934,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/korean/links.json b/client/i18n/locales/korean/links.json index f0b46c3470a223..e827fbf9062ca6 100644 --- a/client/i18n/locales/korean/links.json +++ b/client/i18n/locales/korean/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/korean/translations.json b/client/i18n/locales/korean/translations.json index f086b5ea6508e3..f1ac387fb022c5 100644 --- a/client/i18n/locales/korean/translations.json +++ b/client/i18n/locales/korean/translations.json @@ -106,7 +106,10 @@ "donate-now": "Donate Now", "confirm-amount": "Confirm amount", "play-scene": "Press Play", - "closed-caption": "Closed caption" + "closed-caption": "Closed caption", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Learn to code — for free.", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "Earn free professional certifications:", "interview-prep-heading": "Prepare for the developer interview job search:", "legacy-curriculum-heading": "Explore our Legacy Curriculum:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Upcoming curriculum:", "faq": "Frequently asked questions:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "This adds the pleasant sound of acoustic guitar throughout the website. You'll get musical feedback as you type in the editor, complete challenges, claim certifications, and more.", "sound-volume": "Campfire Volume:", "scrollbar-width": "Editor Scrollbar Width", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Within a challenge, press ESC followed by the question mark to show a list of available shortcuts.", "username": { "contains invalid characters": "Username \"{{username}}\" contains invalid characters", @@ -346,13 +353,14 @@ "donated": "Donated to the community", "projects": "Projects", "stats": "Stats", + "activity": "Activity", "timeline": "Timeline", "none-completed": "No challenges have been completed yet.", "get-started": "Get started here.", "challenge": "Challenge", "completed": "Completed", "add-linkedin": "Add this certification to my LinkedIn profile", - "add-twitter": "Share this certification on Twitter", + "add-twitter": "Share this certification on X", "tweet": "I just earned the {{certTitle}} certification @freeCodeCamp! Check it out here: {{certURL}}", "avatar": "{{username}}'s avatar", "joined": "Joined {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}} point on {{date}}", "points_plural": "{{count}} points on {{date}}", "page-number": "{{pageNumber}} of {{totalPages}}", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charitable organization (United States Federal Tax Identification Number: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Assignments", "question": "Question", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "Solution Link", "source-code-link": "Source Code Link", @@ -501,7 +512,9 @@ "complete-both-steps": "Complete both steps below to finish the challenge.", "runs-in-vm": "The project runs in a virtual machine, complete the user stories described in there and get all the tests to pass to finish step 1.", "completed": "Completed", + "not-completed": "Not completed", "not-started": "Not started", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Test", "sorry-try-again": "Sorry, your code does not pass. Try again.", "sorry-keep-trying": "Sorry, your code does not pass. Keep trying.", @@ -583,6 +596,7 @@ "redirecting": "Redirecting...", "thanks": "Thanks for donating", "thank-you": "Thank You for Being a Supporter", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Your card has been updated successfully.", "additional": "You can make an additional one-time donation of any amount using this link: <0>{{url}}", "help-more": "Help Our Charity Do More", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Donate now to help us develop free professional programming certifications for all.", "help-us-reach-20k": "Donate now to help our charity reach our goal of 20,000 monthly supporters this year.", "beta-certification": "This certification is currently in beta. Please consider donating to support the completion of its development.", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Help us develop free professional programming certifications for all.", "nicely-done": "Nicely done. You just completed {{block}}.", "credit-card": "Credit Card", @@ -683,7 +701,7 @@ "bear-progress-alt": "Illustration of an adorable teddy bear with a pleading expression holding an empty money jar.", "bear-completion-alt": "Illustration of an adorable teddy bear holding a large trophy.", "flying-bear": "Illustration of an adorable teddy bear wearing a graduation cap and flying with a Supporter badge.", - "crucial-contribution": "Your contribution will be crucial in creating resources that empower millions of people to learn new skills and support their families.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Benefits from becoming a Supporter:", "support-benefits-1": "No more donation prompt popups", "support-benefits-2": "You'll get a Supporter badge", @@ -710,6 +728,8 @@ "help-millions-learn": "Help millions of people learn", "reach-goals-faster": "Reach your goals faster", "remove-distractions": "Remove distractions", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "This is a 20 second animated advertisement to encourage campers to become supporters of freeCodeCamp. The animation starts with a teddy bear who becomes a supporter. As a result, distracting pop-ups disappear and the bear gets to complete all of its goals. Then, it graduates and becomes an education super hero helping people around the world.", "animation-countdown": "This animation will stop after {{secondsRemaining}} seconds." }, @@ -741,6 +761,7 @@ "result-list": "Search results" }, "misc": { + "coming-soon": "Coming Soon", "offline": "You appear to be offline, your progress may not be saved", "server-offline": "The server could not be reached and your progress may not be saved. Please contact <0>support if this message persists", "unsubscribed": "You have successfully been unsubscribed", @@ -852,7 +873,7 @@ "expired-link": "Looks like the link you clicked has expired, please request a fresh link, to sign in", "signin-success": "Success! You have signed in to your account. Happy Coding!", "social-auth-gone": "We are moving away from social authentication for privacy reasons. Next time we recommend using your email address: {{email}} to sign in instead.", - "name-needed": "We need your name so we can put it on your certification. Add your name to your account settings and click the save button. Then we can issue your certification.", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "It looks like you have not completed the necessary steps. Please complete the required projects to claim the {{name}} Certification.", "already-claimed": "It looks like you already have claimed the {{name}} Certification", "cert-claim-success": "@{{username}}, you have successfully claimed the {{name}} Certification! Congratulations on behalf of the freeCodeCamp.org team!", @@ -891,6 +912,7 @@ "invalid-update-flag": "You are attempting to access forbidden resources. Please request assistance on https://forum.freecodecamp.org if this is a valid request.", "generate-exam-error": "An error occurred trying to generate your exam.", "cert-not-found": "The certification {{certSlug}} does not exist.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Please include a Microsoft transcript URL in the request.", @@ -951,6 +973,8 @@ "issued": "Issued", "fulltext": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}} <5>representing approximately {{completionTime}} hours of work", "fulltextNoHours": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "As part of this Legacy Full Stack certification, {{user}} completed the following certifications:", "heading-exam": "As part of this certification, {{user}} passed the following exam: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Responsive Web Design", - "responsive-web-design": "Responsive Web Design Certification", - "JavaScript Algorithms and Data Structures": "Legacy JavaScript Algorithms and Data Structures", - "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures Certification", - "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures (Beta) Certification", - "Front End Development Libraries": "Front End Development Libraries", - "front-end-development-libraries": "Front End Development Libraries Certification", - "Data Visualization": "Data Visualization", - "data-visualization": "Data Visualization Certification", - "Relational Database": "Relational Database", - "relational-database-v8": "Relational Database Certification", - "Back End Development and APIs": "Back End Development and APIs", - "back-end-development-and-apis": "Back End Development and APIs Certification", - "Quality Assurance": "Quality Assurance", - "quality-assurance-v7": "Quality Assurance Certification", - "Scientific Computing with Python": "Scientific Computing with Python", - "scientific-computing-with-python-v7": "Scientific Computing with Python Certification", - "Data Analysis with Python": "Data Analysis with Python", - "data-analysis-with-python-v7": "Data Analysis with Python Certification", - "Information Security": "Information Security", - "information-security-v7": "Information Security Certification", - "Machine Learning with Python": "Machine Learning with Python", - "machine-learning-with-python-v7": "Machine Learning with Python Certification", - "College Algebra with Python": "College Algebra with Python", - "college-algebra-with-python-v8": "College Algebra with Python Certification", - "Foundational C# with Microsoft": "Foundational C# with Microsoft", - "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft Certification", - "A2 English for Developers": "A2 English for Developers", - "a2-english-for-developers": "A2 English for Developers Certification", - "B1 English for Developers": "B1 English for Developers", - "b1-english-for-developers": "B1 English for Developers Certification", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "Legacy Front End", - "legacy-front-end": "Legacy Front End Certification", - "Legacy Back End": "Legacy Back End", - "legacy-back-end": "Legacy Back End Certification", - "Legacy Data Visualization": "Legacy Data Visualization", - "legacy-data-visualization": "Legacy Data Visualization Certification", - "Legacy Information Security and Quality Assurance": "Legacy Information Security and Quality Assurance", - "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance Certification", - "Legacy Full Stack Certification": "Legacy Full Stack Certification", - "Legacy Full Stack": "Legacy Full Stack", - "full-stack": "Legacy Full Stack Certification" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/portuguese/intro.json b/client/i18n/locales/portuguese/intro.json index a0adbb894a1810..9e19f94a468ac0 100644 --- a/client/i18n/locales/portuguese/intro.json +++ b/client/i18n/locales/portuguese/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "Algoritmos e estruturas de dados em JavaScript (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Desenvolvedores usam HTML e CSS para controlar os componentes e estilizar a página. Eles também usam o JavaScript para tornar essa página interativa.", "Neste certificado de Algoritmos e estruturas de dados em JavaScript, você aprenderá os fundamentos de JavaScript como variáveis, arrays, objetos, laços, funções, o DOM e mais.", @@ -584,10 +584,6 @@ "Agora que você aprendeu a trabalhar com D3, APIs e tecnologias AJAX, teste suas habilidades com esses 5 projetos de Visualização de Dados.", "Nestes projetos, você precisará buscar dados e analisar um conjunto de dados e, em seguida, usar D3 para criar diferentes visualizações de dados. Conclua todos para receber a sua certificação de Visualização de Dados." ] - }, - "d3-dashboard": { - "title": "Painel do D3", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Computação científica com Python (beta)", + "title": "Scientific Computing with Python", "intro": [ - "O currículo de Computação científica com Python (beta) equipará você com as habilidades para analizar e manipular dados usando o Python, uma linguaguem de programação poderosa e versátil. Você aprenderá conceitos-chave como estrutura de dados, algoritmos, Programação Orientada a Objetos e como realizar cálculos complexos usando uma variedade de ferramentas.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "Este curso abrangente guiará você através dos fundamentos da computação científica, incluindo estrutura de dados e algoritmos." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "Preparação para entrevistas de programação", "intro": [ "Se estiver procurando exercícios gratuitos de programação para se preparar para sua próxima entrevista de emprego, nós temos o que você precisa.", - "Esta seção contém centenas de desafios de programação que testam seu conhecimento de algoritmos, estruturas de dados e matemática. Ela também possui vários projetos adicionais, que você pode usar para fortalecer suas habilidades ou adicionar ao seu portfólio." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "O Projeto Euler e o Rosetta Code foram transferidos para seus próprios cursos. Volte para o currículo para ver a lista de cursos que oferecemos.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "O Odin Project – versão do freeCodeCamp (beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "O Odin Project foi criado em 2013 por um único desenvolvedor, Erik Trautman. Ao longo dos anos, uma comunidade de código aberto surgiu para manter e expandir o projeto.", "O freeCodeCamp expandiu o currículo de código aberto para ser executado de maneira interativa no navegador, com testes para avaliar seu código e garantir que você tenha entendido os conceitos principais.", @@ -1390,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Próximo Python", - "intro": ["placeholder"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Aprenda Python criando um jogo de Blackjack", - "intro": ["Aprenda Python.", ""] - }, - "upcoming-python-project": { - "title": "Próximo projeto de Python", - "intro": ["placeholder"] - } - } - }, "a2-english-for-developers": { "title": "A2 Inglês para Desenvolvedores (Beta)", - "note": "Esta certificação está atualmente em desenvolvimento ativo. Embora não haja uma certificação disponível para esta seção no momento, teremos uma disponível em breve. Enquanto isso, você pode explorar os cursos que criamos abaixo.", "intro": [ "Neste currículo de inglês para desenvolvedores, você aprenderá o essencial da comunicação em inglês. O currículo seguirá o nível A2 do Quadro de Referência Comum Europeu (CEFR). Nosso foco é no vocabulário, particularmente útil para desenvolvedores.", "A primeira metade do currículo ajudará você a se sentir confortável com a gramática e o uso do inglês. Isso dará a você diversas oportunidades de praticar. Você aprenderá o básico como se apresentar, ter conversas mais simples e discutir seu trabalho.", @@ -1586,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 Inglês para Desenvolvedores (Beta)", - "note": "Esta certificação está atualmente em desenvolvimento ativo. Embora não haja uma certificação disponível para esta seção no momento, teremos uma disponível em breve. Enquanto isso, você pode explorar os cursos que criamos abaixo.", - "intro": ["Modelo de introdução"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Aprenda a descrever locais e eventos", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Aprenda a falar sobre experiências passadas", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Aprenda a falar sobre atividades passadas", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Aprenda o Present Perfect ao falar sobre acessibilidade", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Aprenda a planejar eventos futuros", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Aprenda o Future Continuous ao descrever ações", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Aprenda a usar condicionais", @@ -1708,15 +1706,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1730,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1779,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1791,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1811,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1824,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1841,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1901,19 +1976,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1931,7 +2006,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1943,20 +2020,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1968,27 +2046,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2003,19 +2085,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2034,13 +2116,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2059,36 +2142,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2097,59 +2182,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2162,7 +2246,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2175,45 +2259,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2226,85 +2308,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2316,25 +2402,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2347,26 +2434,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2378,25 +2466,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2406,46 +2495,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2458,76 +2554,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2540,25 +2646,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2570,65 +2675,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2641,55 +2746,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2699,152 +2810,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2862,74 +3017,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2938,91 +3104,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3033,155 +3228,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3190,118 +3360,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "muyw": { - "title": "266", - "intro": [] - }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3310,61 +3481,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3382,145 +3570,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3528,12 +3590,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3551,10 +3613,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3579,11 +3641,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3596,15 +3658,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3656,8 +3718,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3673,10 +3735,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3700,18 +3762,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3720,17 +3898,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3760,6 +3934,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/portuguese/links.json b/client/i18n/locales/portuguese/links.json index 70b191854cc1f3..42535fadb0ffce 100644 --- a/client/i18n/locales/portuguese/links.json +++ b/client/i18n/locales/portuguese/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/portuguese/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/portuguese/news/sobre-o-freecodecamp-perguntas-frequentes/", diff --git a/client/i18n/locales/portuguese/translations.json b/client/i18n/locales/portuguese/translations.json index b5e718e7160f1e..c4938543589d02 100644 --- a/client/i18n/locales/portuguese/translations.json +++ b/client/i18n/locales/portuguese/translations.json @@ -106,7 +106,10 @@ "donate-now": "Doe agora", "confirm-amount": "Confirmar o valor", "play-scene": "Pressione Play", - "closed-caption": "Versão legendada" + "closed-caption": "Versão legendada", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Aprenda a programar — de graça.", @@ -147,7 +150,7 @@ }, { "title": "Educação gratuita", - "description": "Aprenda com nossa instituição beneficente e economize dinheiro em sua educação. Sem pagamentos. Sem custos ocultos." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Certificações extensivas", @@ -166,6 +169,8 @@ "professional-certs-heading": "Obtenha certificações profissionais gratuitas:", "interview-prep-heading": "Prepare-se para desenvolvedor em sua procura por emprego:", "legacy-curriculum-heading": "Explore nosso currículo antigo:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Próximo currículo:", "faq": "Perguntas frequentes:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "Adiciona o som agradável de uma guitarra acústica em todo o site. Você receberá feedback musical ao digitar no editor, completar desafios, solicitar certificações e muito mais.", "sound-volume": "Volume do modo fogueira:", "scrollbar-width": "Largura da barra de rolagem do editor", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Dentro de um desafio, aperte ESC seguido pelo ponto de interrogação para mostrar uma lista de atalhos disponíveis.", "username": { "contains invalid characters": "O nome de usuário \"{{username}}\" contém caracteres inválidos", @@ -346,13 +353,14 @@ "donated": "Doou para a comunidade", "projects": "Projetos", "stats": "Estatísticas", + "activity": "Activity", "timeline": "Cronograma", "none-completed": "Nenhum desafio foi concluído ainda.", "get-started": "Comece aqui.", "challenge": "Desafio", "completed": "Concluído", "add-linkedin": "Adicionar esta certificação ao meu perfil do LinkedIn", - "add-twitter": "Compartilhar esta certificação no Twitter", + "add-twitter": "Share this certification on X", "tweet": "Acabei de receber a certificação {{certTitle}} @freeCodeCamp! Confira aqui: {{certURL}}", "avatar": "Avatar de {{username}}", "joined": "Entrou em {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}} ponto em {{date}}", "points_plural": "{{count}} pontos em {{date}}", "page-number": "{{pageNumber}} de {{totalPages}}", - "edit-my-profile": "Editar meu perfil" + "edit-my-profile": "Editar meu perfil", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "O freeCodeCamp é uma organização beneficente 501(c)(3), isenta de impostos e apoiada por doações (Número de identificação fiscal federal dos Estados Unidos: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Tarefas", "question": "Questão", "questions": "Questão", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explicação", "solution-link": "Link da solução", "source-code-link": "Link do código-fonte", @@ -501,7 +512,9 @@ "complete-both-steps": "Complete as duas etapas abaixo para terminar o desafio.", "runs-in-vm": "O projeto é executado em uma máquina virtual. Complete as histórias de usuários descritas lá e passe em todos os testes para concluir a etapa 1.", "completed": "Concluído", + "not-completed": "Not completed", "not-started": "Não iniciado", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Teste", "sorry-try-again": "Desculpe, seu código não passou nos testes. Tente novamente.", "sorry-keep-trying": "Desculpe, seu código não passou nos testes. Continue tentando.", @@ -583,6 +596,7 @@ "redirecting": "Redirecionando...", "thanks": "Agradecemos por sua doação", "thank-you": "Obrigado pelo seu apoio", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Seu cartão foi atualizado com sucesso.", "additional": "Você pode fazer uma doação adicional de qualquer valor usando este link: <0>{{url}}", "help-more": "Ajude nossa instituição a fazer mais", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Doe agora para nos ajudar a desenvolver certificações de programação profissional gratuitas para todos.", "help-us-reach-20k": "Doe agora para ajudar nossa instituição beneficente a atingir nosso objetivo de chegar a 20.000 apoiadores mensais neste ano.", "beta-certification": "Esta certificação está atualmente em versão beta. Considere doar para apoiar a conclusão do seu desenvolvimento.", + "unfinished-certification": "Esta certificação está atualmente em desenvolvimento ativo. Embora não haja uma certificação disponível no momento, uma estará disponível em breve. Enquanto isso, você pode explorar os cursos que criamos abaixo.", + "consider-donating": "Considere doar para apoiar a conclusão do desenvolvimento da certificação.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Ajude-nos a desenvolver certificações de programação profissional gratuitas para todos.", "nicely-done": "Bom trabalho. Você acabou de completar {{block}}.", "credit-card": "Cartão de crédito", @@ -683,7 +701,7 @@ "bear-progress-alt": "Ilustração de um ursinho de pelúcia adorável com um olhar triste e segurando um pote de dinheiro vazio.", "bear-completion-alt": "Ilustração de um ursinho de pelúcia adorável segurando um grande troféu.", "flying-bear": "Ilustração de um urso de pelúcia adorável usando um chapéu de formatura e voando com um distintivo de suporte.", - "crucial-contribution": "Sua contribuição será fundamental para a criação de recursos que permitam a milhões de pessoas aprender novas competências e sustentar suas famílias.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Benefícios de se tornar um apoiador:", "support-benefits-1": "Não ter mais pop-ups de doação", "support-benefits-2": "Você receberá um emblema de apoiador", @@ -710,6 +728,8 @@ "help-millions-learn": "Ajude milhões de pessoas a aprender", "reach-goals-faster": "Alcance seus objetivos mais rapidamente", "remove-distractions": "Remova distrações", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "Esse é um anúncio animado de 20 segundos para incentivar campers a se tornarem apoiadores do freeCodeCamp. A animação começa com um urso de pelúcia que se torna um apoiador. Como resultado, os pop-ups de distração desaparecem e o urso completa todos os seus objetivos. Então, termina o curso e se torna um super-herói da educação que ajuda as pessoas em todo o mundo.", "animation-countdown": "Esta animação será interrompida após {{secondsRemaining}} segundos." }, @@ -741,6 +761,7 @@ "result-list": "Resultados da pesquisa" }, "misc": { + "coming-soon": "Coming Soon", "offline": "Você parece estar off-line, seu progresso pode não ser salvo", "server-offline": "O servidor não pôde ser alcançado e seu progresso pode não ser salvo. Entre em contato com <0>suporte se esta mensagem persistir", "unsubscribed": "Sua assinatura foi cancelada com sucesso", @@ -780,7 +801,7 @@ "heart": "Coração", "initial": "Inicial", "input-reset": "Limpar termos de pesquisa", - "input-search": "Submit search terms", + "input-search": "Enviar termos de pesquisa", "info": "Informações introdutórias", "spacer": "Espaçador", "toggle": "Alternar marcação", @@ -852,7 +873,7 @@ "expired-link": "Parece que o link que você clicou expirou. Solicite um novo link para fazer login", "signin-success": "Sucesso! Você entrou com sua conta. Boa programação!", "social-auth-gone": "Estamos abandonando a autenticação social por motivos de privacidade. Da próxima vez, recomendamos que você entre com o seu endereço de e-mail: {{email}}.", - "name-needed": "Precisamos do seu nome para que possamos colocá-lo na sua certificação. Adicione seu nome às configurações da sua conta e clique no botão Salvar. Depois disso, poderemos emitir sua certificação.", + "name-needed": "Precisamos do seu nome para que possamos colocá-lo na sua certificação. Adicione seu nome ao seu perfil e clique em Salvar. Depois disso, poderemos emitir sua certificação.", "incomplete-steps": "Parece que você não completou as etapas necessárias. Complete os projetos necessários para reivindicar a certificação {{name}}.", "already-claimed": "Parece que você já solicitou a certificação {{name}}", "cert-claim-success": "@{{username}}, você solicitou a certificação {{name}} com sucesso! Parabéns em nome da equipe do freeCodeCamp.org!", @@ -891,6 +912,7 @@ "invalid-update-flag": "Você está tentando acessar recursos proibidos. Solicite assistência em https://forum.freecodecamp.org se sua solicitação for válida.", "generate-exam-error": "Ocorreu um erro ao tentar gerar seu exame.", "cert-not-found": "A certificação {{certSlug}} não existe.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Inclua um URL de transcrição da Microsoft na solicitação.", @@ -951,6 +973,8 @@ "issued": "Emitido", "fulltext": "<0>Esta é a certificação de que <1>{{user}} <2>completou com sucesso a certificação de desenvolvedor <3>{{title}} <4>do freeCodeCamp. org em {{time}}, <5>representando aproximadamente {{completionTime}} horas de curso.", "fulltextNoHours": "<0>Certificamos que <1>{{user}} <2>completou com sucesso a certificação de desenvolvedor <3>{{title}} <4>em {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "Como parte desta certificação de full-stack legada, {{user}} completou as seguintes certificações:", "heading-exam": "Como parte desta certificação, {{user}} passou no seguinte exame: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Design responsivo para a web", - "responsive-web-design": "Certificação de design responsivo para a web", - "JavaScript Algorithms and Data Structures": "Algoritmos e estrutura de dados em JavaScript legado", - "javascript-algorithms-and-data-structures": "Certificação de algoritmos e estruturas de dados em JavaScript legado", - "javascript-algorithms-and-data-structures-v8": "Certificação de algoritmos e estruturas de dados em JavaScript (Beta)", - "Front End Development Libraries": "Bibliotecas de desenvolvimento em front-end", - "front-end-development-libraries": "Certificação de desenvolvimento com bibliotecas de front-end", - "Data Visualization": "Visualização de dados", - "data-visualization": "Certificação de visualização de dados", - "Relational Database": "Bancos de dados relacionais", - "relational-database-v8": "Certificação de bancos de dados relacionais", - "Back End Development and APIs": "APIs e desenvolvimento de back-end", - "back-end-development-and-apis": "Certificação de APIs e desenvolvimento de back-end", - "Quality Assurance": "Garantia de qualidade", - "quality-assurance-v7": "Certificação de garantia de qualidade", - "Scientific Computing with Python": "Computação científica em Python", - "scientific-computing-with-python-v7": "Certificação de computação científica em Python", - "Data Analysis with Python": "Análise de dados com Python", - "data-analysis-with-python-v7": "Certificação de análise de dados com Python", - "Information Security": "Segurança da informação", - "information-security-v7": "Certificação de segurança da informação", - "Machine Learning with Python": "Aprendizado de máquina com Python", - "machine-learning-with-python-v7": "Certificação de aprendizagem de máquina com Python", - "College Algebra with Python": "Álgebra para o ensino superior com Python", - "college-algebra-with-python-v8": "Certificação de Álgebra do ensino superior com Python", - "Foundational C# with Microsoft": "Fundamentos de C# com a Microsoft", - "foundational-c-sharp-with-microsoft": "Fundamentos de C# com certificação da Microsoft", - "A2 English for Developers": "A2 Inglês para Desenvolvedores", - "a2-english-for-developers": "Certificação A2 Inglês para Desenvolvedores", - "B1 English for Developers": "B1 Inglês para Desenvolvedores", - "b1-english-for-developers": "Certificação B1 Inglês para Desenvolvedores", - "Full Stack Developer": "Desenvolvedor full stack", - "full-stack-developer-v9": "Desenvolvedor full stack certificado", - "Legacy Front End": "Front-end legado", - "legacy-front-end": "Certificação de front-end legada", - "Legacy Back End": "Back-end legado", - "legacy-back-end": "Certificação de back-end legada", - "Legacy Data Visualization": "Visualização de dados legada", - "legacy-data-visualization": "Certificação de visualização de dados legado", - "Legacy Information Security and Quality Assurance": "Segurança da informação e garantia da qualidade legado", - "information-security-and-quality-assurance": "Certificação de garantia da qualidade e segurança da informação legada", - "Legacy Full Stack Certification": "Certificação de full-stack legada", - "Legacy Full Stack": "Full-stack legado", - "full-stack": "Certificação de full-stack legada" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/swahili/intro.json b/client/i18n/locales/swahili/intro.json index a5ba010255a5f2..072ce3369df6e6 100644 --- a/client/i18n/locales/swahili/intro.json +++ b/client/i18n/locales/swahili/intro.json @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "JavaScript Algorithms and Data Structures (Beta)", + "title": "JavaScript Algorithms and Data Structures", "intro": [ "Developers use HTML and CSS to control the content and styling of a page. And they use JavaScript to make that page interactive.", "In this JavaScript Algorithm and Data Structures Certification, you'll learn the JavaScript fundamentals like variables, arrays, objects, loops, functions, the DOM and more.", @@ -584,10 +584,6 @@ "Kwa kuwa sasa umejifunza jinsi ya kufanya kazi na teknolojia za D3, API na AJAX, jaribu ujuzi wako ukitumia miradi hii 5 ya Kuonyesha Data.", "Katika miradi hii, utahitaji kuleta data na kuchanganua mkusanyiko wa data, kisha utumie D3 kuunda taswira tofauti za data. Maliza yote ili upate cheti chako cha Data Visualization." ] - }, - "d3-dashboard": { - "title": "Dashibodi ya D3", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Scientific Computing with Python (Beta)", + "title": "Scientific Computing with Python", "intro": [ - "The Scientific Computing with Python (Beta) curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", + "The Scientific Computing with Python curriculum will equip you with the skills to analyze and manipulate data using Python, a powerful and versatile programming language. You'll learn key concepts like data structures, algorithm, Object Oriented Programming, and how to perform complex calculations using a variety of tools.", "This comprehensive course will guide you through the fundamentals of scientific computing, including data structures, and algorithms." ], "note": "", @@ -1162,7 +1158,8 @@ "title": "Matayarisho ya Mahojiano ya Coding", "intro": [ "Ikiwa unatafuta mazoezi ya coding bila malipo ili kujiandaa kwa mahojiano yako ya kazini, tumekushughulikia.", - "Sehemu hii ina mamia ya changamoto za usimbaji ambazo hujaribu ujuzi wako wa kanuni, miundo ya data na hisabati. Pia ina idadi ya miradi ya kwenda nyumbani unayoweza kutumia kuimarisha ujuzi wako, au kuongeza kwenye wasifu yako." + "This section contains dozens of coding challenges that test your knowledge of algorithms, data structures, and mathematics. It also has a number of take-home projects you can use to strengthen your skills, or add to your portfolio.", + "This work incorporates material from Wikipedia, which is licensed under the Creative Commons Attribution-ShareAlike License 4.0. The original content might have been modified and adapted. For the unaltered version and additional details, see the original page on Wikipedia." ], "note": "The Project Euler Project and Rosetta Code have been moved to their own courses. Go back to the curriculum to see the list of courses we offer.", "blocks": { @@ -1190,7 +1187,7 @@ } }, "the-odin-project": { - "title": "The Odin Project - freeCodeCamp Remix (Beta)", + "title": "The Odin Project - freeCodeCamp Remix", "intro": [ "The Odin Project was created in 2013 by a lone developer, Erik Trautman. Over the years, an open source community has sprung up to maintain and expand the project.", "freeCodeCamp has expanded upon the open source curriculum to make it run interactively in the browser, with tests to evaluate your code and ensure you've understood key concepts.", @@ -1390,23 +1387,8 @@ } } }, - "upcoming-python": { - "title": "Inayokuja Python", - "intro": ["kishika nafasi"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Jifunze Python kwa Kuunda Mchezo wa Blackjack", - "intro": ["Jifunze Python.", ""] - }, - "upcoming-python-project": { - "title": "Mradi ujao wa Python", - "intro": ["kishika nafasi"] - } - } - }, "a2-english-for-developers": { "title": "A2 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", "intro": [ "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the A2 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", "The first half of the curriculum will help you get comfortable with English grammar and usage. It will give you tons of hands-on practice. You'll learn basics like introducing yourself, making small talk, and discussing your work.", @@ -1586,32 +1568,48 @@ }, "b1-english-for-developers": { "title": "B1 English for Developers (Beta)", - "note": "This certification is currently in active development. While there isn't a claimable certification available for this section at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", - "intro": ["Placeholder intro"], + "intro": [ + "In this English for Developers Curriculum, you'll learn the essentials of English communication. This will follow the B1 level of the Common European Framework of Reference (CEFR). And we've focused on vocabulary that is particularly useful for developers.", + "It will help you strengthen your foundational skills while introducing more complex grammar and usage. You'll learn how to describe places and things, share past experiences, and confidently use tenses like Present Perfect and Future. Practical communication strategies are included as well, such as managing conversations, expressing opinions, and building agreement or disagreement in discussions.", + "You'll also focus on applying these skills in professional and technical settings. You'll practice vocabulary and phrases essential for developers, such as describing code, participating in stand-up meetings, and discussing tech trends. Advanced topics include conditionals, comparative structures, and conversation management, so you can prepare for real-world interactions in the tech industry.", + "This entire B1-level curriculum includes 73 different dialogues. Each is designed to build your vocabulary and boost your confidence when speaking in a professional tech setting." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Learn How to Describe Places and Events", - "intro": [""] + "intro": [ + "This course will show you ways of talking about places and events conversationally." + ] }, "learn-how-to-talk-about-past-experiences": { "title": "Learn How to Talk About Past Experiences", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how to share experiences that you had in the past." + ] }, "learn-how-to-talk-about-past-activities": { "title": "Learn How to Talk About Past Activities", - "intro": ["", ""] + "intro": [ + "In this course, you will learn how talk about things that you did." + ] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Learn Present Perfect while Talking About Accessibility", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Present Perfect structure and learn a bit more about accessibility." + ] }, "learn-how-to-plan-future-events": { "title": "Learn How to Plan Future Events", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the different forms of the future to plan for upcoming events." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Learn Future Continuous while Describing Actions", - "intro": ["", ""] + "intro": [ + "In this course, you will learn to use the Future Continuous tense, and how to describe actions to be performed." + ] }, "learn-how-to-use-conditionals": { "title": "Learn How to Use Conditionals", @@ -1708,15 +1706,88 @@ "Through a blend of interactive lessons, coding exercises, and real-world projects, you will master both frontend and backend development. You'll work with HTML, CSS, and JavaScript to build responsive user interfaces, explore React and TypeScript for advanced web applications, and learn to manage data with relational databases - and on the backend, you'll use Git, Npm, Node.js, and Python to create powerful server-side solutions.", "By the end of this course, you'll have the practical skills and experience to confidently develop complete web applications, preparing you for a successful career as a Full Stack Developer." ], + "chapters": { + "freecodecamp": "Welcome", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Front End Libraries", + "relational-databases": "Relational Databases", + "backend-javascript": "Backend JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Certified Full Stack Developer Exam" + }, + "modules": { + "getting-started-with-freecodecamp": "Getting Started with freeCodeCamp", + "basic-html": "Basic HTML", + "semantic-html": "Semantic HTML", + "html-forms-and-tables": "Forms and Tables", + "html-and-accessibility": "Accessibility", + "review-html": "HTML Review", + "exam-html": "HTML Exam", + "computer-basics": "Computer Basics", + "basic-css": "Basic CSS", + "design-for-developers": "Design", + "absolute-and-relative-units": "Absolute and Relative Units", + "pseudo-classes-and-elements": "Pseudo Classes and Elements", + "css-colors": "Colors", + "styling-forms": "Styling Forms", + "css-box-model": "The Box Model", + "css-flexbox": "Flexbox", + "css-typography": "Typography", + "css-and-accessibility": "Accessibility", + "attribute-selectors": "Attribute Selectors", + "css-positioning": "Positioning", + "responsive-design": "Responsive Design", + "css-variables": "Variables", + "css-grid": "Grid", + "css-animations": "Animations", + "exam-css": "CSS Exam", + "code-editors": "Code Editors", + "javascript-variables-and-strings": "Variables and Strings", + "javascript-booleans-and-numbers": "Booleans and Numbers", + "javascript-functions": "Functions", + "javascript-arrays": "Arrays", + "javascript-objects": "Objects", + "javascript-loops": "Loops", + "review-javascript-fundamentals": "JavaScript Fundamentals Review", + "higher-order-functions-and-callbacks": "Higher Order Functions and Callbacks", + "dom-manipulation-and-events": "DOM Manipulation and Events", + "debugging-javascript": "Debugging", + "basic-regex": "Basic Regex", + "form-validation": "Form Validation", + "javascript-dates": "Dates", + "audio-and-video-events": "Audio and Video Events", + "maps-and-sets": "Maps and Sets", + "localstorage-and-crud-operations": "localStorage and CRUD Operations", + "classes-and-the-this-keyword": "Classes", + "recursion": "Recursion", + "functional-programming": "Functional Programming", + "asynchronous-javascript": "Asynchronous JavaScript", + "exam-javascript": "JavaScript Exam", + "react-fundamentals": "React Fundamentals", + "react-state-hooks-and-routing": "React State, Hooks, and Routing", + "performance": "Performance", + "css-libraries-and-frameworks": "CSS Libraries and Frameworks", + "testing": "Testing", + "typescript-fundamentals": "TypeScript Fundamentals", + "review-front-end-libraries": "Front End Libraries Review", + "exam-front-end-libraries": "Front End Libraries Exam", + "sql-and-bash": "SQL and Bash", + "git": "Git", + "security-and-privacy": "Security and Privacy" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Welcome to freeCodeCamp", + "intro": [ + "Watch these videos to learn what freeCodeCamp is, and how millions of people have learned to code and gotten developer jobs using it." + ] }, "lecture-what-is-html": { "title": "What is HTML?", "intro": [ - "In this lecture video, you will be introduced to HTML (HyperText Markup Language) which is a markup language for creating web pages.", + "In this lecture video, you will be introduced to HTML (HyperText Markup Language), a markup language for creating web pages.", "You will learn about HTML's role on the web, the basic syntax, and what HTML attributes are." ] }, @@ -1730,37 +1801,37 @@ "lab-recipe-page": { "title": "Build a Recipe Page", "intro": [ - "For this lab, you will review HTML basics by creating a web page of your favorite recipe. This lab will give you an opportunity to review working with an HTML boilerplate, headings, lists and images." + "In this lab, you'll review HTML basics by creating a web page of your favorite recipe. You'll create an HTML boilerplate and work with headings, lists, images, and more." ] }, "lecture-html-fundamentals": { "title": "HTML Fundamentals", "intro": [ - "In these lecture videos, you will learn about HTML fundamentals like the id and class attributes, as well as the div and span elements, HTML entities, and more." + "In these lecture videos, you will learn about HTML fundamentals like the div element, the id and class attributes, the HTML boilerplate, HTML entities, and more." ] }, "lab-travel-agency-page": { "title": "Build a Travel Agency Page", "intro": [ - "For this lab, you will review working with HTML fundamentals by creating a web page for a travel agency. This lab will give you an opportunity to review working with images, the figure element, the figcaption element, the anchor element and more." + "In this lab, you'll review working with HTML fundamentals by creating a web page for a travel agency. You'll work with images, the figure element, the figcaption element, the anchor element, and more." ] }, "lecture-working-with-media": { "title": "Working with Media", "intro": [ - "In these lecture videos, you will learn how to work with the audio and video elements as well as with SVG's and more." + "In these lecture videos, you will learn how to work with media assets like the audio and video elements, SVGs, how to optimize them, and more." ] }, "lab-video-compilation-page": { "title": "Build a Video Compilation Page", "intro": [ - "For this lab, you will create a video compilation web page. This lab will give you the opportunity to practice working with the iframe element." + "In this lab, you'll create a video compilation web page. You'll practice working with the iframe element." ] }, "lecture-working-with-links": { "title": "Working with Links", "intro": [ - "In these lecture videos, you will learn about the different target attribute values, absolute and relative links and the different links states." + "In these lecture videos, you will learn about links, the target attribute, different link states, absolute, and relative paths, and more." ] }, "review-basic-html": { @@ -1779,7 +1850,7 @@ "lecture-importance-of-semantic-html": { "title": "Importance of Semantic HTML", "intro": [ - "In these lecture videos, you will learn about semantic HTML and the importance of using it." + "In these lecture videos, you will learn about semantic HTML and why you should care about it, semantic elements, how semantic HTML differs from presentational HTML, and more." ] }, "workshop-blog-page": { @@ -1791,8 +1862,7 @@ "lab-event-hub": { "title": "Build an Event Hub", "intro": [ - "In this lab, you will review working with semantic HTML elements by building an event hub.", - "This lab will give you an opportunity to review working with the header, nav, article elements." + "In this lab, you'll build an event hub and review semantic elements like header, nav, article, and more." ] }, "review-semantic-html": { @@ -1811,7 +1881,7 @@ "lecture-working-with-forms": { "title": "Working with Forms", "intro": [ - "In these lecture videos, you will learn about working with forms in HTML." + "In these lecture videos, you will learn about forms, the role of labels, inputs and buttons in creating forms, client-side form validation, and form states." ] }, "workshop-hotel-feedback-form": { @@ -1824,13 +1894,15 @@ "lab-survey-form": { "title": "Build a Survey Form", "intro": [ - "For this lab, you will review working with HTML forms by creating a survey form.", - "This lab will give you the opportunity to practice working with the label element, the different input elements, the required attribute, and more. " + "In this lab, you'll review HTML forms by creating a survey form.", + "You'll practice working with the label element, the different input elements, the required attribute, and more. " ] }, "lecture-working-with-tables": { "title": "Working with Tables", - "intro": ["In these lecture videos, you will learn about HTML tables."] + "intro": [ + "In these lecture videos, you will learn about HTML tables, how to create them, and when to use them." + ] }, "workshop-final-exams-table": { "title": "Build a Final Exams Table", @@ -1841,50 +1913,53 @@ "lab-book-catalog-table": { "title": "Build a Book Catalog Table", "intro": [ - "In this lab, you will review working with HTML tables by building a table filled with book information.", - "This lab will give you an opportunity to practice working with the different table components like the Table Head, Table Row and Table Data Cell elements." + "In this lab, you'll review HTML tables by building a book information table.", + "You'll practice the different table components like the thead, tbody, th, tr, and td elements." ] }, "lecture-working-with-html-tools": { "title": "Working with HTML Tools", "intro": [ - "In these lecture videos, you will learn about working with HTML tools." + "In these lecture videos, you will learn about HTML tools and how they let you write better code. These tools include HTML validators, DOM Inspector, and the browser developer tools." ] }, "review-html-tables-and-forms": { "title": "HTML Tables and Forms Review", "intro": [ - "Before you are quizzed on HTML forms and tables, you first need to review the concepts.", - "Open up this page to review the table, label, input, button and more elements." + "Before you are quizzed on HTML forms, tables and tools, you first need to review the concepts.", + "Open up this page to review the table, input, and button elements as well as commonly used tools like the HTML validator and more." ] }, "quiz-html-tables-and-forms": { "title": "HTML Tables and Forms Quiz", "intro": [ - "The following quiz will test your knowledge of HTML tables and forms." + "The following quiz will test your knowledge of HTML tables, forms and commonly used HTML tools." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Importance of Accessibility and Good HTML Structure", "intro": [ - "In these lecture videos, you will learn about importance of accessibility and using good HTML structure." + "In these lecture videos, you will learn about accessibility and its importance, assistive tools for people with disabilities, HTML attributes that let you create inclusive websites, accessibility best practices, and much more." ] }, "lab-checkout-page": { "title": "Build a Checkout Page", - "intro": ["In this lab, you will create an accessible checkout page."] + "intro": [ + "In this lab, you'll create an accessible checkout page.", + "You'll practice concepts like alt attributes and aria roles." + ] }, "review-html-accessibility": { "title": "HTML Accessibility Review", "intro": [ - "Review the HTML Accessibility concepts to prepare for the upcoming quiz." + "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", + "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." ] }, "quiz-html-accessibility": { "title": "HTML Accessibility Quiz", "intro": [ - "Before you are quizzed on HTML and accessibility, you first need to review the concepts.", - "Open up this page to review concepts including the aria-hidden, aria-describedby, tabindex attributes and more." + "The following quiz will test your knowledge on the accessibility concepts you have learned so far." ] }, "review-html": { @@ -1901,19 +1976,19 @@ "lecture-understanding-computer-internet-and-tooling-basics": { "title": "Understanding Computer, Internet, and Tooling Basics", "intro": [ - "In these lecture videos, you will learn about computer, internet, and tooling basics." + "In these lecture videos, you will learn about the computer, its different parts, internet service providers (ISPs), and the tools professional developers use." ] }, "lecture-working-with-file-systems": { "title": "Working with File Systems", "intro": [ - "In these lecture videos, you will learn about working with file systems." + "In these lecture videos, you will learn how to work with file and folder systems on your computers. You will learn how to create, move, and delete files and folders, the best practices for naming and organizing files and folders, and more." ] }, "lecture-browsing-the-web-effectively": { "title": "Browsing the Web Effectively", "intro": [ - "In these lecture videos, you will learn how to browse the web effectively." + "In these lecture videos, you will learn about what websites, search engine, and web browsers are, the different browsers available, and how to get the best out of a search engine." ] }, "review-computer-basics": { @@ -1931,7 +2006,9 @@ }, "lecture-what-is-css": { "title": "What Is CSS?", - "intro": ["In these lecture videos, you will learn what CSS is."] + "intro": [ + "The following lecture videos are all about CSS. You will learn what CSS is and its role on the web, a CSS rule and its anatomy, the three ways to write CSS and when to use each, inline and block elements, and many more." + ] }, "workshop-cafe-menu": { "title": "Design a Cafe Menu", @@ -1943,20 +2020,21 @@ "lab-business-card": { "title": "Design a Business Card", "intro": [ - "In this lab, you'll create a business card and style it using CSS." + "In this lab, you'll create a business card and style it using CSS.", + "You'll practice style properties like color, font-size, text-align, and more." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "CSS Specificity, the Cascade Algorithm, and Inheritance", "intro": [ - "In these lecture videos, you will learn about CSS specificity, the cascade algorithm, and inheritance." + "In these lecture videos, you will learn about CSS specificity, the common selectors and their specificities, the cascade algorithm, inheritance, and more." ] }, "review-basic-css": { "title": "Basic CSS Review", "intro": [ "Before you are quizzed on basic CSS concepts, you first need to review.", - "Open up this page to review concepts including margin, padding, CSS combinators, CSS Specificity and more." + "Open up this page to review concepts including margin, padding, CSS combinators, CSS specificity and more." ] }, "quiz-basic-css": { @@ -1968,27 +2046,31 @@ "lecture-styling-lists-and-links": { "title": "Styling Lists and Links", "intro": [ - "In these lecture videos, you will learn about styling lists and links." + "In these lecture videos, you will learn the properties you need to know to effectively style lists and links, including link states like link, visited, hover, and active." ] }, "lab-stylized-to-do-list": { "title": "Build a Stylized To-Do List", "intro": [ - "In this lab, you'll build a To-Do list and apply different styles to the links" + "In this lab, you'll build a To-Do list and apply different styles to the links", + "You'll practice style properties like text-decoration, list-style-type and how to change styles on hover or click." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Working with Backgrounds and Borders", "intro": [ - "In these lecture videos, you will learn about working with backgrounds and borders." + "In these lecture videos, you will learn about the properties and values you need to know to style backgrounds and borders of elements, alongside the accessibility considerations for backgrounds." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Design a Blog Post Card", + "intro": [ + "In this lab, you'll design a blog post card using HTML and CSS", + "You'll practice concepts like background-color, border-radius, margins, paddings, and more." + ] }, "review-css-backgrounds-and-borders": { - "title": "CSS Backgrounds and Borders Review", + "title": "Lists, Links, CSS Background and Borders Review", "intro": [ "Before you are quizzed on CSS backgrounds and borders, you first need to review.", "Open up this page to review concepts including the background-image property, border property and more." @@ -2003,19 +2085,19 @@ "lecture-user-interface-design-fundamentals": { "title": "User Interface Design Fundamentals", "intro": [ - "In these lecture videos, you will learn about user interface design fundamentals." + "In these lecture videos, you will learn about the fundamentals of user interface (UI) design. You will learn about the terms you need to know to communicate with designers, visual hierarchy, scaling, alignment, whitespace, and much more." ] }, "lecture-user-centered-design": { "title": "User-Centered Design", "intro": [ - "In these lecture videos, you will learn about user-centered design." + "In these lecture videos, you will learn about best practices for designing user-facing features like dark mode, breadcrumbs, modal dialogs, and much more. You will also learn how to conduct user research, user requirements and testing." ] }, "lecture-common-design-tools": { "title": "Common Design Tools", "intro": [ - "In these lecture videos, you will learn about common design tools." + "In these lecture videos, you will learn about the common design tools developers should know. You will also learn about design briefs and how developers work with them." ] }, "review-design-fundamentals": { @@ -2034,13 +2116,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Working with Relative and Absolute Units", "intro": [ - "In these lecture videos, you will learn about working with relative and absolute units." + "In these lecture videos, you will learn about relative and absolute units, and how they both impact what you see in the browser." ] }, "lab-event-flyer-page": { "title": "Build an Event Flyer Page", "intro": [ - "In this lab, you will use absolute and relative CSS units to create an event flyer page." + "In this lab, you'll create an event flyer page.", + "You will practice aligning elements using absolute and relative CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2059,36 +2142,38 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Working with Pseudo-Classes and Pseudo-Elements in CSS", "intro": [ - "In these lecture videos, you will learn about working with pseudo-classes and pseudo-elements in CSS." + "In these lecture videos, you will learn about pseudo-classes and pseudo-elements, alongside their examples and how they work." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Design a Greeting Card", + "intro": [ + "In the previous lecture videos, you learned how to work with the different types of pseudo-classes.", + "In this workshop, you will have a chance to practice what you have learned by designing a greeting card." + ] }, "lab-job-application-form": { "title": "Build a Job Application Form", "intro": [ - "In this lab you will build a job application form and style it using pseudo-classes." + "In this lab you'll build a job application form and style it using pseudo-classes.", + "You'll practice concepts like :hover, :active, :focus, and more." ] }, "review-css-pseudo-classes": { "title": "CSS Pseudo-classes Review", "intro": [ - "Before you are quizzed on CSS pseudo-classes and pseudo-elements, you first need to review.", + "Before you're quizzed on CSS pseudo-classes and pseudo-elements, you should review what you've learned about them.", "Open up this page to review concepts like the ::before and ::after pseudo-elements as well as the :hover, :active pseudo-classes and more." ] }, "quiz-css-pseudo-classes": { "title": "CSS Pseudo-classes Quiz", - "intro": [ - "Test what you've learned in this quiz of pseudo-classes in CSS." - ] + "intro": ["Test your knowledge of CSS pseudo-classes with this quiz."] }, "lecture-working-with-colors-in-css": { "title": "Working with Colors in CSS", "intro": [ - "In these lecture videos, you will learn about working with colors in CSS." + "In these lecture videos, you will learn about linear and radial gradients, the color theory, different kinds of colors like named, RGB, Hex, and HSL colors. You will learn how these colors work, and which to use in specific cases." ] }, "workshop-colored-markers": { @@ -2097,59 +2182,58 @@ "In this workshop, you'll build a set of colored markers. You'll practice different ways to set color values and how to pair colors with each other." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Design a Set of Colored Boxes", + "intro": [ + "In this lab, you'll create a color grid and practice adding background colors to the grid items using hex codes, RGB, and predefined color names." + ] }, "review-css-colors": { "title": "CSS Colors Review", "intro": [ - "Before you are quizzed on CSS colors, you first need to review.", + "Before you're quizzed on CSS colors, you should review what you've learned about them.", "Open up this page to review concepts like the rgb() function, hsl() function, hex codes, and more." ] }, "quiz-css-colors": { "title": "CSS Colors Quiz", - "intro": [ - "Test what you've learned in this quiz of using colors in CSS." - ] + "intro": ["Test your knowledge of CSS colors with this quiz."] }, "lecture-best-practices-for-styling-forms": { "title": "Best Practices for Styling Forms", "intro": [ - "In these lecture videos, you will learn about the best practices for styling forms." + "In these lecture videos, you will learn about the best practices for styling forms and issues you can encounter while styling special inputs like color and datetime-local." ] }, "workshop-registration-form": { "title": "Design a Registration Form", "intro": [ - "You can use HTML forms to collect information from people who visit your webpage.", "In this workshop, you'll learn how to design HTML forms by designing a signup page. You'll learn how to control what types of data people can type into your form, and some new CSS tools for styling your page." ] }, "lab-contact-form": { "title": "Design a Contact Form", "intro": [ - "In this lab, you will design a contact form in HTML and style it using CSS." + "In this lab, you'll design a contact form in HTML and style it using CSS." ] }, "review-styling-forms": { "title": "Styling Forms Review", "intro": [ - "Before you are quizzed on styling forms, you first need to review.", + "Before you're quizzed on styling forms, you should review what you've learned.", "Open up this page to review how to style form inputs, working with appearance: none and more." ] }, "quiz-styling-forms": { "title": "Styling Forms Quiz", "intro": [ - "Test what you've learned in this quiz of how to style forms using CSS." + "In this quiz, you will test your knowledge of how to style forms." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Working with CSS Transforms, Overflow, and Filters", "intro": [ - "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters." + "In these lecture videos, you will learn about working with CSS transforms, overflow, and filters. You will also learn about the box model and how it works." ] }, "workshop-rothko-painting": { @@ -2162,7 +2246,7 @@ "lab-confidential-email-page": { "title": "Build a Confidential Email Page", "intro": [ - "For this lab, you will create a web page of a confidential email using HTML and CSS." + "In this lab, you'll create a web page using HTML and mask the content using CSS properties." ] }, "review-css-layout-and-effects": { @@ -2175,45 +2259,43 @@ "quiz-css-layout-and-effects": { "title": "CSS Layout and Effects Quiz", "intro": [ - "Test what you've learned in this quiz of the box model, transforms, filters, and overflow in CSS." + "In this quiz, you will test your knowledge of the box model, transforms, filters, and overflow in CSS." ] }, "lecture-working-with-css-flexbox": { "title": "Working with CSS Flexbox", "intro": [ - "In these lecture videos, you will learn about working with CSS flexbox." + "In these lecture videos, you will learn how CSS flexbox works, its properties, and when you should use it." ] }, "workshop-flexbox-photo-gallery": { "title": "Build a Flexbox Photo Gallery", "intro": [ - "Flexbox helps you design your webpage so that it looks good on any screen size.", "In this workshop, you'll use Flexbox to build a responsive photo gallery webpage." ] }, "lab-page-of-playing-cards": { "title": "Build a Page of Playing Cards", "intro": [ - "For this lab, you will use flexbox to create a webpage of playing cards." + "In this lab, you'll use flexbox to create a webpage of playing cards.", + "You'll practice aligning elements using flexbox properties like flex-direction, justify-content, align-self, and more." ] }, "review-css-flexbox": { "title": "CSS Flexbox Review", "intro": [ - "Before you are quizzed on CSS Flexbox concepts, you first need to review.", - "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties and more." + "Before you're quizzed on CSS flexbox, you should review what you've learned.", + "Open up this page to review concepts like the flex-direction, justify-content, align-items, flex-wrap properties, and more." ] }, "quiz-css-flexbox": { "title": "CSS Flexbox Quiz", - "intro": [ - "Test what you've learned in this quiz of using flexbox in CSS." - ] + "intro": ["Test what you've learned on CSS flexbox with this quiz."] }, "lecture-working-with-css-fonts": { "title": "Working with CSS Fonts", "intro": [ - "In these lecture videos, you will learn about working with CSS fonts." + "In these lecture videos, you will learn about typography and its best practices, fonts, and the text-shadow property." ] }, "workshop-nutritional-label": { @@ -2226,85 +2308,89 @@ "lab-newspaper-article": { "title": "Build a Newspaper Article", "intro": [ - "In this lab, you will build a newspaper article page using HTML and CSS." + "In this lab, you'll build a newspaper article page using HTML and CSS.", + "You'll style the fonts using properties like font-family, font-size, font-weight, and more." ] }, "review-css-typography": { "title": "CSS Typography Review", "intro": [ - "Before you are quizzed on the fundamentals of typography, you first need to review.", + "Before you're quizzed on the fundamentals of typography, you should review what you've learned.", "Open up this page to review concepts like web safe fonts, the font-family property and more." ] }, "quiz-css-typography": { "title": "CSS Typography Quiz", - "intro": ["Test what you've learned in this quiz of typography in CSS."] + "intro": ["Test your knowledge of typography with this quiz."] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Best Practices for Accessibility and CSS", "intro": [ - "In these lecture videos, you will learn about best practices for accessibility in CSS." + "In these lecture videos, you will learn about best practices for accessibility in CSS, and the tools for checking good color contrast on websites." ] }, "workshop-accessibility-quiz": { "title": "Build a Quiz Webpage", "intro": [ - "Accessibility is making your webpage easy for all people to use – even people with disabilities.", + "Accessibility is the process of making your webpages usable for everyone, including people with disabilities.", "In this workshop, you'll build a quiz webpage. You'll learn accessibility tools such as keyboard shortcuts, ARIA attributes, and design best practices." ] }, "lab-tribute-page": { "title": "Build a Tribute Page", "intro": [ - "For this lab, you will build a tribute page for a subject of your choosing, fictional or real." + "in this lab, you'll build a tribute page for a subject of your choosing, fictional or real." ] }, "review-css-accessibility": { "title": "CSS Accessibility Review", "intro": [ - "Review the CSS Accessibility concepts to prepare for the upcoming quiz." + "Before you're quizzed on CSS and accessibility, you should review what you've learned.", + "Open up this page to review concepts like color contrast tools and accessibility best practices." ] }, "quiz-css-accessibility": { "title": "CSS Accessibility Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage accessible with CSS." + "In this quiz, you'll test what you've learned about making your webpages accessible with CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Working with Attribute Selectors", "intro": [ - "In these lecture videos, you will learn about working with attribute selectors." + "In these lecture videos, you will learn about attribute selectors and how to use them to target elements like links and lists." ] }, "workshop-balance-sheet": { "title": "Build a Balance Sheet", "intro": [ - "You can use CSS pseudo selectors to change specific HTML elements.", "In this workshop, you'll build a balance sheet using pseudo selectors. You'll learn how to change the style of an element when you hover over it with your mouse, and trigger other events on your webpage." ] }, "lab-book-inventory-app": { "title": "Build a Book Inventory App", - "intro": ["For this lab, you will create a book inventory app."] + "intro": [ + "In this lab, you'll create a book inventory app.", + "You'll practice CSS attribute selectors like [attribute], [attribute=value], [attribute~=value], and more." + ] }, "review-css-attribute-selectors": { "title": "CSS Attribute Selectors Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", + "Before you're quizzed on the fundamentals of CSS attribute selectors, you should review what you've learned about them.", "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." ] }, "quiz-css-attribute-selectors": { "title": "CSS Attribute Selectors Quiz", "intro": [ - "Test what you've learned in this quiz of using attribute selectors in CSS." + "Test your knowledge of CSS attribute selectors with this quiz." ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { "title": "Understanding How to Work with Floats and Positioning in CSS", "intro": [ - "In these lecture videos, you will learn about how to work with floats and positioning in CSS." + "In these lecture videos, you will learn how to use CSS positioning and floats. You will learn about absolute, relative, fixed, and sticky positioning. You will also use the z-index property." ] }, "workshop-cat-painting": { @@ -2316,25 +2402,26 @@ }, "lab-house-painting": { "title": "Build a House Painting", - "intro": ["For this lab, you will build a house painting using CSS."] + "intro": [ + "In this lab, you'll build a house painting using CSS.", + "You'll design individual elements of the house and position them using CSS properties like position, top, left, and more." + ] }, "review-css-positioning": { "title": "CSS Positioning Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", + "Before you're quizzed on the fundamentals of CSS positioning, you should review what you've learned.", "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." ] }, "quiz-css-positioning": { "title": "CSS Positioning Quiz", - "intro": [ - "Test what you've learned in this quiz of how positioning works in CSS." - ] + "intro": ["Test your knowledge of CSS positioning with this quiz."] }, "lecture-best-practices-for-responsive-web-design": { "title": "Best Practices for Responsive Web Design", "intro": [ - "In these lecture videos, you will learn about the best practices for responsive web design." + "In these lecture videos, you will learn about the best practices for responsive web design, the roles concepts like grid, flexbox, media queries, and media breakpoints play in responsive design, and more." ] }, "workshop-piano": { @@ -2347,26 +2434,27 @@ "lab-technical-documentation-page": { "title": "Build a Technical Documentation Page", "intro": [ - "For this lab, you will build a technical documentation page to serve as instruction or reference for a topic." + "In this lab, you'll build a technical documentation page to serve as instruction or reference for a topic.", + "You'll also practice media queries to create a responsive design." ] }, "review-responsive-web-design": { "title": "Responsive Web Design Review", "intro": [ - "Before you are quizzed on the fundamentals of responsive design, you first need to review.", + "Before you're quizzed on the fundamentals of responsive design, you should review what you've learned.", "Open up this page to review concepts like media queries, media breakpoints and mobile first approach design." ] }, "quiz-responsive-web-design": { "title": "Responsive Web Design Quiz", "intro": [ - "Test what you've learned in this quiz of making your webpage responsive." + "Test what you've learned about making your webpages responsive with this quiz." ] }, "lecture-working-with-css-variables": { "title": "Working with CSS Variables", "intro": [ - "In these lecture videos, you will learn about working with CSS variables." + "In these lecture videos, you will learn how to define and use custom properties (also known as CSS variables). You will also learn about the @property rule and how it works." ] }, "workshop-city-skyline": { @@ -2378,25 +2466,26 @@ }, "lab-availability-table": { "title": "Build an Availability Table", - "intro": ["For this lab, you will create an availability table."] + "intro": [ + "For this lab, you'll create an availability table that shows the availability of people for a meeting.", + "You'll practice using CSS variables to store and reuse colors, fonts, and other styles." + ] }, "review-css-variables": { "title": "CSS Variables Review", "intro": [ - "Before you are quizzed on the fundamentals of CSS variables, you first need to review.", - "Open up this page to review how to work with CSS custom properties(CSS variables) and the @property rule." + "Before you're quizzed on the fundamentals of CSS variables, you should review what you've learned.", + "Open up this page to review how to work with CSS custom properties (CSS variables) and the @property rule." ] }, "quiz-css-variables": { "title": "CSS Variables Quiz", - "intro": [ - "Test what you've learned in this quiz of how using variables in CSS." - ] + "intro": ["Test your knowledge of CSS variables with this quiz."] }, "lecture-working-with-css-grid": { "title": "Working with CSS Grid", "intro": [ - "In these lecture videos, you will learn about working with CSS grid." + "In these lecture videos, you will learn about CSS grid, its several properties and how to use them, and how CSS grid differs from flexbox." ] }, "workshop-magazine": { @@ -2406,46 +2495,53 @@ "In this workshop, you'll build a magazine article. You'll practice how to use CSS Grid, including concepts like grid rows and grid columns." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Design a Magazine Layout", + "intro": [ + "In this lab, you will design a magazine layout using CSS Grid, including concepts like grid rows and grid columns." + ] }, "lecture-debugging-css": { "title": "Debugging CSS", "intro": [ - "In these lecture videos, you will learn about debugging CSS." + "In this lecture video, you'll learn how to debug CSS using your browser's developer tools and CSS validators." ] }, "lab-product-landing-page": { "title": "Build a Product Landing Page", "intro": [ - "For this project, you will build a product landing page to market a product of your choice." + "In this project, you'll build a product landing page to market a product of your choice." ] }, "review-css-grid": { "title": "CSS Grid Review", "intro": [ - "Review the CSS Grid concepts to prepare for the upcoming quiz." + "Before you're quizzed on the fundamentals of CSS Grid, you should review what you've learned.", + "Open up this page to review how to work with the different CSS Grid properties like grid-template-columns, grid-gap and more." ] }, "quiz-css-grid": { "title": "CSS Grid Quiz", - "intro": ["Test what you've learned in this quiz of using grid in CSS."] + "intro": ["Test your knowledge of CSS Grid with this quiz."] }, "lecture-animations-and-accessibility": { "title": "Animations and Accessibility", "intro": [ - "In these lecture videos, you will learn about animations and accessibility." + "In these lecture videos, you will learn about CSS animations and their accessibility concerns. You will also learn how prefers-reduced-motion can help address those accessibility concerns." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Build an Animated Ferris Wheel", + "intro": [ + "You can use CSS animation to draw attention to specific sections of your webpage and make it more engaging.", + "In this workshop, you'll build a Ferris wheel. You'll practice how to use CSS to animate elements, transform them, and adjust their speed." + ] }, "lab-moon-orbit": { "title": "Build a Moon Orbit", "intro": [ - "For this lab, you will create an animation of the moon orbiting the earth." + "In this lab, you'll create an animation of the moon orbiting the earth.", + "You'll practice animation properties like animation-name, animation-duration, animation-timing-function, and more." ] }, "workshop-flappy-penguin": { @@ -2458,76 +2554,86 @@ "lab-personal-portfolio": { "title": "Build a Personal Portfolio", "intro": [ - "For this project, you will build your own personal portfolio page." + "In this project, you'll build your own personal portfolio page." ] }, "review-css-animations": { "title": "CSS Animations Review", "intro": [ - "Review the CSS Animations concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with CSS animations, you should review what you've learned about them.", + "Open up this page to review concepts including prefers-reduced-motion, the @keyframes rule and more." ] }, "quiz-css-animations": { "title": "CSS Animations Quiz", - "intro": [ - "Test what you've learned in this quiz of using animations in CSS." - ] + "intro": ["Test your knowledge of CSS animations with this quiz."] }, "review-css": { "title": "CSS Review", - "intro": ["Review the CSS concepts to prepare for the upcoming exam."] + "intro": [ + "Before you take the CSS prep exam, you first need to review the concepts taught in the previous modules.", + "Open up this page to review concepts around the basics of CSS, responsive web design, animations, accessibility and more." + ] }, "wvjx": { "title": "127", "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Working with Code Editors and IDEs", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "In these lecture videos, you will learn how to work with code editors and IDEs. You will learn various concepts about the most popular code editor, VS Code such as its installation, how to create a project in it, keyboard shortcuts, and extensions." ] }, "lecture-introduction-to-javascript": { "title": "Introduction to JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "In these lecture videos, you will learn the fundamentals of JavaScript. Topics covered include, but are not limited to, variables, data types, how JavaScript interacts with HTML and CSS, strings, and much more." ] }, "workshop-greeting-bot": { "title": "Build a Greeting Bot", "intro": [ - "For this workshop, you will learn how to work with JavaScript fundamentals by building a greeting bot.", + "In this workshop, you will learn JavaScript fundamentals by building a greeting bot.", "You will learn about variables, let, const, console.log and basic string usage." ] }, "lab-javascript-trivia-bot": { "title": "Build a JavaScript Trivia Bot", "intro": [ - "In this lab, you will practice working with JavaScript variables and strings by building a trivia bot." + "In this lab, you'll practice working with JavaScript variables and strings by building a trivia bot.", + "You'll practice how to use variables and basic strings." + ] + }, + "lab-sentence-maker": { + "title": "Build a Sentence Maker", + "intro": [ + "In this lab, you'll create different stories by assigning different words to different variables." ] }, "lecture-working-with-data-types": { "title": "Working with Data Types", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "In the following lecture videos, you will learn how to work with data types in JavaScript. You will also learn how dynamic typing differs from static typing, the typeof operator, and the typeof null bug." ] }, "review-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Review", "intro": [ - "Review the JavaScript Variables and Data Types concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript variables and data types you first need to review the concepts.", + "Open up this page to review variables, data types, logging and commenting." ] }, "quiz-javascript-variables-and-data-types": { "title": "JavaScript Variables and Data Types Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Variables and Data Types." + "Test your knowledge of JavaScript variables and data types with this quiz." ] }, "lecture-working-with-strings-in-javascript": { "title": "Working with Strings in JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "In these lecture videos, you will learn how to work with strings in JavaScript. You will learn how to access characters from a string, how to use template literals and interpolation, how to create a new line in strings, and much more." ] }, "workshop-teacher-chatbot": { @@ -2540,25 +2646,24 @@ "lecture-working-with-common-string-methods": { "title": "Working with Common String Methods", "intro": [ - "In these lecture videos, you will learn about common String methods." + "In these lecture videos, you will learn about the common string methods available in JavaScript. The string methods will let you do things like extracting a part of a string, changing the casing for a string, replacing a part of a string, trimming whitespace from a string, and much more." ] }, "review-javascript-strings": { "title": "JavaScript Strings Review", "intro": [ - "Review the JavaScript Strings concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with JavaScript strings, you first need to review.", + "Open up this page to review how to work with template literals, the slice method, the includes method, the trim method and more." ] }, "quiz-javascript-strings": { "title": "JavaScript Strings Quiz", - "intro": [ - "Test what you've learned in this quiz on JavaScript Strings." - ] + "intro": ["Test your knowledge of JavaScript strings with this quiz."] }, "lecture-working-with-numbers-booleans-and-the-math-object": { "title": "Working with Numbers, Booleans, and the Math Object", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "In these lecture videos, you will dive into the fundamentals of JavaScript. These include numbers, booleans, and the Math object. You will learn about different types of numbers, how arithmetic and comparison operators work, how JavaScript behaves when you combine strings and numbers in calculations, and much more." ] }, "workshop-mathbot": { @@ -2570,65 +2675,65 @@ "lab-fortune-teller": { "title": "Build a Fortune Teller", "intro": [ - "In this lab, you will build a fortune teller by randomly selecting a fortune from the avaialble fortunes." + "In this lab, you'll build a fortune teller by randomly selecting a fortune from the available fortunes.", + "You'll practice how to work with the Math.random() method and the Math.floor() method to generate random numbers." ] }, "lecture-working-with-numbers-and-common-number-methods": { "title": "Working with Numbers and Common Number Methods", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "In these lecture videos, you will learn about numbers and common number methods. These include isNaN(), parseInt(), parseFloat(), and toFixed()." ] }, "review-javascript-math": { "title": "JavaScript Math Review", "intro": [ - "Review the JavaScript Math concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with the Math object, you should review what you've learned.", + "Open up this page to review how to work with the Math.random() method, the Math.floor() method and more." ] }, "quiz-javascript-math": { "title": "JavaScript Math Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Math."] + "intro": [ + "Test your knowledge of the JavaScript Math object with this quiz." + ] }, "lecture-understanding-comparisons-and-conditionals": { "title": "Understanding Comparisons and Conditionals", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "In these lecture videos, you will learn about comparison operators and conditionals. You will learn how the various conditionals differ from one another, and how comparisons work with null and undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Review", "intro": [ - "Review the JavaScript Comparisons and Conditionals concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with conditionals, you should review what you've learned about them.", + "Open up this page to review how to work with switch statements, other types of conditionals and more." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "JavaScript Comparisons and Conditionals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Comparisons and Conditionals." + "Test your knowledge of JavaScript Comparisons and Conditionals with this quiz." ] }, "lecture-working-with-functions": { "title": "Working with Functions", "intro": [ - "In these lecture videos, you will learn about working with functions." + "In these lecture videos, you will learn how to reuse a block of code with functions. You will learn what the purpose of a function is and how they work, and how scope works in programming. " ] }, "workshop-calculator": { "title": "Build a Calculator", "intro": [ - "In this workshop, you will review working with functions by building a calculator." + "In this workshop, you will review your knowledge of functions by building a calculator." ] }, "lab-email-masker": { "title": "Build an Email Masker", "intro": [ - "In this lab, you'll build an email masker that will take an email address and obscure it." - ] - }, - "lab-sentence-maker": { - "title": "Build a Sentence Maker", - "intro": [ - "In this lab, you will create different stories by assigning different words to different variables." + "In this lab, you'll build an email masker that will take an email address and obscure it.", + "You'll practice string slicing, concatenation, and using functions." ] }, "workshop-loan-qualification-checker": { @@ -2641,55 +2746,61 @@ "lab-leap-year-calculator": { "title": "Build a Leap Year Calculator ", "intro": [ - "In this lab you will use conditional statements and loops to determine if a year is a leap year." + "In this lab you'll use conditional statements and loops to determine if a year is a leap year." ] }, "review-javascript-functions": { "title": "JavaScript Functions Review", "intro": [ - "Review the JavaScript Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript functions, you should review what you've learned about them.", + "Open up this page to review functions, arrow functions and scope." ] }, "quiz-javascript-functions": { "title": "JavaScript Functions Quiz", + "intro": ["Test your knowledge of JavaScript functions with this quiz."] + }, + "lecture-working-with-arrays": { + "title": "Working with Arrays", "intro": [ - "Test what you've learned in this quiz on JavaScript Functions." + "In these lecture videos, you will learn how to work with JavaScript arrays. You will learn about what makes an array, one-dimensional and two-dimensional arrays, how to access and update the elements in an array, and much more." ] }, - "mexq": { - "title": "157", - "intro": [] - }, "workshop-shopping-list": { "title": "Build a Shopping List", "intro": [ - "In this workshop, you will practice working with arrays by building a shopping list.", + "In this workshop, you will practice how to work with arrays by building a shopping list.", "You will review how to add and remove elements from an array using methods like push, pop, shift, and unshift." ] }, "lab-lunch-picker-program": { "title": "Build a Lunch Picker Program", "intro": [ - "In this lab, you will review working with arrays and random numbers by building a lunch picker program." + "In this lab, you'll review working with arrays and random numbers by building a lunch picker program." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Working with Common Array Methods", + "intro": [ + "In these lecture videos, you will learn about the array methods for performing more advanced operations like getting the position of an item in an array, checking if an array contains a certain element, copying an array, and lots more." + ] }, "review-javascript-arrays": { "title": "JavaScript Arrays Review", "intro": [ - "Review the JavaScript Arrays concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript arrays, you should review what you've learned about them.", + "Open up this page to review concepts like array destructuring, how to add and remove elements from an array, and more." ] }, "quiz-javascript-arrays": { "title": "JavaScript Arrays Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Arrays."] + "intro": ["Test your knowledge of JavaScript arrays with this quiz."] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Working with Objects", + "intro": [ + "In these lecture videos, you will learn how to work with JavaScript objects. The concepts you will learn include how to access properties from an object, check if an object has a property, how object methods differ from functions, object destructuring, and much more." + ] }, "workshop-recipe-tracker": { "title": "Build a Recipe Tracker", @@ -2699,152 +2810,196 @@ }, "lab-quiz-game": { "title": "Build a Quiz Game", - "intro": ["For this lab, you will build a quiz game."] + "intro": [ + "In this lab, you'll build a quiz game using JavaScript arrays and objects.", + "You'll also practice using functions to randomly select a question and an answer from an array and compare them." + ] }, "review-javascript-objects": { "title": "JavaScript Objects Review", "intro": [ - "Review the JavaScript Objects concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript objects, you should review what you've learned about them.", + "Open up this page to review concepts including how to access information from objects, object destructuring, working with JSON, and more." ] }, "quiz-javascript-objects": { "title": "JavaScript Objects Quiz", + "intro": ["Test your knowledge of JavaScript objects with this quiz."] + }, + "lecture-working-with-loops": { + "title": "Working with Loops", "intro": [ - "Test what you've learned in this quiz on JavaScript Objects." + "Loops are an essential part of JavaScript. That's why the following lecture videos have been prepared for you to learn about the different types of loops and how they work, and also how iteration works." ] }, - "kgtw": { - "title": "168", - "intro": [] - }, "workshop-sentence-analyzer": { "title": "Build a Sentence Analyzer", "intro": [ - "In this workshop, you'll review working with JavaScript loops by building a sentence analyzer app." + "In this workshop, you'll review how to work with JavaScript loops by building a sentence analyzer app." ] }, "lab-factorial-calculator": { "title": "Build a Factorial Calculator ", - "intro": ["In this lab, you will build a factorial calculator."] + "intro": [ + "In this lab, you'll build a factorial calculator.", + "You'll practice using loops and conditionals to calculate the factorial of a number." + ] }, "review-javascript-loops": { "title": "JavaScript Loops Review", "intro": [ - "Review the JavaScript Loops concepts to prepare for the upcoming quiz." + "Before you're quizzed on the different JavaScript loops, you should review them.", + "Open up this page to review the for...of loop, while loop, break and continue statements and more." ] }, "quiz-javascript-loops": { "title": "JavaScript Loops Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Loops."] + "intro": ["Test your knowledge of JavaScript loops with this quiz."] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Understanding Core JavaScript Fundamentals", + "intro": [ + "In these lecture videos, you will learn more about the core JavaScript fundamentals. You will learn how a string object differs from a primitive string, the toString() method, conventions and common practices for naming variables, linters and formatters, closures, and much more." + ] }, "lab-pyramid-generator": { "title": "Build a Pyramid Generator", - "intro": ["In this lab you will build a pyramid generator."] + "intro": [ + "In this lab you'll build a pyramid generator.", + "You'll take a number as input and generate a pyramid with that many levels using a loop." + ] }, "lab-gradebook-app": { "title": "Build a Gradebook App", - "intro": ["For this lab, you will create a gradebook app."] + "intro": [ + "For this lab, you'll create a gradebook app.", + "You'll practice conditionals to determine the student's grade based on their score." + ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "The var Keyword and Hoisting", + "intro": [ + "In these lecture videos, you will learn about the var keyword and why it is not recommended for use anymore. You will also learn about hoisting in JavaScript so you can avoid subtle bugs in your code." + ] }, "lab-inventory-management-program": { "title": "Build an Inventory Management Program", "intro": [ - "For this lab, you will build an inventory management program using JavaScript." + "For this lab, you'll build an inventory management program using JavaScript.", + "You'll use JavaScript array of objects to manage the inventory." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Understanding Modules, Imports, and Exports", + "intro": [ + "In this lecture video, you will learn about modules, imports, and exports in JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Build a Password Generator App", + "intro": [ + "In this lab, you'll build a password generator app based on the user's input." + ] }, "review-javascript-fundamentals": { "title": "JavaScript Fundamentals Review", "intro": [ - "Review the JavaScript Fundamentals concepts to prepare for the upcoming quiz." + "Before you are quizzed on JavaScript fundamentals, you first need to review the concepts.", + "Open up this page to review concepts like closures, memory management, and more." ] }, "quiz-javascript-fundamentals": { "title": "JavaScript Fundamentals Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Fundamentals Quiz." + "Test your knowledge of JavaScript fundamentals with this quiz." ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Working with Higher Order Functions and Callbacks", + "intro": [ + "In these lecture videos, you will learn how to work with higher order functions and callbacks. The higher order functions you will learn include map(), filter(), reduce(), sort(), every(), and some(). You will also learn how to chain these methods together to achieve your desired results." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Build a Library Manager", + "intro": [ + "In this workshop, you will learn higher order array methods by building a library manager" + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Build a Book Organizer", + "intro": [ + "In this lab, you'll build a book organizer using higher order functions in JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Review", "intro": [ - "Review the JavaScript Higher Order Functions concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript higher order functions, you should review them.", + "Open up this page to review concepts including how to work with the map(), filter(), and reduce() methods." ] }, "quiz-javascript-higher-order-functions": { "title": "JavaScript Higher Order Functions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Higher Order Functions." + "Test your knowledge of JavaScript higher order functions with this quiz." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Working with the DOM, Click Events, and Web APIs", + "intro": [ + "In these lecture videos, you will learn how to work with the Document Object Model (DOM), the `addEventListener()` method and events, and web APIs." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Build a Storytelling App", + "intro": [ + "In this workshop, you will build a storytelling app that will allow you to list different stories based on genre." + ] }, "lab-favorite-icon-toggler": { "title": "Build a Favorite Icon Toggler", "intro": [ - "In this lab, you will build a favorite icon toggler by utilizing JavaScript click events." + "In this lab, you'll build a favorite icon toggler by utilizing JavaScript click events." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Review", "intro": [ - "Review the DOM Manipulation and Click Events with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on the DOM, you should review what you've learned about it.", + "Open up this page to review concepts including how to work with the DOM, Web API's/code>, the addEventListener() method and more." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "DOM Manipulation and Click Events with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on DOM Manipulation and Click Events with JavaScript Quiz." + "Test your knowledge of DOM manipulation and click events in JavaScript with this quiz." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Understanding the Event Object and Event Delegation", + "intro": [ + "In these lecture videos, you will learn about the event object, the change event, event bubbling, and event delegation." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Build a Music Instrument Filter", + "intro": [ + "In this workshop, you will build a music instrument filter with JavaScript." + ] }, "lab-real-time-counter": { "title": "Build a Real Time Counter", - "intro": ["In this lab, you will build a real-time character counter"] + "intro": [ + "In this lab, you'll build a real-time character counter", + "You'll practice how to work with the input event when the user types in the input field." + ] }, "lab-lightbox-viewer": { "title": "Build a Lightbox Viewer", "intro": [ - "In this lab, you will build a lighbox viewer for viewing images in a focused mode." + "In this lab, you'll build a lighbox viewer for viewing images in a focused mode.", + "You'll practice click events and toggling classes." ] }, "workshop-rps-game": { @@ -2862,74 +3017,85 @@ "lab-football-team-cards": { "title": "Build a Set of Football Team Cards", "intro": [ - "One common aspect of building web applications is processing datasets and outputting information to the screen. In this project, you will use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." + "In this lab, you'll use DOM manipulation, object destructuring, event handling, and data filtering to build a set of football team cards." ] }, "review-javascript-events": { "title": "JavaScript Events Review", "intro": [ - "Review the JavaScript Events concepts to prepare for the upcoming quiz." + "Before you're quizzed on events, you should review what you've learned.", + "Open up this page to review concepts like change events, event bubbling, and event delegation." ] }, "quiz-javascript-events": { "title": "JavaScript Events Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Events."] + "intro": ["Test your knowledge of JavaScript events with this quiz."] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Debugging Techniques", + "intro": [ + "In these lecture videos, you will learn about the common errors in JavaScript and the techniques you can use to fix them – a process called debugging." + ] }, "lab-random-background-color-changer": { "title": "Debug a Random Background Color Changer", "intro": [ - "For this lab, you will debug a random background color changer and fix the errors to make it work properly." + "In this lab, you'll debug a random background color changer and fix the errors to make it work properly." ] }, "review-debugging-javascript": { "title": "Debugging JavaScript Review", "intro": [ - "Review the Debugging JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on common debugging techniques, you should review what you've learned.", + "Open up this page to review concepts including how to work with the throw statement, try...catch...finally/code> and more." ] }, "quiz-debugging-javascript": { "title": "Debugging JavaScript Quiz", + "intro": ["Test your knowledge of JavaScript debugging with this quiz."] + }, + "lecture-working-with-regular-expressions": { + "title": "Working with Regular Expressions", "intro": [ - "Test what you've learned in this quiz on Debugging JavaScript." + "In these lecture videos, you will learn about regular expressions in JavaScript. You will learn about the methods for working with regular expressions, modifiers, character classes, lookaheads, lookbehinds, back-references, quantifiers, and more." ] }, - "ilop": { - "title": "205", - "intro": [] - }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Build a Spam Filter", + "intro": [ + "Regular expressions, often shortened to \"regex\" or \"regexp\", are patterns that help programmers match, search, and replace text. Regular expressions are powerful, but can be difficult to understand because they use so many special characters.", + "In this workshop, you'll use capture groups, positive lookaheads, negative lookaheads, and other techniques to match any text you want." + ] }, "lab-markdown-to-html-converter": { "title": "Build a Markdown to HTML Converter", "intro": [ - "For this lab, you will build a Markdown to HTML converter using JavaScript." + "For this lab, you'll build a Markdown to HTML converter using JavaScript.", + "You'll practice regular expressions, string manipulation, and more." ] }, "lab-regex-sandbox": { "title": "Build a RegEx Sandbox", - "intro": ["In this lab you will build a regex sandbox."] + "intro": ["In this lab you'll build a regex sandbox."] }, "review-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Review", "intro": [ - "Review the JavaScript Regular Expressions concepts to prepare for the upcoming quiz." + "Before you're quizzed on Regular Expressions, you should review what you've learned.", + "Open up this page to review concepts like lookaheads, lookbehinds, common regex modifiers and more." ] }, "quiz-javascript-regular-expressions": { "title": "JavaScript Regular Expressions Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Regular Expressions." + "Test your knowledge of JavaScript Regular Expressions with this quiz." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Understanding Form Validation", + "intro": [ + "In these lecture videos, you will learn about form validation in JavaScript. You will learn about the various ways to validate forms, how the preventDefault() method works, and how the submit event works." + ] }, "workshop-calorie-counter": { "title": "Build a Calorie Counter", @@ -2938,91 +3104,120 @@ "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Build a Customer Complaint Form", + "intro": [ + "For this lab, you'll use JavaScript to validate a customer complaint form.", + "You'll practice how to validate form inputs, display error messages, and prevent the form from submitting if there are errors." + ] }, "review-form-validation-with-javascript": { "title": "Form Validation with JavaScript Review", "intro": [ - "Review the Form Validation with JavaScript concepts to prepare for the upcoming quiz." + "Before you're quizzed on form validation, you should review what you've learned.", + "Open up this page to review concepts including the preventDefault() method, the submit event and more." ] }, "quiz-form-validation-with-javascript": { "title": "Form Validation with JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Form Validation with JavaScript." + "Test what you've learned about JavaScript form validation with this quiz." ] }, - "lupt": { - "title": "216", - "intro": [] + "lecture-working-with-dates": { + "title": "Working with Dates", + "intro": [ + "In these lecture videos, you will learn about the JavaScript date object. You will learn about the methods for working with dates and how to format dates." + ] }, "lab-date-conversion": { "title": "Build a Date Conversion Program", "intro": [ - "In this lab, you will build a program to convert a date from one format to another." + "In this lab, you'll build a program to convert a date from one format to another." ] }, "review-javascript-dates": { "title": "JavaScript Dates Review", "intro": [ - "Review the JavaScript Dates concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with dates, you should review what you've learned.", + "Open up this page to review the Date() object and common methods." ] }, "quiz-javascript-dates": { "title": "JavaScript Dates Quiz", - "intro": ["Test what you've learned in this quiz on JavaScript Dates."] + "intro": [ + "Test what you've learned about JavaScript Dates with this quiz." + ] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Working with Audio and Video", + "intro": [ + "In these lecture videos, you will learn how to work with audio and video files using JavaScript. You will learn about the Audio and Video constructors, their methods and properties, audio and video formats, codecs, the HTMLMediaElement API, and much more." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Build a Music Player", + "intro": [ + "In this workshop, you'll code a basic MP3 player using HTML, CSS, and JavaScript.", + "The project covers fundamental concepts such as handling audio playback, managing a playlist, implementing play, pause, next, and previous functionalities and dynamically update your user interface based on the current song." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Build a Drum Machine", + "intro": [ + "For this lab you will use the audio element to build a drum machine." + ] }, "review-javascript-audio-and-video": { "title": "JavaScript Audio and Video Review", "intro": [ - "Review the JavaScript Audio and Video concepts to prepare for the upcoming quiz." + "Before you're quizzed on working with audio and video in JavaScript, you should review what you've learned about them.", + "Open up this page to review concepts including the Audio constructor, the HTMLMediaElement API and more." ] }, "quiz-javascript-audio-and-video": { "title": "JavaScript Audio and Video Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Audio and Video." + "Test what you've learned about JavaScript audio and video with this quiz." ] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Working with Maps and Sets", + "intro": [ + "In these lecture videos, you will learn about JavaScript Map and Set. You will also learn how they both differ from WeakSets and WeakMaps" + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Build a Plant Nursery Catalog", + "intro": [ + "In this workshop, you will practice using Maps and Sets by building a plant nursery catalog." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Build a Voting System", + "intro": [ + "In this lab, you'll build a voting system using Maps and Sets.", + "You'll practice how to use the Map object to store key-value pairs and the Set object to store unique values." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "JavaScript Maps, Sets, and JSON Review", + "review-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Review", "intro": [ - "Review the JavaScript Maps, Sets, and JSON concepts to prepare for the upcoming quiz." + "Before you're quizzed on JavaScript Maps and Sets, you should review what you've learned about them.", + "Open up this page to review concepts such as the Map and Set objects, as well as WeakSet and WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "JavaScript Maps and Sets Quiz", + "intro": [ + "Test what you've learned about JavaScript Maps and Sets with this quiz." + ] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Working with Client-Side Storage and CRUD Operations", + "intro": [ + "In these lecture videos, you will learn about client-side storage and CRUD operations in JavaScript. You will learn about localStorage and sessionStorage alongside their methods and properties, cookies, the Cache API, IndexDB, and much more." + ] }, "workshop-todo-app": { "title": "Build a Todo App using Local Storage", @@ -3033,155 +3228,130 @@ }, "lab-bookmark-manager-app": { "title": "Build a Bookmark Manager App", - "intro": ["For this lab, you will build a bookmark manager app."] + "intro": [ + "For this lab, you'll build a bookmark manager app.", + "You'll utilize local storage to store bookmarks, and practice how to add, remove, and display bookmarks." + ] }, "review-local-storage-and-crud": { "title": "Local Storage and CRUD Review", "intro": [ - "Review the Local Storage and CRUD concepts to prepare for the upcoming quiz." + "Before you are quizzed on working with localStorage, you first need to review the concepts.", + "Open up this page to review the localStorage property, sessionStorage property and more." ] }, "quiz-local-storage-and-crud": { "title": "Local Storage and CRUD Quiz", "intro": [ - "Test what you've learned in this quiz on Local Storage and CRUD." + "Test what you've learned about local storage and CRUD with this quiz." ] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Understanding How to Work with Classes in JavaScript", + "intro": [ + "In these lecture videos, you will learn about classes in JavaScript. You will learn about inheritance, the this keyword, static properties and methods, and more." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Build a Shopping Cart", + "intro": [ + "In this workshop you'll create a shopping cart using JavaScript classes.", + "You will practice how to use the this keyword, create class instances, implement methods for data manipulation and more." + ] }, "lab-project-idea-board": { "title": "Build a Project Idea Board", "intro": [ - "In this lab, you will build a project idea board using OOP in JavaScript." + "In this lab, you'll build a project idea board using OOP in JavaScript.", + "You'll practice how to create classes, add methods to classes, and create instances of classes." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Build a Bank Account Management Program", + "intro": [ + "In this lab, you'll build a simple transaction management system for a bank account." + ] }, "review-javascript-classes": { "title": "JavaScript Classes Review", "intro": [ - "Review the JavaScript Classes concepts to prepare for the upcoming quiz." + "Before you're quizzed on how to work with classes, you should review what you've learned about them.", + "Open up this page to review concepts including the this keyword, class inheritance and more." ] }, - "ndl1": { - "title": "240", - "intro": [] - }, - "ndl2": { - "title": "241", - "intro": [] - }, - "ndl3": { - "title": "242", - "intro": [] - }, - "ndl4": { - "title": "243", - "intro": [] - }, - "review-recursion": { - "title": "Recursion Review", + "quiz-javascript-classes": { + "title": "JavaScript Classes Quiz", "intro": [ - "Review the Recursion concepts to prepare for the upcoming quiz." + "Test what you've learned about JavaScript Classes with this quiz." ] }, - "quiz-recursion": { - "title": "Recursion Quiz", - "intro": ["Test what you've learned in this quiz on Recursion."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "JavaScript Functional Programming Quiz", + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Understanding Recursion and the Call Stack", "intro": [ - "Test what you've learned in this quiz on JavaScript Functional Programming." + "In this lecture video, you will learn about recursion and the call stack." ] }, - "lab-quicksort-algorithm": { - "title": "Build the Quicksort Algorithm", + "workshop-decimal-to-binary-converter": { + "title": "Build a Decimal to Binary Converter", "intro": [ - "For this lab, you will implement the Quicksort algorithm using JavaScript." + "Recursion is a programming concept where a function calls itself. This can reduce a complex problem into simpler sub-problems, until they become straightforward to solve.", + "In this workshop, you’ll build a decimal-to-binary converter using JavaScript. You’ll practice the fundamental concepts of recursion, explore the call stack, and build out a visual representation of the recursion process through an animation." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Searching and Sorting Algorithms Quiz", + "lab-permutation-generator": { + "title": "Build a Permutation Generator", "intro": [ - "Test what you've learned in this quiz on Searching and Sorting Algorithms." + "For this lab, you'll build a permutation generator that produces all possible permutations of a given string." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Build a Roman Numeral Converter", + "review-recursion": { + "title": "Recursion Review", "intro": [ - "For this lab, you'll build an application that converts integers to Roman numerals." + "Before you're quizzed on recursion, you should review what you've learned.", + "Open up this page to review what is recursion and what is it used for." ] }, - "yaxm": { - "title": "245", - "intro": [] + "quiz-recursion": { + "title": "Recursion Quiz", + "intro": ["Test your knowledge of Recursion with this quiz."] }, - "lab-telephone-number-validator": { - "title": "Build a Telephone Number Validator", + "lecture-understanding-functional-programming": { + "title": "Understanding Functional Programming", "intro": [ - "For this lab, you'll build an application that checks if a number is a valid United States phone number." + "In these lecture videos, you will learn about functional programming and how to nest functions using a technique called currying." ] }, - "lab-cash-register": { - "title": "Build a Cash Register", - "intro": ["For this lab, you will build a cash register."] + "workshop-recipe-ingredient-converter": { + "title": "Build a Recipe Ingredient Converter", + "intro": [ + "In the previous lecture videos, you learned the core concepts behind functional programming and currying.", + "Now you will be able to apply what you have learned about currying and functional programming by building a recipe ingredient converter application." + ] }, - "udia": { - "title": "248", - "intro": [] + "lab-sorting-visualizer": { + "title": "Build a Sorting Visualizer", + "intro": [ + "For this lab, you'll use JavaScript to visualize the steps that the Bubble Sort algorithm takes to reorder an array of integers." + ] }, "review-javascript-functional-programming": { "title": "JavaScript Functional Programming Review", "intro": [ - "Review the JavaScript Functional Programming concepts to prepare for the upcoming quiz." + "Before you're quizzed on functional programming, you should review what you've learned.", + "Open up this page to review concepts on functional programming, currying and more." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "JavaScript Problem Solving and Algorithmic Thinking Quiz", + "quiz-javascript-functional-programming": { + "title": "JavaScript Functional Programming Quiz", "intro": [ - "Test what you've learned in this quiz on JavaScript Problem Solving and Algorithmic Thinking." + "Test what you've learned about JavaScript functional programming with this quiz." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Understanding Asynchronous Programming", + "intro": [ + "In these lecture videos, you will learn about asynchronous programming in JavaScript. You will learn about the differences between synchronous and asynchronous programming, how the asnyc keyword works, the Fetch API, promises, async/await, the Geolocation API, and much more." + ] }, "workshop-fcc-authors-page": { "title": "Build an fCC Authors Page", @@ -3190,118 +3360,119 @@ "In this workshop you will practice how to use the fetch method, dynamically update the DOM to display the fetched data and paginate your data so you can load results in batches." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Build an fCC Forum Leaderboard", + "intro": [ + "For this lab you'll practice asynchronous JavaScript by coding your own freeCodeCamp forum leaderboard." + ] }, "review-asynchronous-javascript": { "title": "Asynchronous JavaScript Review", "intro": [ - "Review the Asynchronous JavaScript concepts to prepare for the upcoming quiz." + "Review asynchronous JavaScript concepts to prepare for the upcoming quiz." ] }, "quiz-asynchronous-javascript": { "title": "Asynchronous JavaScript Quiz", "intro": [ - "Test what you've learned in this quiz on Asynchronous JavaScript." + "Test what you've learned about asynchronous JavaScript with this quiz." ] }, "review-javascript": { "title": "JavaScript Review", "intro": [ - "Review the JavaScript concepts to prepare for the upcoming quiz." + "Before you take the JavaScript prep exam, you should review everything you've learned about JavaScript.", + "Open up this page, to review all of the concepts taught including variables, strings, booleans, functions, objects, arrays, debugging, working with the DOM and more." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Introduction to JavaScript Libraries and Frameworks", + "intro": [ + "In these lecture videos, you will get an introduction to JavaScript libraries and frameworks. You will learn about the roles of JavaScript libraries and frameworks, single page applications (SPAs) and the issue surrounding them, and React, the most popular frontend JavaScript library." + ] }, - "quiz-javascript-object-oriented-programming": { - "title": "JavaScript Object Oriented Programming Quiz", + "workshop-reusable-mega-navbar": { + "title": "Build a Reusable Mega Navbar", "intro": [ - "Test what you've learned in this quiz on JavaScript Object Oriented Programming." + "In the previous lecture videos, you learned how to work with components in React.", + "In this workshop, you will build a reusable Navbar component using React." ] }, - "nixz": { - "title": "262", - "intro": [] + "lab-reusable-footer": { + "title": "Build a Reusable Footer", + "intro": ["In this lab, you'll use React to build a reusable footer."] }, - "lab-stack-class": { - "title": "Build a Stack Class", + "lecture-working-with-data-in-react": { + "title": "Working with Data in React", "intro": [ - "For this lab, you will build a stack class using JavaScript." + "In these lecture videos, you will learn how to work with data in React. You will learn about props and how to pass them around, conditional rendering, how to render lists, and how to use inline styles." ] }, - "lab-linked-list-class": { - "title": "Build a Linked List Class", + "workshop-reusable-profile-card-component": { + "title": "Build a Reusable Profile Card Component", "intro": [ - "For this lab, you will build a linked list class using JavaScript." + "In this workshop, you will learn how to work with props by building a reusable profile card component." ] }, - "lab-hash-table-class": { - "title": "Build a Hash Table Class", - "intro": ["For this lab, you will build a hash table using JavaScript."] - }, - "muyw": { - "title": "266", - "intro": [] + "lab-mood-board": { + "title": "Build a Mood Board", + "intro": [ + "In this lab, you'll create a mood board using React.", + "You'll practice how to pass data from a parent component to a child component using props." + ] }, - "quiz-javascript-data-structures": { - "title": "JavaScript Data Structures Quiz", + "review-react-basics": { + "title": "React Basics Review", "intro": [ - "Test what you've learned in this quiz on JavaScript Data Structures." + "Review basic React concepts to prepare for the upcoming quiz." ] }, + "quiz-react-basics": { + "title": "React Basics Quiz", + "intro": ["Test your knowledge of React basics with this quiz."] + }, + "rugw": { + "title": "267", + "intro": [] + }, "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Implement the Depth-First Search Algorithm", - "intro": [ - "For this lab, you will use JavaScript to implement the Depth-First Search algorithm." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Graphs and Trees Quiz", - "intro": ["Test what you've learned in this quiz on Graphs and Trees."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Build the nth Fibonacci number generator", - "intro": [ - "For this lab, you will implement the nth Fibonacci number generator." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Dynamic Programming Quiz", + "quiz-react-state-and-hooks": { + "title": "React State and Hooks Quiz", "intro": [ - "Test what you've learned in this quiz on Dynamic Programming." + "Test what you've learned about React State and Hooks with this quiz." ] }, + "ftmi": { + "title": "275", + "intro": [] + }, "sgau": { "title": "276", "intro": [] @@ -3310,61 +3481,78 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Build a Weather App", + "intro": [ + "In this lab you'll build a Weather App using an API", + "You'll practice how to fetch data from the API, store and display it on your app." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Build a Pokémon Search App", - "intro": ["For this project, you will build a Pokémon search app."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Advanced React Quiz", + "intro": [ + "Test what you've learned about Advanced React with this quiz." + ] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Web Performance Review", + "intro": [ + "Review the Web Performance concepts to prepare for the upcoming quiz." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Web Performance Quiz", + "intro": [ + "Test what you've learned about Web Performance with this quiz." + ] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Review", + "intro": [ + "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." + ] }, - "quiz-web-standards": { - "title": "Web Standards Quiz", - "intro": ["Test what you've learned in this quiz on Web Standards."] + "quiz-css-libraries-and-frameworks": { + "title": "CSS Libraries and Frameworks Quiz", + "intro": [ + "Test what you've learned about CSS Libraries and Frameworks with this quiz." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Testing Review", + "intro": ["Review testing concepts to prepare for the upcoming quiz."] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Testing Quiz", + "intro": ["Test what you've learned on testing with this quiz."] }, "trvf": { "title": "293", @@ -3382,145 +3570,19 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "React Basics Quiz", - "intro": ["Test what you've learned in this quiz on React Basics."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "React State and Hooks Quiz", - "intro": [ - "Test what you've learned in this quiz on React State and Hooks." - ] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Advanced React Quiz", - "intro": ["Test what you've learned in this quiz on Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Web Performance Review", - "intro": [ - "Review the Web Performance concepts to prepare for the upcoming quiz." - ] - }, - "quiz-web-performance": { - "title": "Web Performance Quiz", - "intro": ["Test what you've learned in this quiz on Web Performance."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { "title": "Typescript Review", "intro": [ - "Review the Typescript concepts to prepare for the upcoming quiz." + "Review Typescript concepts to prepare for the upcoming quiz." ] }, "quiz-typescript": { "title": "TypeScript Quiz", - "intro": ["Test what you've learned in this quiz on TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Review", - "intro": [ - "Review the CSS Libraries and Frameworks concepts to prepare for the upcoming quiz." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "CSS Libraries and Frameworks Quiz", - "intro": [ - "Test what you've learned in this quiz on CSS Libraries and Frameworks." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Testing Review", - "intro": [ - "Review the Testing concepts to prepare for the upcoming quiz." - ] - }, - "quiz-testing": { - "title": "Testing Quiz", - "intro": ["Test what you've learned in this quiz on Testing."] + "intro": ["Test what you've learned on Typescript with this quiz."] }, "review-front-end-libraries": { "title": "Front End Libraries Review", @@ -3528,12 +3590,12 @@ "Review the Front End Libraries concepts to prepare for the upcoming quiz." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { @@ -3551,10 +3613,10 @@ }, "quiz-bash-commands": { "title": "Bash Commands Quiz", - "intro": ["Test what you've learned in this quiz on Bash Commands."] + "intro": ["Test what you've learned bash commands with this quiz."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { @@ -3579,11 +3641,11 @@ "quiz-relational-database": { "title": "Relational Database Quiz", "intro": [ - "Test what you've learned in this quiz on Relational Databases." + "Test what you've learned on relational databases with this quiz." ] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { @@ -3596,15 +3658,15 @@ "review-bash-scripting": { "title": "Bash Scripting Review", "intro": [ - "Review the Bash Scripting concepts to prepare for the upcoming quiz." + "Review the bash scripting concepts you've learned to prepare for the upcoming quiz." ] }, "quiz-bash-scripting": { "title": "Bash Scripting Quiz", - "intro": ["Test what you've learned in this quiz on Bash Scripting."] + "intro": ["Test what you've learned on bash scripting in this quiz."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { @@ -3656,8 +3718,8 @@ "title": "Bash and SQL Quiz", "intro": ["Test what you've learned in this quiz on Bash and SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { @@ -3673,10 +3735,10 @@ }, "quiz-nano": { "title": "Nano Quiz", - "intro": ["Test what you've learned in this quiz on Nano."] + "intro": ["Test what you've learned on Nano with this quiz ."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { @@ -3700,18 +3762,134 @@ }, "review-git": { "title": "Git Review", - "intro": ["Review the Git concepts to prepare for the upcoming quiz."] + "intro": ["Review Git concepts to prepare for the upcoming quiz."] }, "quiz-git": { "title": "Git Quiz", - "intro": ["Test what you've learned in this quiz on Git."] + "intro": ["Test what you've learned on Git with this quiz."] }, "review-relational-databases": { "title": "Relational Databases Review", "intro": [ - "Review the Relational Databases concepts to prepare for the upcoming quiz." + "Review relational databases concepts to prepare for the upcoming quiz." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3720,17 +3898,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Security and Privacy Review", - "intro": [ - "Review the Security and Privacy concepts to prepare for the upcoming quiz." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Security and Privacy Quiz", - "intro": [ - "Test what you've learned in this quiz on Security and Privacy." - ] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3760,6 +3934,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] diff --git a/client/i18n/locales/swahili/links.json b/client/i18n/locales/swahili/links.json index 32dad0f13eea89..0a872b8f7398de 100644 --- a/client/i18n/locales/swahili/links.json +++ b/client/i18n/locales/swahili/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/news/about/", diff --git a/client/i18n/locales/swahili/translations.json b/client/i18n/locales/swahili/translations.json index 3c8f27c8b62c8f..5a3098efff0fa9 100644 --- a/client/i18n/locales/swahili/translations.json +++ b/client/i18n/locales/swahili/translations.json @@ -106,7 +106,10 @@ "donate-now": "Donate Now", "confirm-amount": "Confirm amount", "play-scene": "Press Play", - "closed-caption": "Closed caption" + "closed-caption": "Closed caption", + "share-on-x": "Share on X", + "share-on-bluesky": "Share on BlueSky", + "share-on-threads": "Share on Threads" }, "landing": { "big-heading-1": "Jifunze kuandika code - bila malipo.", @@ -147,7 +150,7 @@ }, { "title": "Free Education", - "description": "Learn from our charity and save money on your education. No paywalls. No hidden costs." + "description": "Learn from our charity and save money on your education. This is made possible by the generous support of our monthly donors." }, { "title": "Extensive Certifications", @@ -166,6 +169,8 @@ "professional-certs-heading": "Earn free professional certifications:", "interview-prep-heading": "Prepare for the developer interview job search:", "legacy-curriculum-heading": "Explore our Legacy Curriculum:", + "next-heading": "Try our beta curriculum:", + "next-english-heading": "Try our latest English curriculum:", "upcoming-heading": "Upcoming curriculum:", "faq": "Maswali yanayoulizwa mara kwa mara:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "Hii inaongeza sauti ya kupendeza ya gitaa la akustika kwenye tovuti. Utapata maoni ya muziki unapoandika kwenye kihariri, unapokamilisha changamoto, unapopata cheti na zaidi.", "sound-volume": "Sauti ya Campfire:", "scrollbar-width": "Upana wa Upau wa kusogeza wa Kihariri", + "reset-editor-layout-tooltip": "Reset the editor layout to its default state", + "reset-editor-layout": "Reset Editor Layout", "shortcuts-explained": "Within a challenge, press ESC followed by the question mark to show a list of available shortcuts.", "username": { "contains invalid characters": "Jina la mtumiaji \"{{username}}\" lina vibambo batili", @@ -346,13 +353,14 @@ "donated": "Donated to the community", "projects": "Projects", "stats": "Stats", + "activity": "Activity", "timeline": "Rekodi ya matukio", "none-completed": "Hakuna changamoto zilizokamilishwa bado.", "get-started": "Anza hapa.", "challenge": "Changamoto", "completed": "Imekamilika", "add-linkedin": "Ongeza uthibitisho huu kwa wasifu wangu wa LinkedIn", - "add-twitter": "Shiriki uthibitishaji huu kwenye Twitter", + "add-twitter": "Share this certification on X", "tweet": "Nimejishindia cheti cha {{certTitle}} @freeCodeCamp! Iangalie hapa: {{certURL}}", "avatar": "Ishara ya {{username}}", "joined": "Umejiunga {{date}}", @@ -361,7 +369,9 @@ "points": "Pointi {{count}} mnamo {{date}}", "points_plural": "Alama {{count}} mnamo {{date}}", "page-number": "{{pageNumber}} kati ya {{totalPages}}", - "edit-my-profile": "Edit My Profile" + "edit-my-profile": "Edit My Profile", + "add-bluesky": "Share this certification on BlueSky", + "add-threads": "Share this certification on Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charitable organization (United States Federal Tax Identification Number: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Kazi", "question": "Swali", "questions": "Questions", + "answered-mcq": "You have unanswered questions and/or incorrect answers.", "explanation": "Explanation", "solution-link": "Kiungo cha Suluhisho", "source-code-link": "Source Code Link", @@ -501,7 +512,9 @@ "complete-both-steps": "Kamilisha hatua zote mbili hapa chini ili kumaliza changamoto.", "runs-in-vm": "Mradi unaendeshwa kwa mashine virtual, kamilisha mazoezi za watumiaji zilizofafanuliwa hapo na upate majaribio yote ya kupita ili kumaliza hatua ya 1.", "completed": "Imekamilika", + "not-completed": "Not completed", "not-started": "Haujaanza", + "steps-completed": "{{completedSteps}} of {{totalSteps}} steps complete", "test": "Jaribio", "sorry-try-again": "Samahani, msimbo wako haupiti. Jaribu tena.", "sorry-keep-trying": "Samahani, msimbo wako haupiti. Zidi kujaribu.", @@ -583,6 +596,7 @@ "redirecting": "Inaelekeza...", "thanks": "Asante kwa kuchangia", "thank-you": "Thank You for Being a Supporter", + "thank-you-continued": "Thank you for your continued support", "success-card-update": "Your card has been updated successfully.", "additional": "Unaweza kutoa mchango wa ziada wa mara moja wa kiasi chochote ukitumia kiungo hiki: <0>{{url}}", "help-more": "Help Our Charity Do More", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Changia sasa ili utusaidie kutengeneza uidhinishaji wa programu za kitaalamu bila malipo kwa wote.", "help-us-reach-20k": "Donate now to help our charity reach our goal of 20,000 monthly supporters this year.", "beta-certification": "This certification is currently in beta. Please consider donating to support the completion of its development.", + "unfinished-certification": "This certification is currently in active development. While there isn't a claimable certification available at the moment, one will be available soon. In the meantime, you're welcome to explore the courses we have created below.", + "consider-donating": "Please consider donating to support the completion of its development.", + "unfinished-certification-2": "This certification will take you a substantial amount of time and effort to complete. If you start now, you may be ready to take the final exam when we launch it in the coming months.", + "consider-donating-2": "If you want to help us speed up development of this curriculum, please <0>consider becoming a supporter of our charity.", "help-us-develop": "Help us develop free professional programming certifications for all.", "nicely-done": "Imefanywa vizuri. Umekamilisha {{block}}.", "credit-card": "Kadi ya Mkopo", @@ -683,7 +701,7 @@ "bear-progress-alt": "Illustration of an adorable teddy bear with a pleading expression holding an empty money jar.", "bear-completion-alt": "Illustration of an adorable teddy bear holding a large trophy.", "flying-bear": "Illustration of an adorable teddy bear wearing a graduation cap and flying with a Supporter badge.", - "crucial-contribution": "Your contribution will be crucial in creating resources that empower millions of people to learn new skills and support their families.", + "crucial-contribution": "Your contributions are crucial in creating resources that empower millions of people to learn new skills and support their families.", "support-benefits-title": "Benefits from becoming a Supporter:", "support-benefits-1": "No more donation prompt popups", "support-benefits-2": "You'll get a Supporter badge", @@ -710,6 +728,8 @@ "help-millions-learn": "Help millions of people learn", "reach-goals-faster": "Reach your goals faster", "remove-distractions": "Remove distractions", + "remove-interruptions": "Remove interruptions", + "acquire-skills-faster": "Acquire skills faster", "animation-description": "This is a 20 second animated advertisement to encourage campers to become supporters of freeCodeCamp. The animation starts with a teddy bear who becomes a supporter. As a result, distracting pop-ups disappear and the bear gets to complete all of its goals. Then, it graduates and becomes an education super hero helping people around the world.", "animation-countdown": "This animation will stop after {{secondsRemaining}} seconds." }, @@ -741,6 +761,7 @@ "result-list": "Search results" }, "misc": { + "coming-soon": "Coming Soon", "offline": "Unaonekana kuwa nje ya mtandao, huenda maendeleo yako yasihifadhiwe", "server-offline": "Seva haikuweza kufikiwa na huenda maendeleo yako yasihifadhiwe. Tafadhali wasiliana na <0>support ikiwa ujumbe huu utaendelea", "unsubscribed": "Umefanikiwa kujiondoa", @@ -852,7 +873,7 @@ "expired-link": "Inaonekana kiungo ulichobofya kimeisha muda wake, tafadhali omba kiungo kipya ili uingie", "signin-success": "Umefanikiwa! Umeingia kwenye akaunti yako. Happy Coding!", "social-auth-gone": "Tunaondoka kwenye uthibitishaji wa kijamii kwa sababu za faragha. Wakati ujao tunapendekeza utumie anwani yako ya barua pepe: {{email}} ili uingie badala yake.", - "name-needed": "Tunahitaji jina lako ili tuweze kuliweka kwenye cheti chako. Ongeza jina lako kwenye mipangilio ya akaunti yako na ubofye kitufe cha kuhifadhi. Kisha tunaweza kutoa cheti chako.", + "name-needed": "We need your name to put it on your certification. Please add your name in your profile and click save. Then we can issue your certification.", "incomplete-steps": "Inaonekana hujakamilisha hatua zinazohitajika. Tafadhali kamilisha miradi inayohitajika ili kudai Cheti cha {{name}}.", "already-claimed": "Inaonekana tayari umedai Cheti cha {{name}}", "cert-claim-success": "@{{username}}, umefanikiwa kudai Cheti cha {{name}}! Hongera kwa niaba ya timu ya freeCodeCamp.org!", @@ -891,6 +912,7 @@ "invalid-update-flag": "Unajaribu kufikia rasilimali zilizopigwa marufuku. Tafadhali omba usaidizi katika https://forum.freecodecamp.org ikiwa hili ni ombi halali.", "generate-exam-error": "Hitilafu ilitokea wakati wa kujaribu kuunda mtihani wako.", "cert-not-found": "The certification {{certSlug}} does not exist.", + "reset-editor-layout": "Your editor layout has been reset.", "ms": { "transcript": { "link-err-1": "Please include a Microsoft transcript URL in the request.", @@ -951,6 +973,8 @@ "issued": "Iliyotolewa", "fulltext": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}} <5>representing approximately {{completionTime}} hours of work", "fulltextNoHours": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}}", + "quincy-larson-signature": "Quincy Larson's Signature", + "julia-liuson-signature": "Julia Liuson's Signature", "project": { "heading-legacy-full-stack": "Kama sehemu ya uthibitishaji huu wa Legacy Full Stack, {{user}} alikamilisha uthibitishaji ufuatao:", "heading-exam": "As part of this certification, {{user}} passed the following exam: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Muundo Wa Wavuti Sikivu", - "responsive-web-design": "Uthibitishaji wa Muundo wa Wavuti Sikivu", - "JavaScript Algorithms and Data Structures": "Legacy JavaScript Algorithms and Data Structures", - "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures Certification", - "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures (Beta) Certification", - "Front End Development Libraries": "Front End Development Libraries", - "front-end-development-libraries": "Udhibitishaji wa Front End Development Libraries", - "Data Visualization": "Taswira ya Data", - "data-visualization": "Udhibitisho wa Taswira ya Data", - "Relational Database": "Hifadhidata ya Relational", - "relational-database-v8": "Edhibitishaji wa Hifadhidata ya Relational", - "Back End Development and APIs": "Back End Development and APIs", - "back-end-development-and-apis": "Udhibitishaji wa Back End Development and APIs", - "Quality Assurance": "Ubora (Quality Assurance)", - "quality-assurance-v7": "Udhibitishaji wa Ubora (Quality Assurance)", - "Scientific Computing with Python": "Scientific Computing with Python", - "scientific-computing-with-python-v7": "Udhibitishaji wa Scientific Computing with Python", - "Data Analysis with Python": "Uchambuzi wa data na Python", - "data-analysis-with-python-v7": "Udhibitisho wa Uchambuzi wa data na Python", - "Information Security": "Usalama wa Habari", - "information-security-v7": "Udhibitisho wa Usalama wa Habari", - "Machine Learning with Python": "Kujifunza kwa Mashine na Python", - "machine-learning-with-python-v7": "Udhibitisho wa Kujifunza kwa Mashine na Python", - "College Algebra with Python": "Algebra ya Chuo na Python", - "college-algebra-with-python-v8": "Udhibitisho wa Algebra ya Chuo na Python", - "Foundational C# with Microsoft": "Msingi wa C# na Microsoft", - "foundational-c-sharp-with-microsoft": "Msingi C# na Cheti cha Microsoft", - "A2 English for Developers": "A2 English for Developers", - "a2-english-for-developers": "A2 English for Developers Certification", - "B1 English for Developers": "B1 English for Developers", - "b1-english-for-developers": "B1 English for Developers Certification", - "Full Stack Developer": "Full Stack Developer", - "full-stack-developer-v9": "Certified Full Stack Developer", - "Legacy Front End": "Legacy Front End", - "legacy-front-end": "Legacy Front End Certification", - "Legacy Back End": "Legacy Back End", - "legacy-back-end": "Legacy Back End Certification", - "Legacy Data Visualization": "Taswira ya Data ya Legacy", - "legacy-data-visualization": "Legacy Data Visualization Certification", - "Legacy Information Security and Quality Assurance": "Usalama wa Taarifa ya Legacy na Uhakikisho wa Ubora", - "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance Certification", - "Legacy Full Stack Certification": "Udhibitishaji wa Legacy Full Stack", - "Legacy Full Stack": "Legacy Full Stack", - "full-stack": "Legacy Full Stack Certification" + "responsive-web-design": "Responsive Web Design", + "responsive-web-design-cert": "Responsive Web Design Certification", + "javascript-algorithms-and-data-structures": "Legacy JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-cert": "Legacy JavaScript Algorithms and Data Structures Certification", + "javascript-algorithms-and-data-structures-v8": "JavaScript Algorithms and Data Structures", + "javascript-algorithms-and-data-structures-v8-cert": "JavaScript Algorithms and Data Structures Certification", + "front-end-development-libraries": "Front End Development Libraries", + "front-end-development-libraries-cert": "Front End Development Libraries Certification", + "data-visualization": "Data Visualization", + "data-visualization-cert": "Data Visualization Certification", + "relational-database-v8": "Relational Database", + "relational-database-v8-cert": "Relational Database Certification", + "back-end-development-and-apis": "Back End Development and APIs", + "back-end-development-and-apis-cert": "Back End Development and APIs Certification", + "quality-assurance-v7": "Quality Assurance", + "quality-assurance-v7-cert": "Quality Assurance Certification", + "scientific-computing-with-python-v7": "Scientific Computing with Python", + "scientific-computing-with-python-v7-cert": "Scientific Computing with Python Certification", + "data-analysis-with-python-v7": "Data Analysis with Python", + "data-analysis-with-python-v7-cert": "Data Analysis with Python Certification", + "information-security-v7": "Information Security", + "information-security-v7-cert": "Information Security Certification", + "machine-learning-with-python-v7": "Machine Learning with Python", + "machine-learning-with-python-v7-cert": "Machine Learning with Python Certification", + "college-algebra-with-python-v8": "College Algebra with Python", + "college-algebra-with-python-v8-cert": "College Algebra with Python Certification", + "foundational-c-sharp-with-microsoft": "Foundational C# with Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Foundational C# with Microsoft Certification", + "a2-english-for-developers": "A2 English for Developers", + "a2-english-for-developers-cert": "A2 English for Developers Certification", + "b1-english-for-developers": "B1 English for Developers", + "b1-english-for-developers-cert": "B1 English for Developers Certification", + "full-stack-developer-v9": "Full Stack Developer", + "full-stack-developer-v9-cert": "Full Stack Developer Certification", + "legacy-front-end": "Legacy Front End", + "legacy-front-end-cert": "Legacy Front End Certification", + "legacy-back-end": "Legacy Back End", + "legacy-back-end-cert": "Legacy Back End Certification", + "legacy-data-visualization": "Legacy Data Visualization", + "legacy-data-visualization-cert": "Legacy Data Visualization Certification", + "information-security-and-quality-assurance": "Legacy Information Security and Quality Assurance", + "information-security-and-quality-assurance-cert": "Legacy Information Security and Quality Assurance Certification", + "full-stack": "Legacy Full Stack", + "full-stack-cert": "Legacy Full Stack Certification" } }, "certification-card": { diff --git a/client/i18n/locales/ukrainian/intro.json b/client/i18n/locales/ukrainian/intro.json index fe73824d1853e3..b0d41c8b26a7c3 100644 --- a/client/i18n/locales/ukrainian/intro.json +++ b/client/i18n/locales/ukrainian/intro.json @@ -244,7 +244,7 @@ "title": "Регулярні вирази", "intro": [ "Регулярні вирази (відомі як «regex» або «regexp») — шаблони, які допомагають програмістам поєднувати, шукати та замінювати текст. Регулярні вирази дуже важливі, але їх важко читати, оскільки у них використовуються спеціальні символи для створення складніших, гнучкіших поєднань.", - "У цьому курсі ви дізнаєтеся як використовувати спеціальні символи, групи захоплення, позитивний та негативний огляди та інші техніки, аби текст відповідав бажаному." + "У цьому курсі ви дізнаєтеся як використовувати спеціальні символи, групи захоплення, позитивні та негативні перевірки та інші техніки, аби текст відповідав бажаному." ] }, "debugging": { @@ -300,7 +300,7 @@ } }, "javascript-algorithms-and-data-structures-v8": { - "title": "Алгоритми JavaScript та структури даних (бета-версія)", + "title": "Алгоритми та структури даних JavaScript", "intro": [ "Розробники використовують HTML та CSS, щоб контролювати вміст та стилізувати сторінку, а JavaScript — щоб зробити цю сторінку інтерактивною.", "У сертифікації «Алгоритми JavaScript та структури даних» ви вивчите основи JavaScript, включно зі змінними, масивами, об’єктами, циклами, функціями, об’єктною моделлю документа та багато іншого.", @@ -399,7 +399,7 @@ "title": "Вивчіть регулярні вирази, створивши спам-фільтр", "intro": [ "Регулярні вирази (відомі як «regex» або «regexp») — шаблони, які допомагають програмістам поєднувати, шукати та замінювати текст. Регулярні вирази надзвичайно потужні, але їх важко зрозуміти, оскільки у них використовуються спеціальні символи.", - "У цьому проєкті з фільтрування спаму ви дізнаєтеся про групи захоплення, позитивний та негативний огляди, а також інші техніки, щоб текст відповідав бажаному." + "У цьому проєкті з фільтрування спаму ви дізнаєтеся про групи захоплення, позитивні та негативні перевірки, а також інші техніки, щоб текст відповідав бажаному." ] }, "learn-basic-algorithmic-thinking-by-building-a-number-sorter": { @@ -584,10 +584,6 @@ "Ви дізналися як працювати з технологіями D3, APIs та AJAX, тому перевірте свої навички завдяки тесту з п’яти проєктів візуалізації даних.", "У цих проєктах вам потрібно буде отримати й проаналізувати набір даних, тоді використати D3 для створення різної візуалізації даних. Завершіть усі проєкти, аби отримати сертифікацію «Візуалізація даних»." ] - }, - "d3-dashboard": { - "title": "Інформаційна панель D3", - "intro": ["", ""] } } }, @@ -776,9 +772,9 @@ } }, "scientific-computing-with-python": { - "title": "Наукові обчислення з Python (бета-версія)", + "title": "Наукові обчислення з Python", "intro": [ - "Навчальна програма «Наукові обчислення з Python (бета-версія)» допоможе отримати навички аналізу та маніпулювання даними за допомогою Python — потужної та універсальної мови програмування. Ви вивчите ключові поняття, серед яких структури даних, алгоритми, об’єктноорієнтоване програмування, а також як виконувати складні обчислення за допомогою різноманітних інструментів.", + "Навчальна програма «Наукові обчислення з Python» допоможе отримати навички аналізу та маніпулювання даними за допомогою Python — потужної та універсальної мови програмування. Ви вивчите ключові поняття, серед яких структури даних, алгоритми, об’єктноорієнтоване програмування, а також як виконувати складні обчислення за допомогою різноманітних інструментів.", "Цей комплексний курс ознайомить вас з основами наукових обчислень, включно зі структурами даних та алгоритмами." ], "note": "", @@ -1152,7 +1148,8 @@ "title": "Підготовка до співбесіди з програмування", "intro": [ "Шукаєте безоплатні вправи з програмування, щоб підготуватися до наступної співбесіди? Ми про це подбали.", - "Цей розділ містить сотні завдань з програмування, які перевіряють ваші знання алгоритмів, структур даних і математики. Тут також є декілька проєктів, які ви можете використати для зміцнення своїх навичок або просто додати до свого портфоліо." + "Цей розділ містить завдання з програмування, які перевіряють ваші знання алгоритмів, структур даних і математики. Тут також є декілька проєктів, які ви можете використати для зміцнення навичок або просто додати їх до свого портфоліо.", + "Тут містяться матеріали з вікіпедії, які дозволені ліцензією Creative Commons Attribution-ShareAlike License 4.0. Оригінальний вміст міг бути змінений та адаптований. Для перегляду оригінальної версії та інших деталей відвідайте оригінальну сторінку на вікіпедії." ], "note": "Проєкт Ейлера та Rosetta Code переміщені в окремі курси. Поверніться до навчальної програми, щоб побачити перелік всіх курсів.", "blocks": { @@ -1180,7 +1177,7 @@ } }, "the-odin-project": { - "title": "Проєкт «Odin»: версія freeCodeCamp (бета-версія)", + "title": "Проєкт «Odin»: версія freeCodeCamp", "intro": [ "Проєкт «Odin» був створений розробником Еріком Траутманом у 2013 році. Протягом років з’явилася відкрита спільнота, яка доглядає за проєктом та розширює його.", "freeCodeCamp розширив відкриту навчальну програму, щоб зробити її інтерактивною у браузері. Проєкт міститиме тести, щоб оцінити ваш код та переконатись, що ви зрозуміли основні поняття.", @@ -1382,23 +1379,8 @@ } } }, - "upcoming-python": { - "title": "Майбутній Python", - "intro": ["заповнювач"], - "blocks": { - "learn-python-by-building-a-blackjack-game": { - "title": "Вивчіть Python, створивши гру «Блекджек»", - "intro": ["Вивчіть Python.", ""] - }, - "upcoming-python-project": { - "title": "Майбутній проєкт з Python", - "intro": ["заповнювач"] - } - } - }, "a2-english-for-developers": { "title": "Англійська мова рівня A2 для розробників (бета-версія)", - "note": "Сертифікація знаходиться в стані активної розробки. Наразі для цього розділу немає сертифіката, але він буде доступний найближчим часом. Тим часом ви можете дослідити курси, які ми вже створили.", "intro": [ "У цьому курсі з вивчення англійської мови для розробників ви опануєте основи англійської комунікації. Курс створено відповідно до загальноєвропейських рекомендацій з мовної освіти рівня A2 (CEFR). Ми зосередилися на словниковому запасі, що є особливо корисним для розробників.", "Перша частина допоможе освоїти граматику та використання англійської мови. Ви виконаєте багато практичних вправ, дізнавшись основи (наприклад, представлення себе, проведення коротких розмов і обговорення роботи).", @@ -1578,32 +1560,42 @@ }, "b1-english-for-developers": { "title": "Англійська мова рівня B1 для розробників (бета-версія)", - "note": "Сертифікація знаходиться в стані активної розробки. Наразі для цього розділу немає сертифіката, але він буде доступний найближчим часом. Тим часом ви можете дослідити курси, які ми вже створили.", - "intro": ["Placeholder intro"], + "intro": [ + "У цьому курсі з вивчення англійської мови для розробників ви опануєте основи англійської комунікації. Курс створено відповідно до загальноєвропейських рекомендацій з мовної освіти рівня B1 (CEFR). Ми зосередилися на словниковому запасі, що є особливо корисним для розробників.", + "Курс допоможе зміцнити базові знання, одночасно ознайомлюючи із більш складною граматикою та використанням. Ви навчитесь описувати місця та речі, ділитися досвідом і впевнено використовувати часи, серед яких теперішній доконаний та простий майбутній. А також отримаєте практичні поради: як вести розмову, ділитись думкою та висловлювати згоду чи незгоду.", + "Основний фокус на застосуванні цих навичок у професійній та технологічній галузях. Ви будете практикувати словниковий запас і фрази, важливі для розробників: як описувати код, брати участь у зустрічах і обговорювати технологічні тенденції. До складніших тем належать умовні речення, порівняльні конструкції та підтримка розмови, щоб підготувати вас до реальних взаємодій у технологічній індустрії.", + "Весь курс рівня B1 складається з 73 різних діалогів. Кожен з них створений для того, щоб розширити ваш словниковий запас та підвищити впевненість під час спілкування в професійному середовищі." + ], "blocks": { "learn-how-to-describe-places-and-events": { "title": "Дізнайтесь, як описувати місця і події", - "intro": [""] + "intro": ["У цьому курсі ви навчитеся говорити про місця та події."] }, "learn-how-to-talk-about-past-experiences": { "title": "Дізнайтесь, як говорити про досвід", - "intro": ["", ""] + "intro": ["У цьому курсі ви навчитеся ділитись власним досвідом."] }, "learn-how-to-talk-about-past-activities": { "title": "Дізнайтесь, як говорити про дії з минулого", - "intro": ["", ""] + "intro": ["У цьому курсі ви навчитеся говорити про речі, які зробили."] }, "learn-present-perfect-while-talking-about-accessibility": { "title": "Дізнайтесь про теперішній доконаний час, говорячи про доступність", - "intro": ["", ""] + "intro": [ + "У цьому курсі ви навчитеся використовувати теперішній доконаний час і трішки дізнаєтесь про доступність." + ] }, "learn-how-to-plan-future-events": { "title": "Дізнайтесь, як планувати майбутні події", - "intro": ["", ""] + "intro": [ + "У цьому курсі ви навчитеся використовувати майбутній час, щоб планувати різні події." + ] }, "learn-future-continuous-while-describing-actions": { "title": "Дізнайтесь про майбутній тривалий час, описуючи дії", - "intro": ["", ""] + "intro": [ + "У цьому курсі ви навчитеся використовувати майбутній тривалий час та описувати дії, які будуть виконані." + ] }, "learn-how-to-use-conditionals": { "title": "Дізнайтесь, як використовувати умовні речення", @@ -1694,16 +1686,89 @@ } }, "full-stack-developer": { - "title": "Навчальна програма «Сертифікований full stack розробник»", + "title": "Навчальна програма «Сертифікований Full Stack розробник»", "intro": [ - "Цей курс надає комплексний шлях, щоб стати сертифікованим full stack розробником. У ньому охоплено всі технології, необхідні для створення сучасних масштабованих програм від початку до кінця.", - "Завдяки поєднанню інтерактивних уроків, практичних завдань та реальних проєктів, ви опануєте як frontend, так і backend. Ви працюватимете з HTML, CSS і JavaScript для створення адаптивних інтерфейсів, досліджуватимете React і TypeScript для створення складних вебзастосунків та навчитеся керувати даними за допомогою реляційних баз даних. На стороні backend ви використовуватимете Git, Npm, Node.js і Python для створення потужних серверних рішень.", - "Наприкінці курсу ви отримаєте практичні навички та досвід, які дозволять впевнено розробляти повноцінні вебзастосунки, що підготує вас до успішної кар’єри full stack розробника." + "Цей курс надає комплексний шлях, щоб стати сертифікованим Full Stack розробником. У ньому охоплено всі технології, необхідні для створення сучасних масштабованих програм від початку до кінця.", + "Завдяки поєднанню інтерактивних уроків, практичних завдань та реальних проєктів, ви опануєте як Front End, так і Back End. Ви працюватимете з HTML, CSS і JavaScript для створення адаптивних інтерфейсів, досліджуватимете React і TypeScript для створення складних вебзастосунків та навчитеся керувати даними за допомогою реляційних баз даних. На стороні Back End ви використовуватимете Git, Npm, Node.js і Python для створення потужних серверних рішень.", + "Наприкінці курсу ви отримаєте практичні навички та досвід, які дозволять впевнено розробляти повноцінні вебзастосунки, що підготує вас до успішної кар’єри Full Stack розробника." ], + "chapters": { + "freecodecamp": "Вітання", + "html": "HTML", + "css": "CSS", + "javascript": "JavaScript", + "frontend-libraries": "Бібліотеки для Front End", + "relational-databases": "Реляційні бази даних", + "backend-javascript": "Back End JavaScript", + "python": "Python", + "exam-certified-full-stack-developer": "Екзамен «Сертифікований Full Stack розробник»" + }, + "modules": { + "getting-started-with-freecodecamp": "Початок роботи з freeCodeCamp", + "basic-html": "Основи HTML", + "semantic-html": "Семантичний HTML", + "html-forms-and-tables": "Форми та таблиці", + "html-and-accessibility": "Доступність", + "review-html": "Повторення HTML", + "exam-html": "Екзамен «HTML»", + "computer-basics": "Основи комп’ютера", + "basic-css": "Основи CSS", + "design-for-developers": "Дизайн", + "absolute-and-relative-units": "Відносні та абсолютні одиниці", + "pseudo-classes-and-elements": "Псевдокласи й псевдоелементи", + "css-colors": "Кольори", + "styling-forms": "Стилізація форм", + "css-box-model": "Блокова модель", + "css-flexbox": "Flexbox", + "css-typography": "Типографія", + "css-and-accessibility": "Доступність", + "attribute-selectors": "Селектори атрибутів", + "css-positioning": "Позиціювання", + "responsive-design": "Адаптивний дизайн", + "css-variables": "Змінні", + "css-grid": "Сітка", + "css-animations": "Анімації", + "exam-css": "Екзамен «CSS»", + "code-editors": "Редактори коду", + "javascript-variables-and-strings": "Змінні та рядки", + "javascript-booleans-and-numbers": "Булеві значення та числа", + "javascript-functions": "Функції", + "javascript-arrays": "Масиви", + "javascript-objects": "Об’єкти", + "javascript-loops": "Цикли", + "review-javascript-fundamentals": "Повторення основ JavaScript", + "higher-order-functions-and-callbacks": "Функції вищого порядку та зворотного виклику", + "dom-manipulation-and-events": "Маніпуляція DOM та події Click в JavaScript", + "debugging-javascript": "Налагодження", + "basic-regex": "Основи регулярних виразів", + "form-validation": "Валідація форм", + "javascript-dates": "Дати", + "audio-and-video-events": "Аудіо- та відеоподії", + "maps-and-sets": "Map та set", + "localstorage-and-crud-operations": "localStorage та операції CRUD", + "classes-and-the-this-keyword": "Класи", + "recursion": "Рекурсія", + "functional-programming": "Функціональне програмування", + "asynchronous-javascript": "Асинхронний JavaScript", + "exam-javascript": "Екзамен «JavaScript»", + "react-fundamentals": "Основи React", + "react-state-hooks-and-routing": "Стани, хуки та маршрутизація в React", + "performance": "Продуктивність", + "css-libraries-and-frameworks": "Бібліотеки та фреймворки CSS", + "testing": "Тестування", + "typescript-fundamentals": "Основи TypeScript", + "review-front-end-libraries": "Повторення бібліотек для Front End", + "exam-front-end-libraries": "Екзамен «Бібліотеки для Front End»", + "sql-and-bash": "SQL та Bash", + "git": "Git", + "security-and-privacy": "Безпека та приватність" + }, "blocks": { - "efpl": { - "title": "0", - "intro": [] + "lecture-welcome-to-freecodecamp": { + "title": "Вітаємо на freeCodeCamp", + "intro": [ + "Перегляньте ці відео, щоб дізнатись про freeCodeCamp: завдяки цій спільноті мільйони людей навчились програмувати та стали розробниками." + ] }, "lecture-what-is-html": { "title": "Що таке HTML?", @@ -1716,43 +1781,43 @@ "title": "Створіть застосунок із фото котів", "intro": [ "HTML розшифровується як «мова розмітки гіпертексту» та представляє вміст і структуру вебсторінки.", - "У цьому практичному завданні ви дізнаєтесь, як працювати з базовими елементами HTML, серед яких заголовки, абзаци, зображення, посилання та списки." + "У цьому практичному занятті ви дізнаєтесь, як працювати з базовими елементами HTML, серед яких заголовки, абзаци, зображення, посилання та списки." ] }, "lab-recipe-page": { "title": "Створіть сторінку з рецептом", "intro": [ - "У цій лабораторній роботі ви пригадаєте основи HTML, створивши вебсторінку з улюбленим рецептом. У вас буде можливість пригадати, як працювати з шаблонним кодом, заголовками, списками та зображеннями в HTML." + "У цій лабораторній роботі ви пригадаєте основи HTML, створивши вебсторінку з улюбленим рецептом. Ви створите шаблонний код HTML і будете працювати із заголовками, списками, зображеннями тощо." ] }, "lecture-html-fundamentals": { "title": "Основи HTML", "intro": [ - "У цих відеолекціях ви дізнаєтесь про основи HTML, серед яких атрибути id й class, елементи div й span, об’єкти HTML та багато іншого." + "У цих відеолекціях ви дізнаєтесь про основи HTML, серед яких елемент div, атрибути id та class, шаблонний код HTML тощо." ] }, "lab-travel-agency-page": { "title": "Створіть сторінку туристичної агенції", "intro": [ - "У цій лабораторній роботі ви пригадаєте, як працювати з основами HTML, створивши вебсторінку для туристичної агенції. У вас буде можливість пригадати, як працювати із зображеннями, елементом figure, елементом figcaption, елементом anchor та багато іншого." + "У цій лабораторній роботі ви пригадаєте основи HTML, створивши вебсторінку для туристичної агенції. Ви будете працювати із зображеннями, елементом figure, елементом figcaption, елементом anchor тощо." ] }, "lecture-working-with-media": { "title": "Робота з медіа", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з елементами audio й video, а також із SVG, та багато іншого." + "У цих відеолекціях ви дізнаєтесь, як працювати з цифровими активами (наприклад, елементами audio та video), SVG, як їх оптимізувати тощо." ] }, "lab-video-compilation-page": { "title": "Створіть сторінку із відео", "intro": [ - "У цій лабораторній роботі ви створите сторінку із відео. У вас буде можливість попрактикуватись працювати з елементом iframe." + "У цій лабораторній роботі ви створите сторінку із відео. Ви зможете попрацювати з елементом iframe." ] }, "lecture-working-with-links": { "title": "Робота з посиланнями", "intro": [ - "У цих відеолекціях ви дізнаєтесь про різні значення атрибута target, абсолютні й відносні посилання та різні стани посилань." + "У цих відеолекціях ви дізнаєтесь про посилання, атрибут target, різні стани посилань, абсолютний і відносний шлях тощо." ] }, "review-basic-html": { @@ -1771,20 +1836,19 @@ "lecture-importance-of-semantic-html": { "title": "Важливість семантичного HTML", "intro": [ - "У цих відеолекціях ви дізнаєтесь про семантичний HTML та важливість його використання." + "У цих відеолекціях ви дізнаєтесь про семантичний HTML і чому ним варто цікавитись, а також про семантичні елементи, різницю між семантичним і презентаційним HTML та багато іншого." ] }, "workshop-blog-page": { "title": "Створіть сторінку блогу про котів", "intro": [ - "У цьому практичному завданні ви дізнаєтесь, як створити сторінку блогу лише на HTML, використовуючи семантичні елементи, серед яких main, nav, article та footer." + "У цьому практичному занятті ви дізнаєтесь, як створити сторінку блогу лише на HTML, використовуючи семантичні елементи, серед яких main, nav, article та footer." ] }, "lab-event-hub": { "title": "Створіть хаб для подій", "intro": [ - "У цій лабораторній роботі ви пригадаєте, як працювати з семантичними елементами HTML, створивши хаб для подій.", - "У вас буде можливість пригадати, як працювати з елементами header, nav та article." + "У цій лабораторній роботі ви створите хаб для подій і пригадаєте різні семантичні елементи, серед яких header, nav та article." ] }, "review-semantic-html": { @@ -1803,82 +1867,85 @@ "lecture-working-with-forms": { "title": "Робота з формами", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з формами в HTML." + "У цих відеолекціях ви дізнаєтесь про форми, важливість міток, полів введення і кнопок, валідацію форми зі сторони клієнта та стани форм." ] }, "workshop-hotel-feedback-form": { "title": "Створіть форму зворотного зв’язку для готелю", "intro": [ - "У цьому практичному завданні ви дізнаєтесь, як працювати з формами, створивши форму зворотного зв’язку для готелю.", + "У цьому практичному занятті ви дізнаєтесь, як працювати з формами, створивши форму зворотного зв’язку для готелю.", "Ви навчитесь працювати з мітками, полями введення даних, наборами полів, легендами, текстовими полями та кнопками." ] }, "lab-survey-form": { "title": "Створіть форму для опитування", "intro": [ - "У цій лабораторній роботі ви пригадаєте, як працювати з HTML-формами, створивши форму для опитування.", - "У вас буде можливість попрактикуватись працювати з елементом label, різними елементами input, атрибутом required та багато іншого. " + "У цій лабораторній роботі ви пригадаєте HTML-форми, створивши форму для опитування.", + "Ви будете практикуватись працювати з елементом label, різними елементами input, атрибутом required та багато іншим." ] }, "lecture-working-with-tables": { "title": "Робота з таблицями", - "intro": ["У цих відеолекціях ви дізнаєтесь про таблиці в HTML."] + "intro": [ + "У цих відеолекціях ви дізнаєтесь про таблиці в HTML, включно з їхнім створенням і використанням." + ] }, "workshop-final-exams-table": { "title": "Створіть таблицю з кінцевими екзаменами", "intro": [ - "У цьому практичному завданні ви дізнаєтесь, як працювати з HTML-таблицями, створивши таблицю кінцевих екзаменів." + "У цьому практичному занятті ви дізнаєтесь, як працювати з HTML-таблицями, створивши таблицю кінцевих екзаменів." ] }, "lab-book-catalog-table": { "title": "Створіть каталог книг", "intro": [ - "У цій лабораторній роботі ви пригадаєте, як працювати з HTML-таблицями, створивши таблицю з інформацією про книги.", - "У вас буде можливість попрактикуватись працювати з різними компонентами таблиці, серед яких елементи Table Head, Table Row та Table Data Cell." + "У цій лабораторній роботі ви пригадаєте HTML-таблиці, створивши таблицю з інформацією про книжки.", + "Ви будете практикуватись працювати з різними компонентами таблиці, серед яких елементи thead, tbody, th, tr та td." ] }, "lecture-working-with-html-tools": { "title": "Робота з інструментами HTML", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з інструментами HTML." + "У цих відеолекціях ви дізнаєтесь про інструменти HTML, які допомагають писати кращий код. До цих інструментів належать валідатори HTML, інспектор DOM та інструменти розробника браузера." ] }, "review-html-tables-and-forms": { "title": "Повторення таблиць та форм в HTML", "intro": [ - "Перш ніж перейти до тесту «Таблиці та форми в HTML», повторіть основні поняття.", - "Відкрийте цю сторінку, щоб пригадати table, label, input, button та інші елементи." + "Перш ніж перейти до тесту «Форми, таблиці та інструменти в HTML», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати елементи table, input та button, а також поширені інструменти (серед яких валідатор HTML) і багато іншого." ] }, "quiz-html-tables-and-forms": { "title": "Тест «Таблиці та форми в HTML»", "intro": [ - "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Таблиці та форми в HTML»." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Форми, таблиці та інструменти в HTML»." ] }, "lecture-importance-of-accessibility-and-good-html-structure": { "title": "Важливість доступності та хорошої структури HTML", "intro": [ - "У цих відеолекціях ви дізнаєтесь про важливість доступності та хорошої структури в HTML." + "У цих відеолекціях ви дізнаєтесь про доступність та її важливість, допоміжні технології для людей з порушеннями, атрибути HTML для створення інклюзивних вебсайтів, найкращі практики й багато іншого." ] }, "lab-checkout-page": { "title": "Створіть платіжну сторінку", "intro": [ - "У цій лабораторній роботі ви створите доступну платіжну сторінку." + "У цій лабораторній роботі ви створите доступну платіжну сторінку.", + "Ви будете практикуватись працювати з різними поняттями, серед яких атрибути alt та aria-ролі." ] }, "review-html-accessibility": { "title": "Повторення доступності в HTML", "intro": [ - "Пригадайте поняття з теми «Доступність в HTML», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Доступність в HTML», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати атрибути aria-hidden, aria-describedby, tabindex та багато іншого." ] }, "quiz-html-accessibility": { "title": "Тест «Доступність в HTML»", "intro": [ - "Перш ніж перейти до тесту «Доступність в HTML», повторіть основні поняття.", - "Відкрийте цю сторінку, щоб пригадати атрибути aria-hidden, aria-describedby, tabindex та багато іншого." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Доступність»." ] }, "review-html": { @@ -1893,21 +1960,21 @@ "intro": [] }, "lecture-understanding-computer-internet-and-tooling-basics": { - "title": "Основи комп’ютера, інтернету та інструментів", + "title": "Знайомство з комп’ютером, інтернетом та інструментами", "intro": [ - "У цих відеолекціях ви дізнаєтесь про комп’ютер, інтернет та різні інструменти." + "У цих відеолекціях ви дізнаєтесь про комп’ютер, його різні частини, інтернет-провайдерів (ISP) та інструменти, якими користуються професійні розробники." ] }, "lecture-working-with-file-systems": { "title": "Робота з файловими системами", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з файловими системами." + "У цих відеолекціях ви дізнаєтесь, як працювати з файловими та папковими системами на комп’ютерах. Ви навчитеся створювати, переміщувати, видаляти файли й папки, дізнаєтеся про найкращі практики їхнього найменування і організації та багато іншого." ] }, "lecture-browsing-the-web-effectively": { "title": "Ефективне користування мережею", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як ефективно працювати з мережею." + "У цих відеолекціях ви дізнаєтесь, що таке вебсайти, пошукові системи й веббраузери, які існують браузери та як максимально ефективно використовувати пошукову систему." ] }, "review-computer-basics": { @@ -1923,32 +1990,35 @@ }, "lecture-what-is-css": { "title": "Що таке CSS?", - "intro": ["У цих відеолекціях ви дізнаєтесь про CSS."] + "intro": [ + "Наступні відеолекції присвячені CSS. Ви дізнаєтесь про CSS і його роль в мережі, анатомію правил в CSS, три способи написання CSS і коли їх використовувати, а також про блокові й вбудовані елементи та багато іншого." + ] }, "workshop-cafe-menu": { "title": "Розробіть меню для кафе", "intro": [ "CSS повідомляє браузеру, як відтворювати вебсторінку. CSS можна використовувати, щоб встановити колір, шрифт, розмір та інші властивості HTML-елементів.", - "У цьому практичному завданні ви вивчите CSS, розробивши дизайн меню для вебсторінки кафе." + "У цьому практичному занятті ви вивчите CSS, розробивши дизайн меню для вебсторінки кафе." ] }, "lab-business-card": { "title": "Створіть дизайн візитівки", "intro": [ - "У цій лабораторній роботі ви створите візитівку та стилізуєте її за допомогою CSS." + "У цій лабораторній роботі ви створите візитівку та стилізуєте її за допомогою CSS.", + "Ви будете практикуватись працювати з різними властивостями стилю, серед яких color, font-size, text-align тощо." ] }, "lecture-css-specificity-the-cascade-algorithm-and-inheritance": { "title": "Специфічність, алгоритм каскаду та успадкування в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь про специфічність, алгоритм каскаду та успадкування в CSS." + "У цих відеолекціях ви дізнаєтесь про специфічність в CSS, поширені селектори та їхню специфічність, алгоритм каскаду, успадкування і багато іншого." ] }, "review-basic-css": { "title": "Повторення основ CSS", "intro": [ "Перш ніж перейти до тесту «Основи CSS», повторіть основні поняття.", - "Відкрийте цю сторінку, щоб пригадати margin, padding, CSS-комбінатори, специфічність та багато іншого." + "Відкрийте цю сторінку, щоб пригадати margin, padding, комбінатори, специфічність та багато іншого." ] }, "quiz-basic-css": { @@ -1958,27 +2028,31 @@ "lecture-styling-lists-and-links": { "title": "Стилізація списків і посилань", "intro": [ - "У цих відеолекціях ви дізнаєтесь про стилізацію списків і посилань." + "У цих відеолекціях ви дізнаєтесь про властивості, які потрібно знати для ефективної стилізації списків і посилань, включно зі станами посилань (наприклад, link, visited, hover та active)." ] }, "lab-stylized-to-do-list": { "title": "Створіть стилізований список справ", "intro": [ - "У цій лабораторній роботі ви створите список справ, які потрібно виконати, та застосуєте різні стилі до посилань." + "У цій лабораторній роботі ви створите список справ, які потрібно виконати, та застосуєте різні стилі до посилань.", + "Ви будете практикуватись працювати з властивостями text-decoration та list-style-type, а також змінювати стилі при наведенні чи натисканні." ] }, "lecture-working-with-backgrounds-and-borders": { "title": "Робота з фоном і кордоном", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з фоном і кордоном." + "У цих відеолекціях ви дізнаєтесь про властивості та значення, необхідні для стилізації фону і кордону елементів, а також про аспекти доступності, пов’язані з фоном." ] }, - "pahx": { - "title": "45", - "intro": [] + "lab-blog-post-card": { + "title": "Створіть картку для допису", + "intro": [ + "У цій лабораторній роботі ви створите картку для допису із блогу, використовуючи HTML та CSS.", + "Ви будете практикуватись працювати з різними поняттями, серед яких background-color, border-radius, поля, відступи та багато іншого." + ] }, "review-css-backgrounds-and-borders": { - "title": "Повторення фонів та кордонів у CSS", + "title": "Повторення списків, посилань, фону та кордону в CSS", "intro": [ "Перш ніж перейти до тесту «Фони та кордони в CSS», повторіть основні поняття.", "Відкрийте цю сторінку, щоб пригадати властивості background-image, border та багато іншого." @@ -1991,19 +2065,19 @@ "lecture-user-interface-design-fundamentals": { "title": "Основи UI дизайну", "intro": [ - "У цих відеолекціях ви дізнаєтесь про основи дизайну інтерфейсу користувача." + "У цих відеолекціях ви дізнаєтесь про основи UI-дизайну. Ви ознайомитеся з поняттями, необхідними для спілкування з дизайнерами, візуальною ієрархією, масштабуванням, вирівнюванням, використанням пробілів та багато іншим." ] }, "lecture-user-centered-design": { "title": "Дизайн, орієнтований на користувача", "intro": [ - "У цих відеолекціях ви дізнаєтесь про дизайн, орієнтований на користувача." + "У цих відеолекціях ви дізнаєтесь про найкращі практики проєктування користувацьких функцій, серед яких темний режим, навігаційні стежки, діалогові вікна та багато іншого. Ви також навчитеся досліджувати користувачів, визначати їхні вимоги та проводити тестування." ] }, "lecture-common-design-tools": { "title": "Поширені інструменти дизайну", "intro": [ - "У цих відеолекціях ви дізнаєтесь про поширені інструменти дизайну." + "У цих відеолекціях ви дізнаєтесь про поширені інструменти дизайну, які мають знати розробники. Ви також ознайомитеся з дизайн-брифами та тим, як розробники працюють з ними." ] }, "review-design-fundamentals": { @@ -2020,13 +2094,14 @@ "lecture-working-with-relative-and-absolute-units": { "title": "Робота з відносними й абсолютними одиницями", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з відносними й абсолютними одиницями." + "У цих відеолекціях ви дізнаєтесь про відносні та абсолютні одиниці, а також про те, як вони впливають на відтворення у браузері." ] }, "lab-event-flyer-page": { "title": "Створіть запрошення на подію", "intro": [ - "У цій лабораторній роботі ви будете використовувати абсолютні та відносні одиниці CSS, щоб створити запрошення на подію." + "У цій лабораторній роботі ви створите сторінку із запрошенням на подію.", + "Ви будете практикуватись вирівнювати елементи за допомогою абсолютного та відносного CSS." ] }, "review-css-relative-and-absolute-units": { @@ -2045,45 +2120,53 @@ "lecture-working-with-pseudo-classes-and-pseudo-elements-in-css": { "title": "Робота з псевдокласами та псевдоелементами в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з псевдокласами й псевдоелементами в CSS." + "У цих відеолекціях ви дізнаєтесь про псевдокласи та псевдоелементи, розглянувши їхні приклади та принципи роботи." ] }, - "ohhu": { - "title": "58", - "intro": [] + "workshop-greeting-card": { + "title": "Створіть вітальну листівку", + "intro": [ + "У попередніх відеолекціях ви навчилися працювати з різними псевдокласами.", + "У цьому практичному занятті ви зможете попрактикувати те, чого навчились, створивши вітальну листівку." + ] }, "lab-job-application-form": { "title": "Створіть форму на працевлаштування", "intro": [ - "У цій лабораторній роботі ви створите форму із заявкою на працевлаштування та стилізуєте її, використовуючи псевдокласи." + "У цій лабораторній роботі ви створите форму із заявкою на працевлаштування та стилізуєте її, використовуючи псевдокласи.", + "Ви будете практикуватись працювати з різними поняттями, серед яких :hover, :active, :focus та багато іншого." ] }, "review-css-pseudo-classes": { "title": "Повторення псевдокласів у CSS", "intro": [ - "Перш ніж перейти до тесту «Псевдокласи в CSS», повторіть основні поняття.", + "Перш ніж перейти до тесту «Псевдокласи та псевдоелементи в CSS», повторіть основні поняття.", "Відкрийте цю сторінку, щоб пригадати псевдоелементи ::before й ::after, псевдокласи :hover й :active та багато іншого." ] }, "quiz-css-pseudo-classes": { "title": "Тест «Псевдокласи в CSS»", - "intro": ["Перевірте, що ви дізнались про псевдокласи в CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Псевдокласи в CSS»." + ] }, "lecture-working-with-colors-in-css": { "title": "Робота з кольорами в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з кольорами в CSS." + "У цих відеолекціях ви дізнаєтесь про лінійний та радіальний градієнти, теорію кольорів і різні види кольорів (серед яких названі, RGB, Hex та HSL). Ви дізнаєтесь, як ці кольори працюють і які потрібно використовувати." ] }, "workshop-colored-markers": { "title": "Створіть набір кольорових маркерів", "intro": [ - "У цьому практичному завданні ви створите набір кольорових маркерів. Ви попрактикуєте різні способи встановити значення кольорів та дізнаєтесь, як поєднувати кольори між собою." + "У цьому практичному занятті ви створите набір кольорових маркерів. Ви попрактикуєте різні способи встановити значення кольорів та дізнаєтесь, як поєднувати кольори між собою." ] }, - "ogdb": { - "title": "64", - "intro": [] + "lab-colored-boxes": { + "title": "Створіть кольорові коробки", + "intro": [ + "У цій лабораторній роботі ви створите кольорову сітку та попрактикуєтесь додавати кольори фону до елементів сітки, використовуючи шістнадцяткові коди, RGB та визначені назви." + ] }, "review-css-colors": { "title": "Повторення кольорів у CSS", @@ -2094,19 +2177,20 @@ }, "quiz-css-colors": { "title": "Тест «Кольори в CSS»", - "intro": ["Перевірте, що ви дізнались про використання кольорів у CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Кольори в CSS»." + ] }, "lecture-best-practices-for-styling-forms": { "title": "Найкращі практики стилізації форм", "intro": [ - "У цих відеолекціях ви дізнаєтесь про найкращі практики стилізації форм." + "У цих відеолекціях ви дізнаєтесь про найкращі практики стилізації форм і проблеми, з якими можна зіткнутися при стилізації спеціальних вхідних даних, серед яких color та datetime-local." ] }, "workshop-registration-form": { "title": "Створіть реєстраційну форму", "intro": [ - "Форми HTML можна використовувати для збору інформації від людей, які відвідують вебсторінку.", - "У цьому практичному завданні ви навчитесь працювати з формами HTML, створивши сторінку реєстрації. Ви дізнаєтесь, як керувати типами даних, що можна ввести у формі, й деякі нові інструменти CSS для стилізації сторінки." + "У цьому практичному занятті ви навчитесь працювати з формами HTML, створивши сторінку реєстрації. Ви дізнаєтесь, як керувати типами даних, що можна ввести у формі, й деякі нові інструменти CSS для стилізації сторінки." ] }, "lab-contact-form": { @@ -2125,26 +2209,26 @@ "quiz-styling-forms": { "title": "Тест «Стилізація форм»", "intro": [ - "Перевірте, що ви дізнались про стилізацію форм за допомогою CSS." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Стилізація форм»." ] }, "lecture-working-with-css-transforms-overflow-and-filters": { "title": "Робота з трансформаціями, переповненням і ефектами в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з трансформаціями, переповненням і ефектами в CSS." + "У цих відеолекціях ви дізнаєтесь про роботу з трансформаціями, переповненням та фільтрами в CSS. Ви також ознайомитеся з блоковою моделлю та принципами її роботи." ] }, "workshop-rothko-painting": { "title": "Створіть картину Ротко", "intro": [ "Кожен елемент HTML є власним блоком із власним простором та кордоном. Це називається блоковою моделлю.", - "У цьому практичному завданні ви будете використовувати CSS та блокову модель, щоб створити власну картину в стилі Ротко." + "У цьому практичному занятті ви будете використовувати CSS та блокову модель, щоб створити власну картину в стилі Ротко." ] }, "lab-confidential-email-page": { "title": "Створіть сторінку конфіденційної пошти", "intro": [ - "У цій лабораторній роботі ви створите конфіденційну пошту, використовуючи HTML та CSS." + "У цій лабораторній роботі ви створите вебсторінку, використовуючи HTML, та замаскуєте вміст за допомогою властивостей CSS." ] }, "review-css-layout-and-effects": { @@ -2157,26 +2241,26 @@ "quiz-css-layout-and-effects": { "title": "Тест «Макети та ефекти в CSS»", "intro": [ - "Перевірте, що ви дізнались про блокову модель, трансформації, фільтри та переповнення в CSS." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Макети та ефекти в CSS»." ] }, "lecture-working-with-css-flexbox": { "title": "Робота з CSS Flexbox", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з CSS flexbox." + "У цих відеолекціях ви дізнаєтесь, як працює гнучка модель в CSS, про різні властивості та коли її варто використовувати." ] }, "workshop-flexbox-photo-gallery": { "title": "Створіть фотогалерею із Flexbox", "intro": [ - "Flexbox допомагає створити вебсторінку, яка матиме хороший вигляд на екрані будь-якого розміру.", - "У цьому практичному завданні ви будете використовувати Flexbox, щоб створити адаптивну вебсторінку із фотогалереєю." + "У цьому практичному занятті ви будете використовувати Flexbox, щоб створити адаптивну вебсторінку із фотогалереєю." ] }, "lab-page-of-playing-cards": { "title": "Створіть сторінку гральних карт", "intro": [ - "У цій лабораторній роботі ви будете використовувати flexbox, щоб створити вебсторінку з гральними картами." + "У цій лабораторній роботі ви будете використовувати гнучку модель, щоб створити вебсторінку з гральними картами.", + "Ви будете практикуватись вирівнювати елементи за допомогою різних властивостей, серед яких flex-direction, justify-content, align-self та багато інших." ] }, "review-css-flexbox": { @@ -2188,49 +2272,52 @@ }, "quiz-css-flexbox": { "title": "Тест «CSS Flexbox»", - "intro": ["Перевірте, що ви дізнались про flexbox у CSS."] + "intro": ["Перевірте, що ви дізнались про CSS flexbox."] }, "lecture-working-with-css-fonts": { "title": "Робота з шрифтами в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з шрифтами в CSS." + "У цих відеолекціях ви дізнаєтесь про типографію і її найкращі практики, шрифти та властивість text-shadow." ] }, "workshop-nutritional-label": { "title": "Створіть харчову етикетку", "intro": [ "Типографія — це мистецтво стилізації тексту, щоб його було легко читати та він відповідав своєму призначенню.", - "У цьому практичному завданні ви будете використовувати типографію, щоб створити вебсторінку з харчовою етикеткою. Ви дізнаєтеся, як стилізувати текст, регулювати висоту рядка та позиціювати текст за допомогою CSS." + "У цьому практичному занятті ви будете використовувати типографію, щоб створити вебсторінку з харчовою етикеткою. Ви дізнаєтеся, як стилізувати текст, регулювати висоту рядка та позиціювати текст за допомогою CSS." ] }, "lab-newspaper-article": { "title": "Створіть статтю в газеті", "intro": [ - "У цій лабораторній роботі ви створите сторінку зі статтею, використовуючи HTML та CSS." + "У цій лабораторній роботі ви створите сторінку зі статтею з журналу, використовуючи HTML та CSS.", + "Ви будете стилізувати шрифти, використовуючи такі властивості, як font-family, font-size, font-weight тощо." ] }, "review-css-typography": { "title": "Повторення типографії в CSS", "intro": [ - "Перш ніж перейти до тесту «Типографія в CSS», повторіть основні поняття.", + "Перш ніж перейти до тесту «Типографія», повторіть основні поняття.", "Відкрийте цю сторінку, щоб пригадати веббезпечні шрифти, властивість font-family та багато іншого." ] }, "quiz-css-typography": { "title": "Тест «Типографія в CSS»", - "intro": ["Перевірте, що ви дізнались про типографію в CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Типографія»." + ] }, "lecture-best-practices-for-accessibility-and-css": { "title": "Найкращі практики доступності й CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь про найкращі практики доступності в CSS." + "У цих відеолекціях ви дізнаєтесь про найкращі практики доступності в CSS та інструменти для перевірки хорошого кольорового контрасту на вебсайтах." ] }, "workshop-accessibility-quiz": { "title": "Створіть сторінку з вікториною", "intro": [ "Доступність полегшує користування вебсторінкою для всіх людей, навіть для людей з порушеннями.", - "У цьому практичному завданні ви створите вебсторінку з вікториною. Ви дізнаєтеся про інструменти доступності, серед яких комбінації клавіш, атрибути ARIA та найкращі поради щодо дизайну." + "У цьому практичному занятті ви створите вебсторінку з вікториною. Ви дізнаєтеся про інструменти доступності, серед яких комбінації клавіш, атрибути ARIA та найкращі поради щодо дизайну." ] }, "lab-tribute-page": { @@ -2242,92 +2329,99 @@ "review-css-accessibility": { "title": "Повторення доступності в CSS", "intro": [ - "Пригадайте поняття з теми «Доступність в CSS», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Доступність в CSS», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати інструменти контрастності кольорів та найкращі практики доступності." ] }, "quiz-css-accessibility": { "title": "Тест «Доступність в CSS»", "intro": [ - "Перевірте, що ви дізнались про доступність вебсторінок за допомогою CSS." + "Перевірте, що ви дізнались про доступність вебсторінок із CSS." ] }, "lecture-working-with-attribute-selectors": { "title": "Робота з селекторами атрибутів", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з селекторами атрибутів." + "У цих відеолекціях ви дізнаєтесь про селектори атрибутів та як їх використовувати для націлювання на елементи (наприклад, на посилання та списки)." ] }, "workshop-balance-sheet": { "title": "Створіть бухгалтерський баланс", "intro": [ - "Псевдоселектори CSS можна використовувати, щоб змінити певні елементи HTML.", - "У цьому практичному завданні ви побудуєте бухгалтерський баланс за допомогою псевдоселекторів. Ви дізнаєтеся, як змінити стиль елемента, коли ви наводите на нього курсор, та запускати інші події на вебсторінці." + "У цьому практичному занятті ви побудуєте бухгалтерський баланс за допомогою псевдоселекторів. Ви дізнаєтеся, як змінити стиль елемента, коли ви наводите на нього курсор, та запускати інші події на вебсторінці." ] }, "lab-book-inventory-app": { "title": "Створіть застосунок для інвентаризації книг", "intro": [ - "У цій лабораторній роботі ви створите застосунок для інвентаризації книг." + "У цій лабораторній роботі ви створите застосунок для інвентаризації книг.", + "Ви будете практикуватись використовувати селектори атрибутів у CSS, серед яких [attribute], [attribute=value], [attribute~=value] та багато інших." ] }, "review-css-attribute-selectors": { "title": "Повторення селекторів атрибутів у CSS", "intro": [ - "Before you are quizzed on the fundamentals of CSS attribute selectors, you first need to review.", - "Open up this page to review concepts like how to work with different attribute selectors that target links with the href and title attributes." + "Перш ніж перейти до тесту «Селектори атрибутів у CSS», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з різними селекторами атрибутів, які націлюють посилання атрибутами href та title." ] }, "quiz-css-attribute-selectors": { "title": "Тест «Селектори атрибутів у CSS»", - "intro": ["Перевірте, що ви дізнались про селектори атрибутів у CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Селектори атрибутів у CSS»." + ] }, "lecture-understanding-how-to-work-with-floats-and-positioning-in-css": { - "title": "Робота з вирівнюванням й позиціюванням в CSS", + "title": "Знайомство з вирівнюванням й позиціюванням в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з вирівнюванням й позиціюванням у CSS." + "У цих відеолекціях ви дізнаєтесь про позиціювання та обтікання в CSS. Ви ознайомитеся з позиціюванням absolute, relative, fixed та sticky, а також будете використовувати властивість z-index." ] }, "workshop-cat-painting": { "title": "Створіть малюнок кота", "intro": [ "Позиціювання CSS важливо опанувати для того, щоб створювати візуально привабливі та адаптивні вебмакети.", - "У цьому практичному завданні ви створите малюнок кота. Ви дізнаєтесь, як працювати з абсолютним позиціюванням, а також з властивостями z-index й transform." + "У цьому практичному занятті ви створите малюнок кота. Ви дізнаєтесь, як працювати з абсолютним позиціюванням, а також з властивостями z-index й transform." ] }, "lab-house-painting": { "title": "Створіть малюнок будинку", "intro": [ - "У цій лабораторній роботі ви створите малюнок будинку за допомогою CSS." + "У цій лабораторній роботі ви створите малюнок будинку за допомогою CSS.", + "Ви будете проєктувати окремі елементи будинку та розміщувати їх, використовуючи різні властивості, серед яких position, top, left і багато інших." ] }, "review-css-positioning": { "title": "Повторення позиціювання в CSS", "intro": [ - "Before you are quizzed on the fundamentals of CSS positioning concepts, you first need to review.", - "Open up this page to review concepts like floats, relative positioning, absolute positioning and more." + "Перш ніж перейти до тесту «Позиціювання в CSS», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати обтікання, відносне позиціювання, абсолютне позиціювання та багато іншого." ] }, "quiz-css-positioning": { "title": "Тест «Позиціювання в CSS»", - "intro": ["Перевірте, що ви дізнались про позиціювання в CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Позиціювання в CSS»." + ] }, "lecture-best-practices-for-responsive-web-design": { "title": "Найкращі практики адаптивного вебдизайну", "intro": [ - "У цих відеолекціях ви дізнаєтесь про найкращі практики адаптивного вебдизайну." + "У цих відеолекціях ви дізнаєтесь про найкращі практики адаптивного вебдизайну, а також про основні поняття (а саме про сітку, гнучкий блок, медіазапити, медіаточки) і багато іншого." ] }, "workshop-piano": { "title": "Розробіть піаніно", "intro": [ "Адаптивний дизайн повідомляє вебсторінці, як вона має виглядати на екранах різного розміру.", - "У цьому практичному завданні ви використовуватимете CSS та адаптивний дизайн, щоб створити піаніно. До того ж, ви більше дізнаєтесь про медіазапити та псевдоселектори." + "У цьому практичному занятті ви використовуватимете CSS та адаптивний дизайн, щоб створити піаніно. До того ж, ви більше дізнаєтесь про медіазапити та псевдоселектори." ] }, "lab-technical-documentation-page": { "title": "Побудуйте сторінку технічної документації", "intro": [ - "У цій лабораторній роботі ви створите сторінку технічної документації, яка служитиме інструкцією або довідником." + "У цій лабораторній роботі ви створите сторінку технічної документації, яка служитиме інструкцією або довідником.", + "Ви також попрактикуєте роботу з медіазапитами для створення адаптивного дизайну." ] }, "review-responsive-web-design": { @@ -2339,25 +2433,26 @@ }, "quiz-responsive-web-design": { "title": "Тест «Адаптивний вебдизайн»", - "intro": ["Перевірте, що ви дізнались про адаптацію вебсторінок."] + "intro": ["Перевірте, що ви дізнались про адаптивність вебсторінок."] }, "lecture-working-with-css-variables": { "title": "Робота зі змінними в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати зі змінними в CSS." + "У цих відеолекціях ви дізнаєтесь, як визначити та використовувати кастомні властивості (також відомі як CSS-змінні). Ви також дізнаєтесь про директиву @property і як вона працює." ] }, "workshop-city-skyline": { "title": "Створіть панораму міста", "intro": [ "Змінні CSS допомагають організувати стилі та повторно використовувати їх.", - "У цьому практичному завданні ви побудуєте панораму міста. Ви дізнаєтеся, як налаштувати змінні CSS, щоб повторно використовувати їх, коли забажаєте." + "У цьому практичному занятті ви побудуєте панораму міста. Ви дізнаєтеся, як налаштувати змінні CSS, щоб повторно використовувати їх, коли забажаєте." ] }, "lab-availability-table": { "title": "Створіть таблицю з вільними годинами", "intro": [ - "У цій лабораторній роботі ви створите таблицю з вільними годинами для запису." + "У цій лабораторній роботі ви створите таблицю з вільними годинами, яка показуватиме, чи людина може бути присутньою на зустрічі.", + "Ви будете практикуватись використовувати CSS-змінні, щоб зберігати й повторно використовувати кольори, шрифти та інші стилі." ] }, "review-css-variables": { @@ -2369,28 +2464,34 @@ }, "quiz-css-variables": { "title": "Тест «Змінні в CSS»", - "intro": ["Перевірте, що ви дізнались про використання змінних в CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Змінні в CSS»." + ] }, "lecture-working-with-css-grid": { "title": "Робота з сіткою в CSS", "intro": [ - "У цих відеолекціях ви дізнаєтесь, як працювати з сіткою в CSS." + "У цих відеолекціях ви дізнаєтесь про сітку в CSS, її властивості та як їх використовувати. Ви також дізнаєтесь про різницю між сіткою та гнучкою моделлю." ] }, "workshop-magazine": { "title": "Створіть журнал", "intro": [ "CSS-сітка дозволяє керувати рядками та стовпцями вебсторінки.", - "У цьому практичному завданні ви створите статтю в журналі. Ви дізнаєтеся, як використовувати сітку, включно з рядками та стовпцями." + "У цьому практичному занятті ви створите статтю в журналі. Ви дізнаєтеся, як використовувати сітку, включно з рядками та стовпцями." ] }, - "ogko": { - "title": "114", - "intro": [] + "lab-magazine-layout": { + "title": "Розробіть макет журналу", + "intro": [ + "У цій лабораторній роботі ви розробите макет журналу, використовуючи сітку в CSS, включно з рядками та стовпцями." + ] }, "lecture-debugging-css": { "title": "Налагодження CSS", - "intro": ["У цих відеолекціях ви дізнаєтесь про налагодження CSS."] + "intro": [ + "У цій відеолекції ви навчитесь налагоджувати CSS за допомогою інструментів розробника свого браузера та валідаторів CSS." + ] }, "lab-product-landing-page": { "title": "Створіть посадкову сторінку продукту", @@ -2401,34 +2502,41 @@ "review-css-grid": { "title": "Повторення сітки в CSS", "intro": [ - "Пригадайте поняття з теми «Сітка в CSS», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Сітка в CSS», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з різними властивостями CSS-сітки, серед яких grid-template-columns, grid-gap тощо." ] }, "quiz-css-grid": { "title": "Тест «Сітка в CSS»", - "intro": ["Перевірте, що ви дізнались про використання сітки в CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Сітка в CSS»." + ] }, "lecture-animations-and-accessibility": { "title": "Анімація та доступність", "intro": [ - "У цих відеолекціях ви дізнаєтесь про анімацію та доступність." + "У цих відеолекціях ви дізнаєтесь про анімації в CSS та їхні аспекти доступності. Ви також дізнаєтесь, як prefers-reduced-motion може допомогти з цими питаннями." ] }, - "dpaq": { - "title": "120", - "intro": [] + "workshop-ferris-wheel": { + "title": "Створіть оглядове колесо", + "intro": [ + "У CSS можна використати анімацію, щоб привернути увагу до певних розділів вебсторінки та зробити її більш привабливою.", + "У цьому практичному занятті ви побудуєте оглядове колесо. Ви будете використовувати CSS для анімації, трансформації та регулювання швидкості елементів." + ] }, "lab-moon-orbit": { "title": "Побудуйте орбіту Місяця", "intro": [ - "У цій лабораторній роботі ви створите анімацію оберту Місяця навколо Землі." + "У цій лабораторній роботі ви створите анімацію оберту Місяця навколо Землі.", + "Ви будете практикуватись використовувати анімаційні властивості, серед яких animation-name, animation-duration, animation-timing-function і багато інших." ] }, "workshop-flappy-penguin": { "title": "Створіть пінгвіна Флаппі", "intro": [ "HTML-елементи можна змінити, щоб створити хороший дизайн, який привертає увагу читача. Ви можете використовувати трансформації, щоб обертати елементи, масштабувати їх тощо.", - "У цьому практичному завданні ви створите пінгвіна. Ви будете використовувати трансформації CSS, щоб позиціювати й змінити розмір частин пінгвіна, створити фон та анімувати роботу." + "У цьому практичному занятті ви створите пінгвіна. Ви будете використовувати трансформації CSS, щоб позиціювати й змінити розмір частин пінгвіна, створити фон та анімувати роботу." ] }, "lab-personal-portfolio": { @@ -2438,17 +2546,21 @@ "review-css-animations": { "title": "Повторення анімацій в CSS", "intro": [ - "Пригадайте поняття з теми «Анімації в CSS», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Анімації в CSS», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати prefers-reduced-motion, директиву @keyframes та багато іншого." ] }, "quiz-css-animations": { "title": "Тест «Анімації в CSS»", - "intro": ["Перевірте, що ви дізнались про анімацію в CSS."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Анімації в CSS»." + ] }, "review-css": { "title": "Повторення CSS", "intro": [ - "Пригадайте поняття з теми «CSS», щоб підготуватись до екзамену." + "Перш ніж перейти до підготовчого екзамену «CSS», повторіть основні поняття з попередніх модулів.", + "Відкрийте цю сторінку, щоб пригадати основи CSS, адаптивного вебдизайну, анімацій, доступності тощо." ] }, "wvjx": { @@ -2456,157 +2568,168 @@ "intro": [] }, "lecture-working-with-code-editors-and-ides": { - "title": "Working with Code Editors and IDE's", + "title": "Робота з редакторами коду та IDE", "intro": [ - "In these lecture videos, you will learn about working with code editors and IDE's." + "У цих відеолекціях ви дізнаєтесь, як працювати з редакторами коду та IDE. Ви ознайомитесь з найпопулярнішим редактором коду VS Code: як його встановити, як створити проєкт, які наявні гарячі клавіші та розширення." ] }, "lecture-introduction-to-javascript": { - "title": "Introduction to JavaScript", + "title": "Вступ до JavaScript", "intro": [ - "In these lecture videos, you will get a basic introduction to JavaScript." + "У цих відеолекціях ви дізнаєтесь про основи JavaScript. До тем належать змінні, типи даних, взаємодія JavaScript з HTML і CSS, рядки та багато іншого." ] }, "workshop-greeting-bot": { "title": "Створіть вітального бота", "intro": [ - "У цьому практичному завданні ви дізнаєтесь, як працювати з основами JavaScript, створивши вітального бота.", + "У цьому практичному занятті ви дізнаєтесь, як працювати з основами JavaScript, створивши вітального бота.", "Ви дізнаєтесь про змінні, let, const, console.log та базове використання рядка." ] }, "lab-javascript-trivia-bot": { "title": "Створіть бот з вікториною на JavaScript", "intro": [ - "У цій лабораторній роботі ви попрактикуєтесь працювати зі змінними та рядками JavaScript, створивши бот з вікториною." + "У цій лабораторній роботі ви попрактикуєтесь працювати зі змінними та рядками в JavaScript, створивши бот з вікториною.", + "Ви будете практикуватись використовувати змінні та базові рядки." + ] + }, + "lab-sentence-maker": { + "title": "Створіть творця речень", + "intro": [ + "У цій лабораторній роботі ви створите різноманітні історії, призначаючи різні слова до різних змінних." ] }, "lecture-working-with-data-types": { - "title": "Working with Data Types", + "title": "Робота з типами даних", "intro": [ - "In these lecture videos, you will learn about data types in JavaScript." + "У цих відеолекціях ви навчитесь працювати з різними типами даних в JavaScript. Також ви дізнаєтесь про різницю між динамічною і статичною типізацією, оператор typeof і помилку typeof null." ] }, "review-javascript-variables-and-data-types": { "title": "Повторення змінних та типів даних в JavaScript", "intro": [ - "Пригадайте поняття з теми «Змінні та типи даних в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Змінні та типи даних в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати змінні, типи даних, логи та коментування." ] }, "quiz-javascript-variables-and-data-types": { "title": "Тест «Змінні та типи даних в JavaScript»", "intro": [ - "Перевірте, що ви дізнались про змінні та типи даних в JavaScript." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Змінні та типи даних в JavaScript»." ] }, "lecture-working-with-strings-in-javascript": { - "title": "Working with Strings in JavaScript", + "title": "Робота з рядками в JavaScript", "intro": [ - "In these lecture videos, you will learn about working with strings in JavaScript." + "У цих відеолекціях ви навчитеся працювати з рядками в JavaScript. Ви дізнаєтесь, як отримати доступ до символів рядка, як використовувати шаблонні літерали й інтерполяцію, як створити нову лінію в рядку та багато іншого." ] }, "workshop-teacher-chatbot": { "title": "Створіть вчителя-бота", "intro": [ - "У цьому практичному завданні ви продовжите знайомство з рядками JavaScript, створивши чат-бот.", + "У цьому практичному занятті ви продовжите знайомство з рядками JavaScript, створивши чат-бот.", "Ви навчитеся працювати з шаблонними літерами та методом indexOf." ] }, "lecture-working-with-common-string-methods": { - "title": "Working with Common String Methods", + "title": "Поширені методи роботи з рядками", "intro": [ - "In these lecture videos, you will learn about common String methods." + "У цих відеолекціях ви дізнаєтесь про поширені методи рядків у JavaScript. Ці методи дозволяють робити різні речі: витягувати частину рядка, змінювати регістр, змінювати частину рядка, видаляти пробіли з рядка та багато іншого." ] }, "review-javascript-strings": { "title": "Повторення рядків у JavaScript", "intro": [ - "Пригадайте поняття з теми «Рядки в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Рядки в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з шаблонними літералами, а також з методами slice, includes, trim та багато іншого." ] }, "quiz-javascript-strings": { "title": "Тест «Рядки в JavaScript»", - "intro": ["Перевірте, що ви дізнались про рядки в JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Рядки в JavaScript»." + ] }, "lecture-working-with-numbers-booleans-and-the-math-object": { - "title": "Working with Numbers, Booleans, and the Math Object", + "title": "Робота з числами, булевими значеннями й об’єктом math", "intro": [ - "In these lecture videos, you will learn about numbers, booleans, and the Math Object." + "У цих відеолекціях ви поринете в основи JavaScript. Сюди належать числа, булеві значення і об’єкт Math. Ви дізнаєтесь про різні типи чисел, як працюють арифметичні й порівняльні оператори, як поводиться JavaScript під час обчислень із поєднанням рядків і чисел та багато іншого." ] }, "workshop-mathbot": { "title": "Створіть математичний бот", "intro": [ - "У цьому практичному завданні ви пригадаєте, як працювати з різними методами математичних об’єктів, створивши математичний бот." + "У цьому практичному занятті ви пригадаєте, як працювати з різними методами математичних об’єктів, створивши математичний бот." ] }, "lab-fortune-teller": { "title": "Створіть генератор передбачень", "intro": [ - "У цій лабораторній роботі ви створите генератор передбачень, де користувач випадково обиратиме передбачення зі всіх доступних." + "У цій лабораторній роботі ви створите генератор передбачень, де користувач випадково обиратиме передбачення зі всіх доступних.", + "Ви будете практикуватись працювати з методами Math.random() та Math.floor(), щоб генерувати випадкові числа." ] }, "lecture-working-with-numbers-and-common-number-methods": { - "title": "Working with Numbers and Common Number Methods", + "title": "Робота з числами й поширені методи роботи з ними", "intro": [ - "In these lecture videos, you will learn about numbers and common Number methods." + "У цих відеолекціях ви дізнаєтесь про числа та поширені методи роботи з ними. До них належать isNaN(), parseInt(), parseFloat() та toFixed()." ] }, "review-javascript-math": { - "title": "Повторення математики в JavaScript", + "title": "Повторення об’єкту Math в JavaScript", "intro": [ - "Пригадайте поняття з теми «Математика в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Об’єкт Math в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з методами Math.random(), Math.floor() тощо." ] }, "quiz-javascript-math": { - "title": "Тест «Математика в JavaScript»", - "intro": ["Перевірте, що ви дізнались про математику в JavaScript."] + "title": "Тест «Об’єкт Math в JavaScript»", + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Об’єкт Math в JavaScript»." + ] }, "lecture-understanding-comparisons-and-conditionals": { - "title": "Understanding Comparisons and Conditionals", + "title": "Знайомство з порівняннями й умовами", "intro": [ - "In these lecture videos, you will learn about comparisons and conditionals." + "У цих відеолекціях ви дізнаєтесь про оператори порівняння і умовні вирази. Ви дізнаєтесь, чим відрізняються умовні вирази між собою, і як працюють порівняння з null та undefined." ] }, "review-javascript-comparisons-and-conditionals": { "title": "Повторення порівняння та умов у JavaScript", "intro": [ - "Пригадайте поняття з теми «Порівняння та умови в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Порівняння та умови в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з інструкціями switch, а також з іншими типами умовних інструкцій." ] }, "quiz-javascript-comparisons-and-conditionals": { "title": "Тест «Порівняння та умови в JavaScript»", "intro": [ - "Перевірте, що ви дізнались про порівняння та умови в JavaScript." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Порівняння та умови в JavaScript»." ] }, "lecture-working-with-functions": { - "title": "Working with Functions", + "title": "Робота з функціями", "intro": [ - "In these lecture videos, you will learn about working with functions." + "У цих відеолекціях ви навчитесь повторно використовувати блок коду за допомогою функцій. Ви дізнаєтесь про головну мету функцій та як вони працюють, і що таке область видимості в програмуванні." ] }, "workshop-calculator": { "title": "Створіть калькулятор", "intro": [ - "У цьому практичному завданні ви пригадаєте, як працювати з функціями, створивши калькулятор." + "У цьому практичному занятті ви пригадаєте, як працювати з функціями, створивши калькулятор." ] }, "lab-email-masker": { "title": "Створіть маскування електронної пошти", "intro": [ - "У цій лабораторній роботі ви створите маскування е-пошти, яке прийматиме адресу та приховуватиме її." - ] - }, - "lab-sentence-maker": { - "title": "Створіть творця речень", - "intro": [ - "У цій лабораторній роботі ви створите різноманітні історії, призначаючи різні слова до різних змінних." + "У цій лабораторній роботі ви створите маскування е-пошти, яке прийматиме адресу та приховуватиме її.", + "Ви будете практикуватись розрізати рядок, застосовувати конкатенацію та використовувати функції." ] }, "workshop-loan-qualification-checker": { "title": "Створіть перевірку на дотримання вимог до позики", "intro": [ - "У цьому практичному завданні ви продовжите вивчати про умовні інструкції, створивши перевірку на дотримання вимог до позики.", + "У цьому практичному занятті ви продовжите вивчати про умовні інструкції, створивши перевірку на дотримання вимог до позики.", "Ви детальніше дізнаєтесь про інструкції if та як використовувати оператори порівняння і декілька умов в інструкції if." ] }, @@ -2619,21 +2742,26 @@ "review-javascript-functions": { "title": "Повторення функцій в JavaScript", "intro": [ - "Пригадайте поняття з теми «Функції в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Функції в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати функції, стрілкові функції та область видимості." ] }, "quiz-javascript-functions": { "title": "Тест «Функції в JavaScript»", - "intro": ["Перевірте, що ви дізнались про функції в JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Функції в JavaScript»." + ] }, - "mexq": { - "title": "157", - "intro": [] + "lecture-working-with-arrays": { + "title": "Робота з масивами", + "intro": [ + "У цих відеолекціях ви дізнаєтесь, як працювати з масивами в JavaScript. Ви дізнаєтесь про масиви, різницю між одновимірними та багатовимірними масивами, як отримати доступ до елементів масиву та оновити їх, а також багато іншого." + ] }, "workshop-shopping-list": { "title": "Створіть список покупок", "intro": [ - "У цьому практичному завданні ви попрактикуєтесь працювати з масивами, створивши список покупок.", + "У цьому практичному занятті ви попрактикуєтесь працювати з масивами, створивши список покупок.", "Ви пригадаєте, як додавати й видаляти елементи з масиву за допомогою різних методів, серед яких push, pop, shift та unshift." ] }, @@ -2643,186 +2771,239 @@ "У цій лабораторній роботі ви пригадаєте, як працювати з масивами й випадковими числами, створивши програму для вибору перекусу." ] }, - "mokm": { - "title": "160", - "intro": [] + "lecture-working-with-common-array-methods": { + "title": "Поширені методи роботи з масивами", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про масиви та їхні методи для виконання складніших операцій: як отримати позицію елемента, як перевірити наявність певного елемента, як скопіювати масив та багато іншого." + ] }, "review-javascript-arrays": { "title": "Повторення масивів у JavaScript", "intro": [ - "Пригадайте поняття з теми «Масиви в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Масиви в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати деструктуризацію масивів, додавання і вилучення елементів з масиву та багато іншого." ] }, "quiz-javascript-arrays": { "title": "Тест «Масиви в JavaScript»", - "intro": ["Перевірте, що ви дізнались про масиви в JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Масиви в JavaScript»." + ] }, - "dvnt": { - "title": "163", - "intro": [] + "lecture-working-with-objects": { + "title": "Робота з об’єктами", + "intro": [ + "У цих відеолекціях ви дізнаєтесь, як працювати з об’єктами в JavaScript. Ви дізнаєтесь, як отримати доступ до властивостей об’єкту, як перевірити наявність властивості, чим методи об’єкта відрізняються від функцій, про об’єктну деструктуризацію та багато іншого." + ] }, "workshop-recipe-tracker": { "title": "Створіть трекер рецептів", "intro": [ - "У цьому практичному завданні ви пригадаєте, як працювати з об’єктами в JavaScript, створивши трекер рецептів." + "У цьому практичному занятті ви пригадаєте, як працювати з об’єктами в JavaScript, створивши трекер рецептів." ] }, "lab-quiz-game": { "title": "Створіть ігрову вікторину", - "intro": ["У цій лабораторній роботі ви створите ігрову вікторину."] + "intro": [ + "У цій лабораторній роботі ви створите ігрову вікторину, використовуючи масиви та об’єкти в JavaScript.", + "Ви будете практикуватись використовувати функції для випадкового вибору запитання й відповіді з масиву та порівнюватимете їх." + ] }, "review-javascript-objects": { "title": "Повторення об’єктів у JavaScript", "intro": [ - "Пригадайте поняття з теми «Об’єкти в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Об’єкти в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як отримувати інформацію з об’єктів, деструктуризацію об’єктів, роботу з JSON та багато іншого." ] }, "quiz-javascript-objects": { "title": "Тест «Об’єкти в JavaScript»", - "intro": ["Перевірте, що ви дізнались про об’єкти в JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Об’єкти в JavaScript»." + ] }, - "kgtw": { - "title": "168", - "intro": [] + "lecture-working-with-loops": { + "title": "Робота з циклами", + "intro": [ + "Цикли — це важлива частина JavaScript. Тому наступні відеолекції підготовлено для того, щоб ви дізналися про різні типи циклів, як вони працюють, а також про те, як працює ітерація." + ] }, "workshop-sentence-analyzer": { "title": "Створіть аналізатор речень", "intro": [ - "У цьому практичному завданні ви пригадаєте, як працювати з циклами в JavaScript, створивши аналізатор речень." + "У цьому практичному занятті ви пригадаєте, як працювати з циклами в JavaScript, створивши аналізатор речень." ] }, "lab-factorial-calculator": { "title": "Створіть калькулятор факторіалів ", "intro": [ - "У цій лабораторній роботі ви створите калькулятор факторіалів." + "У цій лабораторній роботі ви створите калькулятор факторіалів.", + "Ви будете практикуватись використовувати цикли та умови для обчислення факторіала числа." ] }, "review-javascript-loops": { "title": "Повторення циклів у JavaScript", "intro": [ - "Пригадайте поняття з теми «Цикли в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Цикли в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати цикл for...of, цикл while, інструкції break and continue та багато іншого." ] }, "quiz-javascript-loops": { "title": "Тест «Цикли в JavaScript»", - "intro": ["Перевірте, що ви дізнались про цикли в JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Цикли в JavaScript»." + ] }, - "hjtr": { - "title": "173", - "intro": [] + "lecture-understanding-core-javascript-fundamentals": { + "title": "Знайомство з основами JavaScript", + "intro": [ + "У цих відеолекціях ви детальніше розглянете основи JavaScript. Ви дізнаєтесь про різницю між об’єктом-рядком і примітивним рядком, метод toString(), конвенції й загальноприйняті практики найменування змінних, лінтери і форматувальники, замикання та багато іншого." + ] }, "lab-pyramid-generator": { "title": "Створіть генератор пірамід", - "intro": ["У цій лабораторній роботі ви створите генератор пірамід."] + "intro": [ + "У цій лабораторній роботі ви створите генератор пірамід.", + "Ви будете приймати число як вхідні дані та, використовуючи цикл, згенеруєте піраміду з такою кількістю рівнів." + ] }, "lab-gradebook-app": { "title": "Створіть журнал з оцінками", "intro": [ - "У цій лабораторній роботі ви створите електронний журнал з оцінками." + "У цій лабораторній роботі ви створите електронний журнал з оцінками.", + "Ви будете практикуватись використовувати умови для визначення підсумкової оцінки учня на основі його балів." ] }, - "epfc": { - "title": "176", - "intro": [] + "lecture-the-var-keyword-and-hoisting": { + "title": "Ключове слово var та підняття", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про ключове слово var та чому його більше не рекомендують використовувати. Ви також ознайомитеся з підйомом в JavaScript, щоб уникати неочевидних помилок у коді." + ] }, "lab-inventory-management-program": { "title": "Створіть програму керування запасами", "intro": [ - "У цій лабораторній роботі ви створите програму керування запасами за допомогою JavaScript." + "У цій лабораторній роботі ви створите програму керування запасами за допомогою JavaScript.", + "Ви будете використовувати масив об’єктів JavaScript для керування запасами." ] }, - "fbbn": { - "title": "178", - "intro": [] + "lecture-understanding-modules-imports-and-exports": { + "title": "Знайомство з модулями, імпортом та експортом", + "intro": [ + "У цій відеолекції ви дізнаєтесь про модулі, імпорти та експорти в JavaScript." + ] }, - "lnmg": { - "title": "179", - "intro": [] + "lab-password-generator": { + "title": "Створіть генератор паролів", + "intro": [ + "У цій лабораторній роботі ви створите застосунок для генерації паролів на основі вхідних даних користувача." + ] }, "review-javascript-fundamentals": { "title": "Повторення основ JavaScript", "intro": [ - "Пригадайте поняття з теми «Основи JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Основи JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати замикання, управління пам’яттю та багато іншого." ] }, "quiz-javascript-fundamentals": { "title": "Тест «Основи JavaScript»", - "intro": ["Перевірте, що ви дізнались про основи JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Основи JavaScript»." + ] }, - "plic": { - "title": "182", - "intro": [] + "lecture-working-with-higher-order-functions-and-callbacks": { + "title": "Робота з функціями вищого порядку та зворотного виклику", + "intro": [ + "У цих відеолекціях ви дізнаєтесь, як працювати з функціями вищого порядку та функціями зворотного виклику. До функцій вищого порядку, які ви вивчите, належать map(), filter(), reduce(), sort(), every() та some(). Ви також навчитеся зв’язувати ці методи у послідовність для отримання бажаних результатів." + ] }, - "vjmm": { - "title": "183", - "intro": [] + "workshop-library-manager": { + "title": "Створіть менеджера бібліотеки", + "intro": [ + "У цьому практичному занятті ви дізнаєтесь про методи вищого порядку для роботи з масивами, створивши менеджера бібліотеки." + ] }, - "bxtv": { - "title": "184", - "intro": [] + "lab-book-organizer": { + "title": "Створіть органайзер для книжок", + "intro": [ + "У цій лабораторній роботі ви створите органайзер для книжок, використовуючи функції вищого порядку в JavaScript." + ] }, "review-javascript-higher-order-functions": { "title": "Повторення функцій вищого порядку в JavaScript", "intro": [ - "Пригадайте поняття з теми «Функції вищого порядку в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Функції вищого порядку в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з методами map(), filter() та reduce()." ] }, "quiz-javascript-higher-order-functions": { "title": "Тест «Функції вищого порядку в JavaScript»", "intro": [ - "Перевірте, що ви дізнались про функції вищого порядку в JavaScript." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Функції вищого порядку в JavaScript»." ] }, - "esfh": { - "title": "187", - "intro": [] + "lecture-working-with-the-dom-click-events-and-web-apis": { + "title": "Робота з DOM, подіями click та web API", + "intro": [ + "У цих відеолекціях ви дізнаєтесь, як працювати з об’єктною моделлю документа (DOM), методом addEventListener(), різними подіями і веб-API." + ] }, - "gibb": { - "title": "188", - "intro": [] + "workshop-storytelling-app": { + "title": "Створіть застосунок з оповіданнями", + "intro": [ + "У цьому практичному занятті ви створите застосунок з оповіданнями, що дозволить відтворювати їхній список за жанром." + ] }, "lab-favorite-icon-toggler": { "title": "Створіть перемикач вподобаної іконки", "intro": [ - "У цій лабораторній роботі ви створите перемикач вподобаної іконки, використавши подію click в JavaScript." + "У цій лабораторній роботі ви створите перемикач вподобаної іконки, використовуючи подію click в JavaScript." ] }, "review-dom-manipulation-and-click-events-with-javascript": { "title": "Повторення маніпуляції DOM та подій Click в JavaScript", "intro": [ - "Пригадайте поняття з теми «Маніпуляція DOM та події Click в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «DOM», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з DOM, Web API, методом addEventListener() та багато іншого." ] }, "quiz-dom-manipulation-and-click-event-with-javascript": { "title": "Тест «Маніпуляція DOM та події Click в JavaScript»", "intro": [ - "Перевірте, що ви дізнались про маніпуляцію DOM та події Click в JavaScript." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Маніпуляція DOM та події Click в JavaScript»." ] }, - "ubpx": { - "title": "192", - "intro": [] + "lecture-understanding-the-event-object-and-event-delegation": { + "title": "Знайомство з подіями та їх делегуванням", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про об’єкт event, подію change, бульбашковий механізм та делегування подій." + ] }, - "lbyi": { - "title": "193", - "intro": [] + "workshop-music-instrument-filter": { + "title": "Створіть музичний інструмент", + "intro": [ + "У цьому практичному занятті ви створите музичний інструмент за допомогою JavaScript." + ] }, "lab-real-time-counter": { "title": "Створіть лічильник реального часу", "intro": [ - "У цій лабораторній роботі ви створите лічильник символів у реальному часі." + "У цій лабораторній роботі ви створите лічильник символів у реальному часі.", + "Ви будете практикуватись працювати з подією input, коли користувач вводить текст у поле введення даних." ] }, "lab-lightbox-viewer": { "title": "Створіть переглядач Lightbox", "intro": [ - "У цій лабораторній роботі ви створите переглядач lightbox для перегляду зображень у сфокусованому режимі." + "У цій лабораторній роботі ви створите переглядач lightbox для перегляду зображень у сфокусованому режимі.", + "Ви будете практикуватись працювати з подіями натискання та перемиканням класів." ] }, "workshop-rps-game": { "title": "Створіть гру «Камінь-ножиці-папір»", "intro": [ - "У цьому практичному завданні ви пригадаєте маніпуляцію та події DOM, створивши гру «Камінь-ножиці-папір»." + "У цьому практичному занятті ви пригадаєте маніпуляцію та події DOM, створивши гру «Камінь-ножиці-папір»." ] }, "lab-palindrome-checker": { @@ -2834,22 +3015,27 @@ "lab-football-team-cards": { "title": "Створіть набір карток футбольних команд", "intro": [ - "Один із загальних аспектів створення вебзастосунків — обробка наборів даних та виведення інформації на екран. У цьому проєкті ви дізнаєтесь, як працювати з маніпулюванням DOM, деструктуризацією об’єктів, обробкою подій та фільтрацією даних, створивши набір карток футбольних команд." + "У цій лабораторній роботі ви будете використовувати маніпуляцію DOM, деструктуризацію об’єктів, обробку подій та фільтрацію даних, щоб створити набір карток футбольних команд." ] }, "review-javascript-events": { "title": "Повторення подій в JavaScript", "intro": [ - "Пригадайте поняття з теми «Події в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Події», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати події change, спливання подій та делегування подій." ] }, "quiz-javascript-events": { "title": "Тест «Події в JavaScript»", - "intro": ["Перевірте, що ви дізнались про події в JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Події в JavaScript»." + ] }, - "kaqq": { - "title": "201", - "intro": [] + "lecture-debugging-techniques": { + "title": "Техніки налагодження", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про поширені помилки в JavaScript та техніки, за допомогою яких їх можна виправити — процес, який називається «налагодженням»." + ] }, "lab-random-background-color-changer": { "title": "Налагодьте перемикач кольору фону", @@ -2860,25 +3046,34 @@ "review-debugging-javascript": { "title": "Повторення налагодження JavaScript", "intro": [ - "Пригадайте поняття з теми «Налагодження JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Налагодження JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати, як працювати з інструкцією throw, try...catch...finally та багато іншого." ] }, "quiz-debugging-javascript": { "title": "Тест «Налагодження JavaScript»", - "intro": ["Перевірте, що ви дізнались про налагодження JavaScript."] + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Налагодження JavaScript»." + ] }, - "ilop": { - "title": "205", - "intro": [] + "lecture-working-with-regular-expressions": { + "title": "Робота з регулярними виразами", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про регулярні вирази в JavaScript. Ви дізнаєтесь про методи роботи з регулярними виразами, модифікатори, класи символів, перевірки вперед і назад, зворотні посилання, квантори та багато іншого." + ] }, - "dqth": { - "title": "206", - "intro": [] + "workshop-spam-filter": { + "title": "Створіть спам-фільтр", + "intro": [ + "Регулярні вирази (відомі як «regex» або «regexp») — це шаблони, які допомагають програмістам поєднувати, шукати та замінювати текст. Регулярні вирази надзвичайно потужні, але їх важко зрозуміти, оскільки у них використовуються спеціальні символи.", + "У цьому практичному занятті ви будете використовувати групи захоплення, позитивні та негативні перевірки, а також інші техніки, щоб текст відповідав бажаному." + ] }, "lab-markdown-to-html-converter": { "title": "Створіть конвертер з markdown у HTML", "intro": [ - "У цій лабораторній роботі ви створите конвертер з markdown у HTML за допомогою JavaScript." + "У цій лабораторній роботі ви створите конвертер з markdown у HTML за допомогою JavaScript.", + "Ви будете практикуватись працювати з регулярними виразами, маніпулювати над рядками та багато іншого." ] }, "lab-regex-sandbox": { @@ -2890,46 +3085,53 @@ "review-javascript-regular-expressions": { "title": "Повторення регулярних виразів у JavaScript", "intro": [ - "Пригадайте поняття з теми «Регулярні вирази в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Регулярні вирази», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати перевірки уперед і назад, загальні модифікатори регулярних виразів та багато іншого." ] }, "quiz-javascript-regular-expressions": { "title": "Тест «Регулярні вирази в JavaScript»", "intro": [ - "Перевірте, що ви дізнались про регулярні вирази в JavaScript." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Регулярні вирази в JavaScript»." ] }, - "zalp": { - "title": "211", - "intro": [] + "lecture-understanding-form-validation": { + "title": "Знайомство з валідацією форм", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про валідацію форм у JavaScript. Ви дізнаєтесь про різні способи валідації форм, а також як працюють метод preventDefault() та подія submit." + ] }, "workshop-calorie-counter": { - "title": "Build a Calorie Counter", + "title": "Створіть калькулятор калорій", "intro": [ - "Sometimes when you're coding a web application, you'll need to be able to accept input from a user. In this calorie counter workshop, you'll practice how to validate user input, perform calculations based on that input, and dynamically update your interface to display the results.", - "You'll also practice basic regular expressions, template literals, the addEventListener() method, and more." + "Іноді при створенні вебзастосунків потрібно працювати з вхідними даними від користувача. У цьому практичному занятті ви будете обробляти вхідні дані користувача, виконувати обчислення на основі цих даних та динамічно оновлювати інтерфейс для відтворення результатів.", + "Ви також попрактикуєте регулярні вирази, шаблонні літерали, метод addEventListener() та багато іншого." ] }, - "egkv": { - "title": "213", - "intro": [] + "lab-customer-complaint-form": { + "title": "Створіть форму для скарг", + "intro": [ + "У цій лабораторній роботі ви будете працювати над формою для скарг від клієнтів, використовуючи JavaScript.", + "Ви будете практикуватись перевіряти дані форми, відтворювати повідомлення про помилки та запобігати відправленню форми, якщо є помилки." + ] }, "review-form-validation-with-javascript": { "title": "Повторення валідації форм з JavaScript", "intro": [ - "Пригадайте поняття з теми «Валідація форм з JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Валідація форм», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати метод preventDefault(), подію submit та багато іншого." ] }, "quiz-form-validation-with-javascript": { "title": "Тест «Валідація форм з JavaScript»", + "intro": ["Перевірте, що ви дізнались про валідацію форм з JavaScript."] + }, + "lecture-working-with-dates": { + "title": "Робота з датами", "intro": [ - "Перевірте, що ви дізнались про валідацію форм за допомогою JavaScript." + "У цих відеолекціях ви дізнаєтесь про об’єкт date в JavaScript. Ви ознайомитесь з різними методами, щоб працювати з датами та форматувати їх." ] }, - "lupt": { - "title": "216", - "intro": [] - }, "lab-date-conversion": { "title": "Створіть програму для перетворення дати", "intro": [ @@ -2939,232 +3141,224 @@ "review-javascript-dates": { "title": "Повторення дат у JavaScript", "intro": [ - "Пригадайте поняття з теми «Дати в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Дати», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати об’єкт Date() та поширені методи." ] }, "quiz-javascript-dates": { "title": "Тест «Дати в JavaScript»", "intro": ["Перевірте, що ви дізнались про дати в JavaScript."] }, - "lvts": { - "title": "220", - "intro": [] + "lecture-working-with-audio-and-video": { + "title": "Робота з аудіо та відео", + "intro": [ + "У цих відеолекціях ви дізнаєтесь, як працювати з аудіо- та відеофайлами за допомогою JavaScript. Ви дізнаєтесь про конструктори Audio і Video, їхні методи і властивості, аудіо- і відеоформати, кодеки, HTMLMediaElement API та багато іншого." + ] }, - "foal": { - "title": "221", - "intro": [] + "workshop-music-player": { + "title": "Створіть музичний плеєр", + "intro": [ + "У цьому практичному занятті ви створите звичайний MP3-плеєр за допомогою HTML, CSS та JavaScript.", + "Цей проєкт охоплює ключові поняття, серед яких обробка аудіо, управління плейлистом, реалізація функцій програвання, паузи, наступної пісні та перемішування, а також динамічне оновлення інтерфейсу користувача на основі поточної пісні." + ] }, - "crzf": { - "title": "222", - "intro": [] + "lab-drum-machine": { + "title": "Створіть драм машину", + "intro": [ + "У цій лабораторній роботі ви будете використовувати елемент audio, щоб створити драм машину." + ] }, "review-javascript-audio-and-video": { "title": "Повторення аудіо та відео в JavaScript", "intro": [ - "Пригадайте поняття з теми «Аудіо та відео в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Аудіо та відео в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати конструктор Audio, HTMLMediaElement API та багато іншого." ] }, "quiz-javascript-audio-and-video": { "title": "Тест «Аудіо та відео в JavaScript»", "intro": ["Перевірте, що ви дізнались про аудіо та відео в JavaScript."] }, - "pehm": { - "title": "225", - "intro": [] + "lecture-working-with-maps-and-sets": { + "title": "Робота з map та set", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про Map та Set в JavaScript. Ви також дізнаєтесь, як вони відрізняються від WeakSets та WeakMaps." + ] }, - "cvsw": { - "title": "226", - "intro": [] + "workshop-plant-nursery-catalog": { + "title": "Створіть каталог рослин", + "intro": [ + "У цьому практичному занятті ви попрактикуєте map та set, створивши каталог рослин у JavaScript." + ] }, - "cvs1": { - "title": "227", - "intro": [] + "lab-voting-system": { + "title": "Створіть систему для голосування", + "intro": [ + "У цій лабораторній роботі ви створите систему для голосування, використовуючи map та set.", + "Ви будете практикуватись використовувати об’єкт Map для зберігання пар ключ-значення та об’єкт Set для зберігання унікальних значень." + ] }, - "review-javascript-maps-sets-and-json": { - "title": "Повторення map, set та JSON в JavaScript", + "review-javascript-maps-and-sets": { + "title": "Повторення map та set в JavaScript", "intro": [ - "Пригадайте поняття з теми «Map, set та JSON в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Map та set в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати об’єкти Map та Set, а також WeakSet й WeakMap." ] }, - "cvs3": { - "title": "229", - "intro": [] + "quiz-javascript-maps-and-sets": { + "title": "Тест «Map та set в JavaScript»", + "intro": ["Перевірте, що ви дізнались про map та set в JavaScript."] }, - "fgbp": { - "title": "230", - "intro": [] + "lecture-working-with-client-side-storage-and-crud-operations": { + "title": "Робота зі сховищем на клієнтській стороні та операціями CRUD", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про сховище пам’яті на стороні клієнта та CRUD-операції в JavaScript. Ви дізнаєтесь про localStorage та sessionStorage разом з їхніми методами та властивостями, файли cookie, Cache API, IndexDB та багато іншого." + ] }, "workshop-todo-app": { - "title": "Build a Todo App using Local Storage", + "title": "Створіть застосунок зі справами за допомогою локального сховища", "intro": [ - "Local storage is a web browser feature that lets web applications store key-value pairs persistently within a user's browser. This allows web apps to save data during one session, then retrieve it in a later page session.", - "In this workshop, you'll learn how to handle form inputs, manage local storage, perform CRUD (Create, Read, Update, Delete) operations on tasks, implement event listeners, and toggle UI elements." + "Локальне сховище — це функція вебпереглядача, яка дозволяє вебзастосункам зберігати пари ключ-значення в браузері користувача. Воно також дозволяє зберігати дані протягом одного сеансу та використовувати їх в наступному.", + "У цьому практичному занятті ви навчитеся обробляти вхідні дані, управляти локальним сховищем, виконувати операції CRUD (створення, читання, оновлення, видалення), реалізовувати слухачів подій та перемикати елементи інтерфейсу користувача." ] }, "lab-bookmark-manager-app": { "title": "Створіть менеджера закладок", - "intro": ["У цій лабораторній роботі ви створите менеджера закладок."] + "intro": [ + "У цій лабораторній роботі ви створите менеджера закладок.", + "Ви будете використовувати локальне сховище, щоб зберігати закладки, і попрактикуєте їхнє додавання, видалення і відтворення." + ] }, "review-local-storage-and-crud": { "title": "Повторення локального сховища та CRUD", "intro": [ - "Пригадайте поняття з теми «Локальне сховище та CRUD», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Сховище localStorage», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати властивості localStorage, sessionStorage та багато іншого." ] }, "quiz-local-storage-and-crud": { "title": "Тест «Локальне сховище та CRUD»", "intro": ["Перевірте, що ви дізнались про локальне сховище та CRUD."] }, - "jbst": { - "title": "235", - "intro": [] + "lecture-understanding-how-to-work-with-classes-in-javascript": { + "title": "Знайомство з класами в JavaScript", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про класи в JavaScript. Ви ознайомитеся з успадкуванням, ключовим словом this, статичними властивостями й методами та багато іншим." + ] }, - "peyf": { - "title": "236", - "intro": [] + "workshop-shopping-cart": { + "title": "Створіть кошик для покупок", + "intro": [ + "У цьому практичному занятті ви створите кошик для покупок, використовуючи класи JavaScript.", + "Ви ознайомитесь з ключовим словом this, створите екземпляри класу, імплементуєте методи для маніпуляції даними та багато іншого." + ] }, "lab-project-idea-board": { "title": "Створіть дошку ідей", "intro": [ - "У цій лабораторній роботі ви створите дошку ідей за допомогою ООП в JavaScript." + "У цій лабораторній роботі ви створите дошку ідей за допомогою ООП в JavaScript.", + "Ви будете практикуватись створювати класи, додавати методи до класів та створювати екземпляри класів." ] }, - "ndlf": { - "title": "238", - "intro": [] + "lab-bank-account-manager": { + "title": "Створіть програму для управління банківським рахунком", + "intro": [ + "У цій лабораторній роботі ви створите просту систему управління транзакціями банківського рахунку." + ] }, "review-javascript-classes": { "title": "Повторення класів у JavaScript", "intro": [ - "Пригадайте поняття з теми «Класи в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Класи в JavaScript», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати ключове слово this, наслідування класу та багато іншого." ] }, - "ndl1": { - "title": "240", - "intro": [] + "quiz-javascript-classes": { + "title": "Тест «Класи в JavaScript»", + "intro": ["Перевірте, що ви дізнались про класи в JavaScript."] }, - "ndl2": { - "title": "241", - "intro": [] + "lecture-understanding-recursion-and-the-call-stack": { + "title": "Знайомство з рекурсією та стеком викликів", + "intro": [ + "У цій відеолекції ви дізнаєтесь про рекурсію та стек викликів." + ] }, - "ndl3": { - "title": "242", - "intro": [] + "workshop-decimal-to-binary-converter": { + "title": "Створіть конвертер десяткових чисел в бінарні", + "intro": [ + "Рекурсія — це таке поняття в програмуванні, коли функція викликає сама себе. Це може перетворити складне завдання на декілька менших простіших завдань, допоки вони не стануть зрозумілими.", + "У цьому практичному занятті ви побудуєте конвертер десяткових чисел в бінарні за допомогою JavaScript. Ви будете використовувати основи рекурсії, дослідите стек викликів та створите візуальне представлення процесу рекурсії через анімацію." + ] }, - "ndl4": { - "title": "243", - "intro": [] + "lab-permutation-generator": { + "title": "Створіть генератор перестановок", + "intro": [ + "У цій лабораторній роботі ви створите генератор, який видаватиме всі можливі перестановки заданого рядка." + ] }, "review-recursion": { "title": "Повторення рекурсії", "intro": [ - "Пригадайте поняття з теми «Рекурсія», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Рекурсія», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати рекурсію і для чого її використовують." ] }, "quiz-recursion": { "title": "Тест «Рекурсія»", - "intro": ["Перевірте, що ви дізнались про рекурсію."] - }, - "yshh": { - "title": "246", - "intro": [] - }, - "wyx1": { - "title": "247", - "intro": [] - }, - "wyx2": { - "title": "248", - "intro": [] - }, - "wyx3": { - "title": "249", - "intro": [] - }, - "quiz-javascript-functional-programming": { - "title": "Тест «Функціональне програмування в JavaScript»", - "intro": [ - "Перевірте, що ви дізнались про функціональне програмування в JavaScript." - ] - }, - "lab-quicksort-algorithm": { - "title": "Створіть алгоритм швидкого сортування", "intro": [ - "У цій лабораторній роботі ви імплементуєте алгоритм швидкого сортування, використовуючи JavaScript." + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Рекурсія»." ] }, - "dtfv": { - "title": "240", - "intro": [] - }, - "quiz-searching-and-sorting-algorithms": { - "title": "Тест «Алгоритми пошуку та сортування»", + "lecture-understanding-functional-programming": { + "title": "Знайомство з функціональним програмуванням", "intro": [ - "Перевірте, що ви дізнались про алгоритми пошуку та сортування." + "У цих відеолекціях ви дізнаєтесь про функціональне програмування і як вкладати функції за допомогою техніки під назвою каррування." ] }, - "bnvw": { - "title": "242", - "intro": [] - }, - "xkhk": { - "title": "243", - "intro": [] - }, - "lab-roman-numeral-converter": { - "title": "Створіть конвертер римських чисел", + "workshop-recipe-ingredient-converter": { + "title": "Створіть конвертер інгредієнтів", "intro": [ - "У цій лабораторній роботі ви створите застосунок, який перетворює цілі числа в римські." + "У попередніх відеолекціях ви дізнались основні поняття функціонального програмування і каррування.", + "Зараз ви зможете застосувати на практиці все те, що вивчили про каррування та функціональне програмування, створивши застосунок із конвертацією інгредієнтів." ] }, - "yaxm": { - "title": "245", - "intro": [] - }, - "lab-telephone-number-validator": { - "title": "Створіть валідатор мобільного номера", + "lab-sorting-visualizer": { + "title": "Створіть візуалізатор сортування", "intro": [ - "У цій лабораторній роботі ви створите застосунок, який перевіряє, чи мобільний номер є дійсним номером США." + "У цій лабораторній роботі ви будете використовувати JavaScript, щоб візуалізувати кроки алгоритму сортування бульбашкою, необхідні для впорядкування масиву цілих чисел." ] }, - "lab-cash-register": { - "title": "Створіть касовий апарат", - "intro": ["У цій лабораторній роботі ви створите касовий апарат."] - }, - "udia": { - "title": "248", - "intro": [] - }, "review-javascript-functional-programming": { "title": "Повторення функціонального програмування в JavaScript", "intro": [ - "Пригадайте поняття з теми «Функціональне програмування в JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до тесту «Функціональне програмування», повторіть основні поняття.", + "Відкрийте цю сторінку, щоб пригадати поняття з функціонального програмування, каррування та багато іншого." ] }, - "quiz-javascript-problem-solving-and-algorithmic-thinking": { - "title": "Тест «Розв’язання проблем в JavaScript та алгоритмічне мислення»", + "quiz-javascript-functional-programming": { + "title": "Тест «Функціональне програмування в JavaScript»", "intro": [ - "Перевірте, що ви дізнались про розв’язання проблем в JavaScript та алгоритмічне мислення." + "Перевірте, що ви дізнались про функціональне програмування в JavaScript." ] }, - "mjbe": { - "title": "251", - "intro": [] + "lecture-understanding-asynchronous-programming": { + "title": "Знайомство з асинхронним програмуванням", + "intro": [ + "У цих відеолекціях ви дізнаєтесь про асинхронне програмування в JavaScript. Ви дізнаєтесь про відмінності між синхронним і асинхронним програмуванням, як працює ключове слово async, Fetch API, проміси, async/await, Geolocation API та багато іншого." + ] }, "workshop-fcc-authors-page": { "title": "Створіть сторінку автора fCC", "intro": [ "Один із загальних аспектів веброзробки, якого потрібно навчитись — отримувати дані від зовнішнього API, а потім працювати з асинхронним JavaScript.", - "У цьому практичному завданні ви попрактикуєтесь використовувати метод fetch, динамічно оновлювати DOM для відтворення отриманих даних, а також розбивати дані на сторінки, щоб завантажувати результати партіями." + "У цьому практичному занятті ви попрактикуєтесь використовувати метод fetch, динамічно оновлювати DOM для відтворення отриманих даних, а також розбивати дані на сторінки, щоб завантажувати результати партіями." ] }, - "alda": { - "title": "253", - "intro": [] - }, - "cvaf": { - "title": "254", - "intro": [] + "lab-fcc-forum-leaderboard": { + "title": "Створіть таблицю лідерів на fCC", + "intro": [ + "У цій лабораторній роботі ви застосуєте асинхронний JavaScript, щоб створити власну таблицю лідерів freeCodeCamp." + ] }, "review-asynchronous-javascript": { "title": "Повторення асинхронного JavaScript", @@ -3179,94 +3373,99 @@ "review-javascript": { "title": "Повторення JavaScript", "intro": [ - "Пригадайте поняття з теми «JavaScript», щоб підготуватись до тесту." + "Перш ніж перейти до підготовчого екзамену «JavaScript», повторіть основні поняття з попередніх модулів.", + "Відкрийте цю сторінку, щоб пригадати змінні, рядки, булеві значення, функції, об’єкти, масиви, налагодження, роботу з DOM та багато іншого." ] }, "kagw": { "title": "258", "intro": [] }, - "mbib": { - "title": "259", - "intro": [] - }, - "oxiv": { - "title": "260", - "intro": [] - }, - "quiz-javascript-object-oriented-programming": { - "title": "Тест «Об’єктноорієнтоване програмування на JavaScript»", + "lecture-introduction-to-javascript-libraries-and-frameworks": { + "title": "Вступ до бібліотек і фреймворків JavaScript", "intro": [ - "Перевірте, що ви дізнались про об’єктноорієнтоване програмування на JavaScript." + "У цих відеолекціях ви ознайомитесь з основами бібліотек та фреймворків JavaScript. Ви дізнаєтесь про ролі бібліотек і фреймворків JavaScript, застосунки з однією сторінкою (SPA) та проблеми, що їх супроводжують, а також про React — найпопулярнішу бібліотеку JavaScript." ] }, - "nixz": { - "title": "262", - "intro": [] + "workshop-reusable-mega-navbar": { + "title": "Створіть Navbar, придатний для повторного використання", + "intro": [ + "У попередніх відеолекціях ви навчилися працювати з компонентами в React.", + "У цьому практичному занятті ви створите компонент Navbar, придатний для повторного використання, за допомогою React." + ] }, - "lab-stack-class": { - "title": "Створіть клас stack", + "lab-reusable-footer": { + "title": "Створіть нижній колонтитул, придатний для повторного використання", "intro": [ - "У цій лабораторній роботі ви створите клас stack за допомогою JavaScript." + "У цій лабораторній роботі ви створите нижній колонтитул, придатний для повторного використання, за допомогою React." ] }, - "lab-linked-list-class": { - "title": "Створіть клас linked list", + "lecture-working-with-data-in-react": { + "title": "Робота з даними в React", "intro": [ - "У цій лабораторній роботі ви створите клас linked list за допомогою JavaScript." + "У цих відеолекціях ви навчитесь працювати з даними в React. Ви дізнаєтесь про пропси і як їх передавати, умовне відтворення, як відтворювати списки та як використовувати вбудовані стилі." ] }, - "lab-hash-table-class": { - "title": "Створіть клас hash table", + "workshop-reusable-profile-card-component": { + "title": "Створіть картку профілю", "intro": [ - "У цій лабораторній роботі ви створите клас hash table за допомогою JavaScript." + "У цьому практичному занятті ви дізнаєтесь, як працювати з пропсами, створивши картку профілю, доступну для повторного використання." ] }, - "muyw": { - "title": "266", - "intro": [] + "lab-mood-board": { + "title": "Створіть мудборд", + "intro": [ + "У цій лабораторній роботі ви створите мудборд, використовуючи React.", + "Ви будете практикуватись передавати дані між батьківським і дочірнім компонентами, використовуючи пропси." + ] }, - "quiz-javascript-data-structures": { - "title": "Тест «Структури даних в JavaScript»", + "review-react-basics": { + "title": "Повторення основ React", "intro": [ - "Перевірте, що ви дізнались про структури даних в JavaScript." + "Пригадайте поняття з теми «Основи React», щоб підготуватись до тесту." ] }, - "rmpy": { + "quiz-react-basics": { + "title": "Тест «Основи React»", + "intro": [ + "Цей тест перевірить, наскільки добре ви засвоїли матеріал з теми «Основи React»." + ] + }, + "rugw": { + "title": "267", + "intro": [] + }, + "rmpy": { "title": "268", "intro": [] }, - "lab-depth-first-search": { - "title": "Імплементуйте алгоритм пошуку в глибину", - "intro": [ - "У цій лабораторній роботі ви будете використовувати JavaScript, щоб імплементувати алгоритм пошуку в глибину." - ] + "dbta": { + "title": "269", + "intro": [] + }, + "rnfe": { + "title": "271", + "intro": [] }, "xdyh": { "title": "270", "intro": [] }, - "quiz-graphs-and-trees": { - "title": "Тест «Графи та дерева»", - "intro": ["Перевірте, що ви дізнались про графи та дерева."] - }, "vjgg": { "title": "272", "intro": [] }, - "lab-nth-fibonacci-number-generator": { - "title": "Створіть генератор n-го числа Фібоначчі", - "intro": [ - "У цій лабораторній роботі ви імплементуєте генератор n-го числа Фібоначчі." - ] - }, - "kaui": { - "title": "274", + "ceds": { + "title": "273", "intro": [] }, - "quiz-dynamic-programming": { - "title": "Тест «Динамічне програмування»", - "intro": ["Перевірте, що ви дізнались про динамічне програмування."] + "quiz-react-state-and-hooks": { + "title": "Тест «Стани та хуки в React»", + "intro": ["Перевірте, що ви дізнались про стани та хуки в React."] + }, + "ftmi": { + "title": "275", + "intro": [] }, "sgau": { "title": "276", @@ -3276,61 +3475,76 @@ "title": "277", "intro": [] }, - "fcom": { - "title": "278", - "intro": [] + "lab-weather-app": { + "title": "Створіть застосунок з прогнозом погоди", + "intro": [ + "У цій лабораторній роботі ви створите застосунок з прогнозом погоди, використовуючи API.", + "Ви будете практикуватись отримувати дані з API, зберігати та відтворювати їх у застосунку." + ] }, "ffpt": { "title": "279", "intro": [] }, - "lab-pokemon-search-app": { - "title": "Створіть застосунок «Pokémon Search»", - "intro": ["У цьому проєкті ви створите застосунок з пошуку покемонів."] + "lrof": { + "title": "280", + "intro": [] }, "vyzp": { "title": "281", "intro": [] }, - "icdr": { - "title": "283", + "zagz": { + "title": "282", "intro": [] }, + "quiz-advanced-react": { + "title": "Тест «Advanced React»", + "intro": ["Перевірте, що ви дізнались про Advanced React."] + }, "zdsj": { "title": "284", "intro": [] }, - "mzae": { - "title": "285", - "intro": [] + "review-web-performance": { + "title": "Повторення вебпродуктивності", + "intro": [ + "Пригадайте поняття з теми «Вебпродуктивність», щоб підготуватись до тесту." + ] }, - "gjbf": { - "title": "286", - "intro": [] + "quiz-web-performance": { + "title": "Тест «Вебпродуктивність»", + "intro": ["Перевірте, що ви дізнались про вебпродуктивність."] }, "mbpv": { "title": "287", "intro": [] }, - "eeez": { - "title": "288", - "intro": [] + "review-css-libraries-and-frameworks": { + "title": "Повторення бібліотек та фреймворків CSS", + "intro": [ + "Пригадайте поняття з теми «Бібліотеки та фреймворки CSS», щоб підготуватись до тесту." + ] }, - "quiz-web-standards": { - "title": "Тест «Вебстандарти»", - "intro": ["Перевірте, що ви дізнались про вебстандарти."] + "quiz-css-libraries-and-frameworks": { + "title": "Тест «Бібліотеки та фреймворки CSS»", + "intro": [ + "Перевірте, що ви дізнались про бібліотеки та фреймворки CSS." + ] }, "khuu": { "title": "290", "intro": [] }, - "xdly": { - "title": "291", - "intro": [] + "review-testing": { + "title": "Повторення тестування", + "intro": [ + "Пригадайте поняття з теми «Тестування», щоб підготуватись до тесту." + ] }, - "rhhl": { - "title": "292", - "intro": [] + "quiz-testing": { + "title": "Тест «Тестування»", + "intro": ["Перевірте, що ви дізнались про тестування."] }, "trvf": { "title": "293", @@ -3348,102 +3562,8 @@ "title": "296", "intro": [] }, - "quiz-react-basics": { - "title": "Тест «Основи React»", - "intro": ["Перевірте, що ви дізнались про основи React."] - }, - "hfwi": { - "title": "298", - "intro": [] - }, - "rnwr": { - "title": "299", - "intro": [] - }, - "oeqv": { - "title": "300", - "intro": [] - }, - "rdzk": { - "title": "301", - "intro": [] - }, - "vtpz": { - "title": "302", - "intro": [] - }, - "dfwl": { - "title": "303", - "intro": [] - }, - "adzm": { - "title": "304", - "intro": [] - }, - "quiz-react-state-and-hooks": { - "title": "Тест «Стани та хуки в React»", - "intro": ["Перевірте, що ви дізнались про стани та хуки в React."] - }, - "voks": { - "title": "306", - "intro": [] - }, - "uwum": { - "title": "307", - "intro": [] - }, - "ukem": { - "title": "308", - "intro": [] - }, - "sdjg": { - "title": "309", - "intro": [] - }, - "buzx": { - "title": "310", - "intro": [] - }, - "pexz": { - "title": "311", - "intro": [] - }, - "prlo": { - "title": "312", - "intro": [] - }, - "jsnd": { - "title": "313", - "intro": [] - }, - "quiz-advanced-react": { - "title": "Тест «Advanced React»", - "intro": ["Перевірте, що ви дізнались про Advanced React."] - }, - "tkgg": { - "title": "315", - "intro": [] - }, - "review-web-performance": { - "title": "Повторення вебпродуктивності", - "intro": [ - "Пригадайте поняття з теми «Вебпродуктивність», щоб підготуватись до тесту." - ] - }, - "quiz-web-performance": { - "title": "Тест «Вебпродуктивність»", - "intro": ["Перевірте, що ви дізнались про вебпродуктивність."] - }, - "hzab": { - "title": "318", - "intro": [] - }, - "ggea": { - "title": "319", - "intro": [] - }, - "vgvz": { - "title": "320", + "muyw": { + "title": "297", "intro": [] }, "review-typescript": { @@ -3454,57 +3574,27 @@ }, "quiz-typescript": { "title": "Тест «TypeScript»", - "intro": ["Перевірте, що ви дізнались про TypeScript."] - }, - "zhhp": { - "title": "323", - "intro": [] - }, - "review-css-libraries-and-frameworks": { - "title": "Повторення бібліотек та фреймворків CSS", - "intro": [ - "Пригадайте поняття з теми «Бібліотеки та фреймворки CSS», щоб підготуватись до тесту." - ] - }, - "quiz-css-libraries-and-frameworks": { - "title": "Тест «Бібліотеки та фреймворки CSS»", - "intro": [ - "Перевірте, що ви дізнались про бібліотеки та фреймворки CSS." - ] - }, - "gora": { - "title": "326", - "intro": [] - }, - "review-testing": { - "title": "Повторення тестування", - "intro": [ - "Пригадайте поняття з теми «Тестування», щоб підготуватись до тесту." - ] - }, - "quiz-testing": { - "title": "Тест «Тестування»", - "intro": ["Перевірте, що ви дізнались про тестування."] + "intro": ["Перевірте, що ви дізнались про Typescript."] }, "review-front-end-libraries": { - "title": "Повторення бібліотек для front end", + "title": "Повторення бібліотек для Front End", "intro": [ - "Пригадайте поняття з теми «Бібліотеки для front end», щоб підготуватись до тесту." + "Пригадайте поняття з теми «Бібліотеки для Front End», щоб підготуватись до тесту." ] }, - "mfwu": { - "title": "330", + "rdzk": { + "title": "301", "intro": [] }, - "dfcd": { - "title": "331", + "vtpz": { + "title": "302", "intro": [] }, "workshop-bash-boilerplate": { "title": "Створіть шаблонний код", "intro": [ "Термінал дозволяє надсилати на комп’ютер текстові команди, які можуть маніпулювати файловою системою, запускати програми, автоматизувати завдання та багато іншого.", - "У цьому практичному завданні зі 170 уроків ви вивчите команди терміналу, створивши шаблонний код вебсайту, використовуючи лише командний рядок." + "У цьому практичному занятті зі 170 уроків ви вивчите команди терміналу, створивши шаблонний код вебсайту, використовуючи лише командний рядок." ] }, "review-bash-commands": { @@ -3515,17 +3605,17 @@ }, "quiz-bash-commands": { "title": "Тест «Команди Bash»", - "intro": ["Перевірте, що ви дізнались про команди Bash."] + "intro": ["Перевірте, що ви дізнались про команди bash."] }, - "thsj": { - "title": "335", + "voks": { + "title": "306", "intro": [] }, "workshop-mario-database": { "title": "Створіть базу даних «Mario»", "intro": [ "Реляційна база даних організовує дані в таблиці, які пов’язані між собою через спорідненість.", - "У цьому практичному завданні зі 165 уроків ви вивчите основи реляційної бази даних, створивши базу даних PostgreSQL, наповнену персонажами з відеоігор." + "У цьому практичному занятті зі 165 уроків ви вивчите основи реляційної бази даних, створивши базу даних PostgreSQL, наповнену персонажами з відеоігор." ] }, "lab-celestial-bodies-database": { @@ -3544,15 +3634,15 @@ "title": "Тест «Реляційні бази даних»", "intro": ["Перевірте, що ви дізнались про реляційні бази даних."] }, - "ynqt": { - "title": "340", + "pexz": { + "title": "311", "intro": [] }, "workshop-bash-five-programs": { "title": "Створіть п’ять програм", "intro": [ "Скрипти Bash поєднують команди терміналу і логіку в програми, які можуть виконувати або автоматизувати завдання та багато іншого.", - "У цьому практичному завданні з 220 уроків ви детальніше вивчите команди терміналу та як їх використовувати в скриптах Bash, створивши п’ять невеликих програм." + "У цьому практичному занятті з 220 уроків ви детальніше вивчите команди терміналу та як їх використовувати в скриптах Bash, створивши п’ять невеликих програм." ] }, "review-bash-scripting": { @@ -3563,24 +3653,24 @@ }, "quiz-bash-scripting": { "title": "Тест «Скрипти Bash»", - "intro": ["Перевірте, що ви дізнались про скрипти Bash."] + "intro": ["Перевірте, що ви дізнались про скрипти bash."] }, - "pegc": { - "title": "344", + "tkgg": { + "title": "315", "intro": [] }, "workshop-sql-student-database-part-1": { "title": "Створіть базу даних студентів: частина 1", "intro": [ "SQL, або Structured Query Language (мова структурованих запитів) — це мова для спілкування з реляційною базою даних.", - "У цьому практичному завданні зі 140 уроків ви створите скрипт Bash, який використовує SQL, щоб ввести інформацію про студентів з інформатики в PostgreSQL." + "У цьому практичному занятті зі 140 уроків ви створите скрипт Bash, який використовує SQL, щоб ввести інформацію про студентів з інформатики в PostgreSQL." ] }, "workshop-sql-student-database-part-2": { "title": "Створіть базу даних студентів: частина 2", "intro": [ "У SQL використовують команди join, щоб об’єднати інформацію з декількох таблиць у реляційну базу даних.", - "У цьому практичному завданні зі 140 уроків ви завершите свою базу даних студентів, глибше занурившись в команди SQL." + "У цьому практичному занятті зі 140 уроків ви завершите свою базу даних студентів, глибше занурившись в команди SQL." ] }, "lab-world-cup-database": { @@ -3593,13 +3683,13 @@ "title": "Створіть перекладач Kitty Ipsum", "intro": [ "Команди Bash можуть більше, ніж ви могли собі уявити.", - "У цьому практичному завданні зі 140 уроків ви вивчите деякі складніші команди, а також дізнаєтесь про деталі їхньої роботи." + "У цьому практичному занятті зі 140 уроків ви вивчите деякі складніші команди, а також дізнаєтесь про деталі їхньої роботи." ] }, "workshop-bike-rental-shop": { "title": "Створіть магазин прокату велосипедів", "intro": [ - "У цьому практичному завданні з 210 уроків ви створите інтерактивну програму Bash, яка зберігатиме інформацію про оренду для магазину прокату велосипедів, використовуючи PostgreSQL." + "У цьому практичному занятті з 210 уроків ви створите інтерактивну програму Bash, яка зберігатиме інформацію про оренду для магазину прокату велосипедів, використовуючи PostgreSQL." ] }, "lab-salon-appointment-scheduler": { @@ -3618,15 +3708,15 @@ "title": "Тест «Bash та SQL»", "intro": ["Перевірте, що ви дізнались про Bash та SQL."] }, - "movb": { - "title": "353", + "eeez": { + "title": "324", "intro": [] }, "workshop-castle": { "title": "Створіть замок", "intro": [ "Nano — це програма, яка дозволяє редагувати файли одразу в терміналі.", - "У цьому практичному завданні з 40 уроків ви дізнаєтесь, як редагувати файли в терміналі за допомогою Nano, створивши замок." + "У цьому практичному занятті з 40 уроків ви дізнаєтесь, як редагувати файли в терміналі за допомогою Nano, створивши замок." ] }, "review-nano": { @@ -3639,15 +3729,15 @@ "title": "Тест «Nano»", "intro": ["Перевірте, що ви дізнались про Nano."] }, - "pzmc": { - "title": "357", + "rhhl": { + "title": "328", "intro": [] }, "workshop-sql-reference-object": { "title": "Створіть референсний об’єкт SQL", "intro": [ "Git — це система контролю версій, яка відстежує усі зміни, внесені вами до кодової бази.", - "У цьому практичному завданні з 240 уроків ви дізнаєтесь, як Git відстежує код, створивши об’єкт, що містить часто використовувані команди SQL." + "У цьому практичному занятті з 240 уроків ви дізнаєтесь, як Git відстежує код, створивши об’єкт, що містить часто використовувані команди SQL." ] }, "lab-periodic-table-database": { @@ -3678,6 +3768,122 @@ "Пригадайте поняття з теми «Реляційні бази даних», щоб підготуватись до тесту." ] }, + "thsj": { + "title": "335", + "intro": [] + }, + "uwum": { + "title": "336", + "intro": [] + }, + "asfv": { + "title": "337", + "intro": [] + }, + "bvfx": { + "title": "338", + "intro": [] + }, + "buzx": { + "title": "339", + "intro": [] + }, + "ynqt": { + "title": "340", + "intro": [] + }, + "prlo": { + "title": "341", + "intro": [] + }, + "jsnd": { + "title": "342", + "intro": [] + }, + "sxdc": { + "title": "343", + "intro": [] + }, + "pegc": { + "title": "344", + "intro": [] + }, + "mzae": { + "title": "345", + "intro": [] + }, + "gjbf": { + "title": "346", + "intro": [] + }, + "hzab": { + "title": "347", + "intro": [] + }, + "ggea": { + "title": "348", + "intro": [] + }, + "vgvz": { + "title": "349", + "intro": [] + }, + "hfwi": { + "title": "350", + "intro": [] + }, + "rnwr": { + "title": "351", + "intro": [] + }, + "zhhp": { + "title": "352", + "intro": [] + }, + "movb": { + "title": "353", + "intro": [] + }, + "ngor": { + "title": "354", + "intro": [] + }, + "gora": { + "title": "355", + "intro": [] + }, + "xdly": { + "title": "356", + "intro": [] + }, + "pzmc": { + "title": "357", + "intro": [] + }, + "oeqv": { + "title": "358", + "intro": [] + }, + "mfwu": { + "title": "359", + "intro": [] + }, + "dfcd": { + "title": "360", + "intro": [] + }, + "dfwl": { + "title": "361", + "intro": [] + }, + "adzm": { + "title": "362", + "intro": [] + }, + "kaui": { + "title": "363", + "intro": [] + }, "zpjj": { "title": "364", "intro": [] @@ -3686,15 +3892,13 @@ "title": "365", "intro": [] }, - "review-security-and-privacy": { - "title": "Повторення безпеки та приватності", - "intro": [ - "Пригадайте поняття з теми «Безпека та приватність», щоб підготуватись до тесту." - ] + "ukem": { + "title": "366", + "intro": [] }, - "quiz-security-and-privacy": { - "title": "Тест «Безпека та приватність»", - "intro": ["Перевірте, що ви дізнались про безпеку та приватність."] + "sdjg": { + "title": "367", + "intro": [] }, "qjov": { "title": "368", @@ -3724,6 +3928,10 @@ "title": "382", "intro": [] }, + "xfrd": { + "title": "383", + "intro": [] + }, "nkjt": { "title": "384", "intro": [] @@ -3745,9 +3953,9 @@ "intro": [] }, "exam-certified-full-stack-developer": { - "title": "Екзамен «Сертифікований full stack розробник»", + "title": "Екзамен «Сертифікований Full Stack розробник»", "intro": [ - "Складіть цей екзамен, щоб стати сертифікованим full stack розробником." + "Складіть цей екзамен, щоб стати сертифікованим Full Stack розробником." ] } } diff --git a/client/i18n/locales/ukrainian/links.json b/client/i18n/locales/ukrainian/links.json index 6774fac40834d4..7cd948285a43e5 100644 --- a/client/i18n/locales/ukrainian/links.json +++ b/client/i18n/locales/ukrainian/links.json @@ -1,5 +1,5 @@ { - "help-translate-link-url": "https://contribute.freecodecamp.org/#/i18n/ukrainian/how-to-translate-files", + "help-translate-link-url": "https://contribute.freecodecamp.org/getting-started/#translations", "top-contributors": "https://www.freecodecamp.org/news/freecodecamp-top-contributors/", "footer": { "about-url": "https://www.freecodecamp.org/ukrainian/news/chapy-freecodecamp/", diff --git a/client/i18n/locales/ukrainian/translations.json b/client/i18n/locales/ukrainian/translations.json index 1d5c267c705fab..787d6220c45d36 100644 --- a/client/i18n/locales/ukrainian/translations.json +++ b/client/i18n/locales/ukrainian/translations.json @@ -106,7 +106,10 @@ "donate-now": "Задонатити", "confirm-amount": "Підтвердити суму", "play-scene": "Натисніть «Відтворити»", - "closed-caption": "Приховані субтитри" + "closed-caption": "Приховані субтитри", + "share-on-x": "Поділитись на X", + "share-on-bluesky": "Поділитись на BlueSky", + "share-on-threads": "Поділитись на Threads" }, "landing": { "big-heading-1": "Вчіться програмувати безоплатно.", @@ -147,7 +150,7 @@ }, { "title": "Безоплатна освіта", - "description": "Навчайтесь з спільнотою і заощаджуйте на навчанні. Жодних прихованих витрат." + "description": "Навчайтесь зі спільнотою та економте на освіті, що можливо завдяки щедрій підтримці донорів." }, { "title": "Зразкові сертифікації", @@ -162,10 +165,12 @@ }, "certification-heading": "Отримайте безоплатні підтверджені сертифікації в:", "core-certs-heading": "Отримайте безоплатні підтверджені сертифікації з основної навчальної програми freeCodeCamp:", - "learn-english-heading": "Вивчіть англійську мову для розробників:", + "learn-english-heading": "Вивчайте англійську мову для розробників:", "professional-certs-heading": "Отримайте безоплатні професійні сертифікації:", "interview-prep-heading": "Підготуйтесь до посади розробника:", "legacy-curriculum-heading": "Перегляньте застарілу навчальну програму:", + "next-heading": "Спробуйте бета-версію навчальної програми:", + "next-english-heading": "Спробуйте нову навчальну програму:", "upcoming-heading": "Майбутня навчальна програма:", "faq": "Часті питання:", "faqs": [ @@ -238,6 +243,8 @@ "sound-mode": "Це додає приємне звучання акустичної гітари на всьому вебсайті. Ви почуєте музичний супровід, коли будете писати у редакторі, при завершенні випробувань, при затвердженні сертифікацій та інше.", "sound-volume": "Гучність багаття:", "scrollbar-width": "Ширина смуги прокрутки редактора", + "reset-editor-layout-tooltip": "Скинути редактор до початкового стану", + "reset-editor-layout": "Скинути редактор", "shortcuts-explained": "В межах завдання натисніть ESC та знак питання, щоб переглянути список доступних скорочень.", "username": { "contains invalid characters": "Ім’я користувача «{{username}}» містить неприпустимі символи", @@ -346,13 +353,14 @@ "donated": "Задонатив(-ла) спільноті", "projects": "Проєкти", "stats": "Статистика", + "activity": "Активність", "timeline": "Хронологія", "none-completed": "Поки що немає виконаних завдань.", "get-started": "Почніть тут.", "challenge": "Завдання", "completed": "Виконано", "add-linkedin": "Додати цю сертифікацію до мого профілю LinkedIn", - "add-twitter": "Поділитися цією сертифікацією у Twitter", + "add-twitter": "Поділитись сертифікацією на X", "tweet": "Я щойно отримав(-ла) сертифікацію {{certTitle}} від @freeCodeCamp! Перегляньте її тут: {{certURL}}", "avatar": "Аватар {{username}}", "joined": "Приєднався(-лась) {{date}}", @@ -361,7 +369,9 @@ "points": "{{count}}х балів станом на {{date}}", "points_plural": "{{count}}х балів станом на {{date}}", "page-number": "{{pageNumber}} з {{totalPages}}", - "edit-my-profile": "Редагувати профіль" + "edit-my-profile": "Редагувати профіль", + "add-bluesky": "Поділитись сертифікацією на BlueSky", + "add-threads": "Поділитись сертифікацією на Threads" }, "footer": { "tax-exempt-status": "freeCodeCamp — це некомерційна організація, яка підтримується спонсорськими внесками та звільнена від сплати податків 501(c)(3) (Федеральний ідентифікаційний номер платника податків США: 82-0779546).", @@ -416,6 +426,7 @@ "assignments": "Завдання", "question": "Запитання", "questions": "Запитання", + "answered-mcq": "Ви не відповіли на всі запитання та/або допустились помилок.", "explanation": "Пояснення", "solution-link": "Посилання на розв’язок", "source-code-link": "Посилання на вихідний код", @@ -501,7 +512,9 @@ "complete-both-steps": "Виконайте обидва кроки, щоб закінчити завдання.", "runs-in-vm": "Проєкт виконується на віртуальній машині; виконайте описані там історії користувачів та пройдіть всі тести, щоб завершити крок 1.", "completed": "Виконано", + "not-completed": "Не завершено", "not-started": "Не розпочато", + "steps-completed": "Виконано кроків: {{completedSteps}} з {{totalSteps}}", "test": "Тест", "sorry-try-again": "На жаль, ваш код не працює. Спробуйте ще раз.", "sorry-keep-trying": "На жаль, ваш код не працює. Продовжуйте спроби.", @@ -541,7 +554,7 @@ "correct-answers": "Правильних відповідей: {{ n }}", "percent-correct": "Відсоток правильних відповідей: {{ n }}%", "passed-message": "Вітаємо! Ви пройшли екзамен та можете отримати сертифікацію.", - "not-passed-message": "На жаль, ви не відповіли на достатню кількість запитань, щоб пройти екзамен.", + "not-passed-message": "На жаль, ви не відповіли на достатню кількість запитань, щоб скласти екзамен.", "results-header": "Результати «{{ title }}»", "question-results": "Ви правильно відповіли на {{ n }} з {{ q }} запитань", "percent-results": "{{ p }}% правильно", @@ -583,6 +596,7 @@ "redirecting": "Переадресація...", "thanks": "Дякуємо за донат", "thank-you": "Дякуємо за вашу підтримку", + "thank-you-continued": "Дякуємо за постійну підтримку", "success-card-update": "Вашу картку успішно оновлено.", "additional": "Ви можете зробити додатковий одноразовий донат на будь-яку суму за цим посиланням: <0>{{url}}", "help-more": "Допоможіть нашій організації робити більше", @@ -618,6 +632,10 @@ "progress-modal-cta-10": "Задонатьте зараз, щоб допомогти нам розробити безоплатні сертифікації з програмування.", "help-us-reach-20k": "Задонатьте зараз, щоб допомогти нашій організації досягнути мети у 20 000 донорів цього року.", "beta-certification": "Ця сертифікація знаходиться в бета-версії. Будь ласка, зробіть донат, щоб підтримати її створення.", + "unfinished-certification": "Сертифікація знаходиться в стані активної розробки. Наразі для неї немає сертифіката, але він буде доступний найближчим часом. Тим часом ви можете дослідити курси, які ми вже створили.", + "consider-donating": "Якщо бажаєте, зробіть донат на підтримку розробки.", + "unfinished-certification-2": "Для отримання цієї сертифікації потрібно багато часу і зусиль. Якщо ви розпочнете зараз, то будете готові до екзамену як тільки ми його опублікуємо протягом найближчих місяців.", + "consider-donating-2": "Якщо ви хочете пришвидшити створення цієї навчальної програми, <0>то можете стати донором нашої спільноти.", "help-us-develop": "Допоможіть нам розробити безоплатні сертифікації з програмування.", "nicely-done": "Чудово. Ви щойно завершили {{block}}.", "credit-card": "Кредитна картка", @@ -683,7 +701,7 @@ "bear-progress-alt": "Ведмежатко з прохальним виразом обличчя, що тримає порожню банку для коштів.", "bear-completion-alt": "Ведмежатко, що тримає великий трофей.", "flying-bear": "Зображення чарівного плюшевого ведмедика з академічною шапочкою та значком донора.", - "crucial-contribution": "Ваш внесок відіграє велику роль у створенні матеріалу, який надасть мільйонам людей можливість опанувати нові навички та забезпечити сім’ю.", + "crucial-contribution": "Ваші внески відіграють велику роль у створенні матеріалу, який надає мільйонам людей можливість опанувати нові навички та забезпечити сім’ю.", "support-benefits-title": "Переваги стати донором:", "support-benefits-1": "Жодних спливаючих повідомлень про донати", "support-benefits-2": "Ви отримаєте значок донора", @@ -710,6 +728,8 @@ "help-millions-learn": "Допоможіть мільйонам людей навчатись", "reach-goals-faster": "Досягайте цілей швидше", "remove-distractions": "Позбавтесь повідомлень", + "remove-interruptions": "Позбавтесь повідомлень", + "acquire-skills-faster": "Набувайте навичок швидше", "animation-description": "Це 20-секундна анімаційна реклама, щоб заохотити кемперів стати донорами freeCodeCamp. Анімація починається з ведмедика, який стає донором. В результаті відволікаючі спливаючі вікна зникають, і ведмедик може досягти своїх цілей. Потім він закінчує навчання і стає освітнім супергероєм, який допомагає людям по всьому світу.", "animation-countdown": "До завершення анімації залишилось: {{secondsRemaining}}." }, @@ -741,6 +761,7 @@ "result-list": "Результати пошуку" }, "misc": { + "coming-soon": "Зовсім скоро", "offline": "Схоже, що ви не підключені до мережі, тому не зможете зберегти свій прогрес", "server-offline": "Сервер не відповідає, ваш прогрес може не зберегтись. Будь ласка, зв’яжіться з <0>підтримкою, якщо помилка не зникне", "unsubscribed": "Підписку успішно скасовано", @@ -852,7 +873,7 @@ "expired-link": "Схоже, посилання, на яке ви натиснули, застаріло. Будь ласка, створіть запит на нове посилання, щоб увійти", "signin-success": "Ви успішно ввійшли у свій обліковий запис. Щасливого програмування!", "social-auth-gone": "Ми відходимо від автентифікації за допомогою соцмереж через конфіденційність. Наступного разу ми рекомендуємо використовувати свою адресу електронної пошти: {{email}} для входу в систему.", - "name-needed": "Нам потрібне ваше ім’я, щоб ми могли вказати його на сертифікаті. Додайте своє ім’я до налаштувань облікового запису і натисніть кнопку «Зберегти». Після цього ми зможемо видати вам сертифікат.", + "name-needed": "Нам потрібне ваше ім’я, щоб вказати його на сертифікаті. Будь ласка, додайте своє ім’я до профілю і натисніть кнопку «Зберегти». Після цього ми зможемо видати сертифікат.", "incomplete-steps": "Схоже, ви не завершили необхідні кроки. Будь ласка, виконайте необхідні проєкти, щоб отримати сертифікацію {{name}}.", "already-claimed": "Схоже, ви вже отримали сертифікацію «{{name}}»", "cert-claim-success": "@{{username}}, ви успішно отримали сертифікацію «{{name}}»! Вітаємо від імені команди freeCodeCamp.org!", @@ -891,6 +912,7 @@ "invalid-update-flag": "Ви намагаєтеся отримати доступ до заборонених ресурсів. Зверніться по допомогу на https://forum.freecodecamp.org, якщо це є дійсним запитом.", "generate-exam-error": "Під час спроби створити екзамен виникла помилка.", "cert-not-found": "Сертифікація «{{certSlug}}» не існує.", + "reset-editor-layout": "Редактор скинуто.", "ms": { "transcript": { "link-err-1": "Будь ласка, вкажіть посилання на стенограму Microsoft в запиті.", @@ -951,6 +973,8 @@ "issued": "Виданий", "fulltext": "<0>Цей сертифікат засвідчує, що <1>{{user}} <2>успішно закінчив(-ла) сертифікацію <3>«{{title}}» <4>{{time}}, <5>виконавши приблизно {{completionTime}} год навчання", "fulltextNoHours": "<0>Цей сертифікат підтверджує, що <1>{{user}} <2>успішно завершив(-ла) сертифікацію <3>{{title}} <4>{{time}}", + "quincy-larson-signature": "Підпис Квінсі Ларсона", + "julia-liuson-signature": "Підпис Джулії Люсон", "project": { "heading-legacy-full-stack": "В рамках сертифікації програмного забезпечення повного циклу {{user}} отримав(-ла) такі сертифікації:", "heading-exam": "{{user}} склав(-ла) екзамен в рамках цієї сертифікації: ", @@ -1037,50 +1061,50 @@ } }, "title": { - "Responsive Web Design": "Адаптивний вебдизайн", - "responsive-web-design": "Сертифікація «Адаптивний вебдизайн»", - "JavaScript Algorithms and Data Structures": "Алгоритми JavaScript та структури даних (застаріла версія)", - "javascript-algorithms-and-data-structures": "Сертифікація «Алгоритми JavaScript та структури даних (застаріла версія)»", - "javascript-algorithms-and-data-structures-v8": "Сертифікація «Алгоритми JavaScript та структури даних» (бета)", - "Front End Development Libraries": "Бібліотеки Front End", - "front-end-development-libraries": "Сертифікація «Бібліотеки Front End»", - "Data Visualization": "Візуалізація даних", - "data-visualization": "Сертифікація «Візуалізація даних»", - "Relational Database": "Реляційна база даних", - "relational-database-v8": "Сертифікація «Реляційна база даних»", - "Back End Development and APIs": "Розробка Back End та API", - "back-end-development-and-apis": "Сертифікація «Розробка Back End та API»", - "Quality Assurance": "Забезпечення якості", - "quality-assurance-v7": "Сертифікація «Забезпечення якості»", - "Scientific Computing with Python": "Наукові обчислення з Python", - "scientific-computing-with-python-v7": "Сертифікація «Наукові обчислення з Python»", - "Data Analysis with Python": "Аналіз даних з Python", - "data-analysis-with-python-v7": "Сертифікація «Аналіз даних з Python»", - "Information Security": "Інформаційна безпека", - "information-security-v7": "Сертифікація «Інформаційна безпека»", - "Machine Learning with Python": "Машинне навчання з Python", - "machine-learning-with-python-v7": "Сертифікація «Машинне навчання з Python»", - "College Algebra with Python": "Алгебра з Python", - "college-algebra-with-python-v8": "Сертифікація «Алгебра з Python»", - "Foundational C# with Microsoft": "Основи C# з Microsoft", - "foundational-c-sharp-with-microsoft": "Сертифікація «Основи C# з Microsoft»", - "A2 English for Developers": "Англійська мова A2 для розробників", - "a2-english-for-developers": "Сертифікація «Англійська мова A2 для розробників»", - "B1 English for Developers": "Англійська мова B1 для розробників", - "b1-english-for-developers": "Сертифікація «Англійська мова B1 для розробників»", - "Full Stack Developer": "Full stack розробник", - "full-stack-developer-v9": "Сертифікований full stack розробник", - "Legacy Front End": "Застарілий Front End", - "legacy-front-end": "Застаріла сертифікація «Front End»", - "Legacy Back End": "Застарілий Back End", - "legacy-back-end": "Застаріла сертифікація «Back End»", - "Legacy Data Visualization": "Застаріла візуалізація даних", - "legacy-data-visualization": "Застаріла сертифікація «Візуалізація даних»", - "Legacy Information Security and Quality Assurance": "Застаріла інформаційна безпека та забезпечення якості", - "information-security-and-quality-assurance": "Застаріла сертифікація «Інформаційна безпека та забезпечення якості»", - "Legacy Full Stack Certification": "Застаріла сертифікація «Full Stack»", - "Legacy Full Stack": "Застарілий Full Stack", - "full-stack": "Застаріла сертифікація «Full Stack»" + "responsive-web-design": "Адаптивний вебдизайн", + "responsive-web-design-cert": "Сертифікація «Адаптивний вебдизайн»", + "javascript-algorithms-and-data-structures": "Алгоритми та структури даних JavaScript (стара версія)", + "javascript-algorithms-and-data-structures-cert": "Сертифікація «Алгоритми та структури даних JavaScript» (стара версія)", + "javascript-algorithms-and-data-structures-v8": "Алгоритми та структури даних JavaScript", + "javascript-algorithms-and-data-structures-v8-cert": "Сертифікація «Алгоритми та структури даних JavaScript»", + "front-end-development-libraries": "Бібліотеки Front End", + "front-end-development-libraries-cert": "Сертифікація «Бібліотеки Front End»", + "data-visualization": "Візуалізація даних", + "data-visualization-cert": "Сертифікація «Візуалізація даних»", + "relational-database-v8": "Реляційна база даних", + "relational-database-v8-cert": "Сертифікація «Реляційна база даних»", + "back-end-development-and-apis": "Розробка Back End та API", + "back-end-development-and-apis-cert": "Сертифікація «Розробка Back End та API»", + "quality-assurance-v7": "Забезпечення якості", + "quality-assurance-v7-cert": "Сертифікація «Забезпечення якості»", + "scientific-computing-with-python-v7": "Наукові обчислення з Python", + "scientific-computing-with-python-v7-cert": "Сертифікація «Наукові обчислення з Python»", + "data-analysis-with-python-v7": "Аналіз даних з Python", + "data-analysis-with-python-v7-cert": "Сертифікація «Аналіз даних з Python»", + "information-security-v7": "Інформаційна безпека", + "information-security-v7-cert": "Сертифікація «Інформаційна безпека»", + "machine-learning-with-python-v7": "Машинне навчання з Python", + "machine-learning-with-python-v7-cert": "Сертифікація «Машинне навчання з Python»", + "college-algebra-with-python-v8": "Алгебра з Python", + "college-algebra-with-python-v8-cert": "Сертифікація «Алгебра з Python»", + "foundational-c-sharp-with-microsoft": "Основи C# з Microsoft", + "foundational-c-sharp-with-microsoft-cert": "Сертифікація «Основи C# з Microsoft»", + "a2-english-for-developers": "Англійська мова A2 для розробників", + "a2-english-for-developers-cert": "Сертифікація «Англійська мова A2 для розробників»", + "b1-english-for-developers": "Англійська мова B1 для розробників", + "b1-english-for-developers-cert": "Сертифікація «Англійська мова B1 для розробників»", + "full-stack-developer-v9": "Full Stack розробник", + "full-stack-developer-v9-cert": "Сертифікація «Full Stack розробник»", + "legacy-front-end": "Front End (стара версія)", + "legacy-front-end-cert": "Сертифікація «Front End» (стара версія)", + "legacy-back-end": "Back End (стара версія)", + "legacy-back-end-cert": "Сертифікація «Back End» (стара версія)", + "legacy-data-visualization": "Візуалізація даних (стара версія)", + "legacy-data-visualization-cert": "Сертифікація «Візуалізація даних» (стара версія)", + "information-security-and-quality-assurance": "Інформаційна безпека та забезпечення якості (стара версія)", + "information-security-and-quality-assurance-cert": "Сертифікація «Інформаційна безпека та забезпечення якості» (стара версія)", + "full-stack": "Full Stack (стара версія)", + "full-stack-cert": "Сертифікація «Full Stack» (стара версія)" } }, "certification-card": { diff --git a/client/package.json b/client/package.json index c89ac6a1fbe87f..92992af4d2e30f 100644 --- a/client/package.json +++ b/client/package.json @@ -44,14 +44,15 @@ "@babel/preset-react": "7.23.3", "@babel/preset-typescript": "7.23.3", "@babel/standalone": "7.23.7", - "@fortawesome/fontawesome-svg-core": "6.4.2", - "@fortawesome/free-brands-svg-icons": "6.4.2", - "@fortawesome/free-solid-svg-icons": "6.4.2", - "@fortawesome/react-fontawesome": "0.2.0", + "@fortawesome/fontawesome-svg-core": "6.7.1", + "@fortawesome/free-brands-svg-icons": "6.7.1", + "@fortawesome/free-solid-svg-icons": "6.7.1", + "@fortawesome/react-fontawesome": "0.2.2", "@freecodecamp/loop-protect": "3.0.0", "@freecodecamp/react-calendar-heatmap": "1.1.0", - "@freecodecamp/ui": "3.1.0", + "@freecodecamp/ui": "3.1.1", "@growthbook/growthbook-react": "0.20.0", + "@headlessui/react": "1.7.19", "@loadable/component": "5.16.3", "@reach/router": "1.3.4", "@redux-devtools/extension": "3.3.0", diff --git a/client/src/analytics/call-ga.ts b/client/src/analytics/call-ga.ts index 98da19af5b6925..0c9599c31bb593 100644 --- a/client/src/analytics/call-ga.ts +++ b/client/src/analytics/call-ga.ts @@ -32,11 +32,15 @@ type DonationRelatedEventAction = | 'Modal Become Supporter Click' | 'Donate Page Patreon Payment Redirection' | 'Modal Patreon Payment Redirection' + | 'Amount Confirmation Clicked' + | 'Select Amount Tab Clicked' + | 'Edit Amount Clicked' | 'Certificate Patreon Payment Redirection'; interface DonationRelatedEvent { event: 'donation_related'; action: DonationRelatedEventAction; + amount?: DonationAmount; } type DonationViewEventAction = diff --git a/client/src/assets/chapter-icon.tsx b/client/src/assets/chapter-icon.tsx new file mode 100644 index 00000000000000..aff2d4927f2cbb --- /dev/null +++ b/client/src/assets/chapter-icon.tsx @@ -0,0 +1,33 @@ +import React from 'react'; +import { FsdChapters } from '../../../shared/config/chapters'; +import DatabaseIcon from './icons/database'; +import JavaScriptIcon from './icons/javascript'; +import ReactIcon from './icons/react'; +import ResponsiveDesign from './icons/responsive-design'; +import FreeCodeCampIcon from './icons/freecodecamp'; +import Html from './icons/html'; +import Css from './icons/css'; +import NodeIcon from './icons/node'; +import Python from './icons/python'; + +const iconMap = { + [FsdChapters.Welcome]: FreeCodeCampIcon, + [FsdChapters.Html]: Html, + [FsdChapters.Css]: Css, + [FsdChapters.Javascript]: JavaScriptIcon, + [FsdChapters.FrontendLibraries]: ReactIcon, + [FsdChapters.RelationalDatabases]: DatabaseIcon, + [FsdChapters.BackendJavascript]: NodeIcon, + [FsdChapters.Python]: Python +}; + +type ChapterIconProps = { + chapter: FsdChapters; +} & React.SVGProps; + +export function ChapterIcon(props: ChapterIconProps): JSX.Element { + const { chapter, ...iconProps } = props; + const Icon = iconMap[chapter] ?? ResponsiveDesign; + + return ; +} diff --git a/client/src/assets/icons/code.tsx b/client/src/assets/icons/code.tsx new file mode 100644 index 00000000000000..fcc5b499181c53 --- /dev/null +++ b/client/src/assets/icons/code.tsx @@ -0,0 +1,22 @@ +import React from 'react'; + +function Code( + props: JSX.IntrinsicAttributes & React.SVGProps +): JSX.Element { + return ( + <> + + + + + ); +} + +Code.displayName = 'Code'; + +export default Code; diff --git a/client/src/assets/icons/css.tsx b/client/src/assets/icons/css.tsx new file mode 100644 index 00000000000000..95bdab948c6fc4 --- /dev/null +++ b/client/src/assets/icons/css.tsx @@ -0,0 +1,15 @@ +import React from 'react'; + +function Css( + props: JSX.IntrinsicAttributes & React.SVGProps +): JSX.Element { + return ( + + + + ); +} + +Css.displayName = 'Css'; + +export default Css; diff --git a/client/src/assets/icons/dropdown.tsx b/client/src/assets/icons/dropdown.tsx index f7326016affeeb..5b2f9333aaa021 100644 --- a/client/src/assets/icons/dropdown.tsx +++ b/client/src/assets/icons/dropdown.tsx @@ -9,6 +9,7 @@ function DropDown(): JSX.Element { height='10' viewBox='0 0 389 254' fill='none' + className='dropdown-icon' > +): JSX.Element { + return ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +} + +FreeCodeCampLogo.displayName = 'FreeCodeCampLogo'; + +export default FreeCodeCampLogo; diff --git a/client/src/assets/icons/freecodecamp.tsx b/client/src/assets/icons/freecodecamp.tsx index 1e1a28f8321dfd..1316044a46bff2 100644 --- a/client/src/assets/icons/freecodecamp.tsx +++ b/client/src/assets/icons/freecodecamp.tsx @@ -1,114 +1,15 @@ import React from 'react'; -function FreeCodeCampLogo( +function FreeCodeCampIcon( props: JSX.IntrinsicAttributes & React.SVGProps ): JSX.Element { return ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + ); } -FreeCodeCampLogo.displayName = 'FreeCodeCampLogo'; +FreeCodeCampIcon.displayName = 'FreeCodeCampIcon'; -export default FreeCodeCampLogo; +export default FreeCodeCampIcon; diff --git a/client/src/assets/icons/html.tsx b/client/src/assets/icons/html.tsx new file mode 100644 index 00000000000000..a9e0ae5aeb89fe --- /dev/null +++ b/client/src/assets/icons/html.tsx @@ -0,0 +1,15 @@ +import React from 'react'; + +function Html( + props: JSX.IntrinsicAttributes & React.SVGProps +): JSX.Element { + return ( + + + + ); +} + +Html.displayName = 'Html'; + +export default Html; diff --git a/client/src/assets/icons/node.tsx b/client/src/assets/icons/node.tsx new file mode 100644 index 00000000000000..c5358815d80bb0 --- /dev/null +++ b/client/src/assets/icons/node.tsx @@ -0,0 +1,15 @@ +import React from 'react'; + +function NodeIcon( + props: JSX.IntrinsicAttributes & React.SVGProps +): JSX.Element { + return ( + + + + ); +} + +NodeIcon.displayName = 'NodeIcon'; + +export default NodeIcon; diff --git a/client/src/assets/icons/superblock-icon.tsx b/client/src/assets/icons/superblock-icon.tsx deleted file mode 100644 index 3128484c60946d..00000000000000 --- a/client/src/assets/icons/superblock-icon.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import React from 'react'; -import { SuperBlocks } from '../../../../shared/config/curriculum'; -import APIIcon from './api'; -import D3Icon from './d3'; -import DatabaseIcon from './database'; -import JavaScriptIcon from './javascript'; -import ReactIcon from './react'; -import TensorflowIcon from './tensorflow'; -import Algorithm from './algorithm'; -import Analytics from './analytics'; -import Clipboard from './clipboard'; -import PythonIcon from './python'; -import ResponsiveDesign from './responsive-design'; -import Shield from './shield'; -import VikingHelmet from './viking-helmet'; -import Graduation from './graduation'; -import CollegeAlgebra from './college-algebra'; -import CSharpLogo from './c-sharp-logo'; -import A2EnglishIcon from './a2-english'; -import B1EnglishIcon from './b1-english'; -import RosettaCodeIcon from './rosetta-code'; - -const iconMap = { - [SuperBlocks.RespWebDesignNew]: ResponsiveDesign, - [SuperBlocks.RespWebDesign]: ResponsiveDesign, - [SuperBlocks.JsAlgoDataStruct]: JavaScriptIcon, - [SuperBlocks.JsAlgoDataStructNew]: JavaScriptIcon, - [SuperBlocks.FrontEndDevLibs]: ReactIcon, - [SuperBlocks.DataVis]: D3Icon, - [SuperBlocks.BackEndDevApis]: APIIcon, - [SuperBlocks.RelationalDb]: DatabaseIcon, - [SuperBlocks.QualityAssurance]: Clipboard, - [SuperBlocks.SciCompPy]: PythonIcon, - [SuperBlocks.DataAnalysisPy]: Analytics, - [SuperBlocks.InfoSec]: Shield, - [SuperBlocks.MachineLearningPy]: TensorflowIcon, - [SuperBlocks.CodingInterviewPrep]: Algorithm, - [SuperBlocks.TheOdinProject]: VikingHelmet, - [SuperBlocks.ProjectEuler]: Graduation, - [SuperBlocks.CollegeAlgebraPy]: CollegeAlgebra, - [SuperBlocks.FoundationalCSharp]: CSharpLogo, - [SuperBlocks.FullStackDeveloper]: ResponsiveDesign, - [SuperBlocks.UpcomingPython]: PythonIcon, - [SuperBlocks.A2English]: A2EnglishIcon, - [SuperBlocks.B1English]: B1EnglishIcon, - [SuperBlocks.RosettaCode]: RosettaCodeIcon, - [SuperBlocks.PythonForEverybody]: PythonIcon -}; - -type SuperBlockIconProps = { - superBlock: SuperBlocks; -} & React.SVGProps; - -export function SuperBlockIcon(props: SuperBlockIconProps): JSX.Element { - const { superBlock, className, ...iconProps } = props; - // fallback in case super block doesn't exist and for tests - const Icon = iconMap[superBlock] ? iconMap[superBlock] : ResponsiveDesign; - - return ; -} diff --git a/client/src/assets/images/new-bear-animation.svg b/client/src/assets/images/new-bear-animation.svg new file mode 100644 index 00000000000000..765f224b674e04 --- /dev/null +++ b/client/src/assets/images/new-bear-animation.svg @@ -0,0 +1,5 @@ + + + \ No newline at end of file diff --git a/client/src/assets/superblock-icon.tsx b/client/src/assets/superblock-icon.tsx new file mode 100644 index 00000000000000..ad10a5e1dcaff8 --- /dev/null +++ b/client/src/assets/superblock-icon.tsx @@ -0,0 +1,59 @@ +import React from 'react'; +import { SuperBlocks } from '../../../shared/config/curriculum'; +import APIIcon from './icons/api'; +import D3Icon from './icons/d3'; +import DatabaseIcon from './icons/database'; +import JavaScriptIcon from './icons/javascript'; +import ReactIcon from './icons/react'; +import TensorflowIcon from './icons/tensorflow'; +import Algorithm from './icons/algorithm'; +import Analytics from './icons/analytics'; +import Clipboard from './icons/clipboard'; +import PythonIcon from './icons/python'; +import ResponsiveDesign from './icons/responsive-design'; +import Shield from './icons/shield'; +import VikingHelmet from './icons/viking-helmet'; +import Graduation from './icons/graduation'; +import CollegeAlgebra from './icons/college-algebra'; +import CSharpLogo from './icons/c-sharp-logo'; +import A2EnglishIcon from './icons/a2-english'; +import B1EnglishIcon from './icons/b1-english'; +import RosettaCodeIcon from './icons/rosetta-code'; +import Code from './icons/code'; + +const iconMap = { + [SuperBlocks.RespWebDesignNew]: ResponsiveDesign, + [SuperBlocks.RespWebDesign]: ResponsiveDesign, + [SuperBlocks.JsAlgoDataStruct]: JavaScriptIcon, + [SuperBlocks.JsAlgoDataStructNew]: JavaScriptIcon, + [SuperBlocks.FrontEndDevLibs]: ReactIcon, + [SuperBlocks.DataVis]: D3Icon, + [SuperBlocks.BackEndDevApis]: APIIcon, + [SuperBlocks.RelationalDb]: DatabaseIcon, + [SuperBlocks.QualityAssurance]: Clipboard, + [SuperBlocks.SciCompPy]: PythonIcon, + [SuperBlocks.DataAnalysisPy]: Analytics, + [SuperBlocks.InfoSec]: Shield, + [SuperBlocks.MachineLearningPy]: TensorflowIcon, + [SuperBlocks.CodingInterviewPrep]: Algorithm, + [SuperBlocks.TheOdinProject]: VikingHelmet, + [SuperBlocks.ProjectEuler]: Graduation, + [SuperBlocks.CollegeAlgebraPy]: CollegeAlgebra, + [SuperBlocks.FoundationalCSharp]: CSharpLogo, + [SuperBlocks.FullStackDeveloper]: Code, + [SuperBlocks.A2English]: A2EnglishIcon, + [SuperBlocks.B1English]: B1EnglishIcon, + [SuperBlocks.RosettaCode]: RosettaCodeIcon, + [SuperBlocks.PythonForEverybody]: PythonIcon +}; + +type SuperBlockIconProps = { + superBlock: SuperBlocks; +} & React.SVGProps; + +export function SuperBlockIcon(props: SuperBlockIconProps): JSX.Element { + const { superBlock, ...iconProps } = props; + const Icon = iconMap[superBlock] ? iconMap[superBlock] : ResponsiveDesign; + + return ; +} diff --git a/client/src/client-only-routes/show-certification.tsx b/client/src/client-only-routes/show-certification.tsx index 70c98a608810fb..234c1eb665d43c 100644 --- a/client/src/client-only-routes/show-certification.tsx +++ b/client/src/client-only-routes/show-certification.tsx @@ -9,12 +9,12 @@ import { Container, Col, Row, Image, Button, Spacer } from '@freecodecamp/ui'; import envData from '../../config/env.json'; import { getLangCode } from '../../../shared/config/i18n'; -import FreeCodeCampLogo from '../assets/icons/freecodecamp'; +import FreeCodeCampLogo from '../assets/icons/freecodecamp-logo'; import MicrosoftLogo from '../assets/icons/microsoft-logo'; import { createFlashMessage } from '../components/Flash/redux'; import { Loader } from '../components/helpers'; import RedirectHome from '../components/redirect-home'; -import { Themes } from '../components/settings/theme'; +import { LocalStorageThemes } from '../redux/types'; import { showCert, fetchProfileForUser } from '../redux/actions'; import { showCertSelector, @@ -35,9 +35,8 @@ import { import { PaymentContext } from '../../../shared/config/donation-settings'; import ribbon from '../assets/images/ribbon.svg'; import { + Certification, CertSlug, - certTypes, - certTypeTitleMap, linkedInCredentialIds } from '../../../shared/config/certification-settings'; import MultiTierDonationForm from '../components/Donation/multi-tier-donation-form'; @@ -273,7 +272,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => { data-playwright-test-label='donation-form' > { > {t('profile.add-twitter')} + + + + ); - const isMicrosoftCert = - certTitle === certTypeTitleMap[certTypes.foundationalCSharpV8]; + const isMicrosoftCert = certSlug === Certification.FoundationalCSharp; return ( @@ -376,7 +402,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => { ? 'certification.fulltextNoHours' : 'certification.fulltext' } - title={certTitle} + title={t(`certification.title.${certSlug}`, certTitle)} >

placeholder

@@ -388,7 +414,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => {

{{ - title: t(`certification.title.${certTitle}`, certTitle) + title: t(`certification.title.${certSlug}`, certTitle) }}

@@ -412,7 +438,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => {
Quincy Larson's Signature {
Julia Liusons's Signature {
Quincy Larson's Signature { {signedInUserName === username ? shareCertBtns : ''} - +
diff --git a/client/src/client-only-routes/show-project-links.tsx b/client/src/client-only-routes/show-project-links.tsx index c6a18ddd39972f..df5d3a1adb2f14 100644 --- a/client/src/client-only-routes/show-project-links.tsx +++ b/client/src/client-only-routes/show-project-links.tsx @@ -7,10 +7,7 @@ import { Table, Spacer } from '@freecodecamp/ui'; import { Link } from '../components/helpers'; import ProjectModal from '../components/SolutionViewer/project-modal'; import type { CompletedChallenge, User } from '../redux/prop-types'; -import { - certsToProjects, - type CertTitle -} from '../../config/cert-and-project-map'; +import { certsToProjects } from '../../config/cert-and-project-map'; import { SolutionDisplayWidget } from '../components/solution-display-widget'; import ProjectPreviewModal from '../templates/Challenges/components/project-preview-modal'; @@ -20,8 +17,9 @@ import { openModal } from '../templates/Challenges/redux/actions'; import { regeneratePathAndHistory } from '../../../shared/utils/polyvinyl'; import '../components/layouts/project-links.css'; +import { Certification } from '../../../shared/config/certification-settings'; interface ShowProjectLinksProps { - certName: string; + certSlug: Certification; name: string; user: User; openModal: (arg: string) => void; @@ -101,28 +99,27 @@ const ShowProjectLinks = (props: ShowProjectLinksProps): JSX.Element => { ); }; - const ProjectsFor = ({ certName }: { certName: CertTitle }) => { - if (certName === 'Legacy Full Stack') { + const ProjectsFor = ({ certSlug }: { certSlug: Certification }) => { + if (certSlug === Certification.LegacyFullStack) { const certs = [ - { title: 'Responsive Web Design' }, - { title: 'Legacy JavaScript Algorithms and Data Structures' }, - { title: 'Front End Development Libraries' }, - { title: 'Data Visualization' }, - { title: 'Back End Development and APIs' }, - { title: 'Legacy Information Security and Quality Assurance' } + { name: Certification.RespWebDesign }, + { name: Certification.JsAlgoDataStruct }, + { name: Certification.LegacyFrontEnd }, + { name: Certification.LegacyDataVis }, + { name: Certification.LegacyBackEnd }, + { name: Certification.LegacyInfoSecQa } ] as const; return ( <> {certs.map((cert, ind) => { - const projects = certsToProjects[cert.title]; - const { certSlug } = projects[0]; - const certLocation = `/certification/${username}/${certSlug}`; + const certLocation = `/certification/${username}/${cert.name}`; + return ( - {t(`certification.title.${cert.title}`, cert.title)} + {t(`certification.title.${cert.name}`)} @@ -132,7 +129,7 @@ const ShowProjectLinks = (props: ShowProjectLinksProps): JSX.Element => { ); } - const projects = certsToProjects[certName]; + const projects = certsToProjects[certSlug]; return ( <> {projects.map(({ link, title, id }) => ( @@ -150,17 +147,17 @@ const ShowProjectLinks = (props: ShowProjectLinksProps): JSX.Element => { }; const { - certName, + certSlug, name, user: { username } } = props; const { completedChallenge, showCode, projectTitle } = solutionState; const examResults = completedChallenge?.examResults; - const getCertHeading = (certName: string) => { - if (certName == 'Legacy Full Stack') { + const getCertHeading = (cert: Certification) => { + if (cert === Certification.LegacyFullStack) { return 'certification.project.heading-legacy-full-stack'; - } else if (certName == 'Foundational C# with Microsoft') { + } else if (cert === Certification.FoundationalCSharp) { return 'certification.project.heading-exam'; } else { return 'certification.project.heading'; @@ -177,15 +174,9 @@ const ShowProjectLinks = (props: ShowProjectLinksProps): JSX.Element => { } : null; - const isCertName = (maybeCertName: string): maybeCertName is CertTitle => { - if (maybeCertName === 'Legacy Full Stack') return true; - return maybeCertName in certsToProjects; - }; - if (!isCertName(certName)) return
Unknown Certification
; - return (
- {t(getCertHeading(certName), { user: name })} + {t(getCertHeading(certSlug), { user: name })} @@ -196,7 +187,7 @@ const ShowProjectLinks = (props: ShowProjectLinksProps): JSX.Element => { - +
@@ -216,7 +207,7 @@ const ShowProjectLinks = (props: ShowProjectLinksProps): JSX.Element => { /> - {certName != 'Foundational C# with Microsoft' && ( + {certSlug !== Certification.FoundationalCSharp && ( If you suspect that any of these projects violate the{' '} & { +type ShowSettingsProps = { createFlashMessage: typeof createFlashMessage; isSignedIn: boolean; navigate: (location: string) => void; showLoading: boolean; toggleSoundMode: (sound: boolean) => void; + resetEditorLayout: () => void; toggleKeyboardShortcuts: (keyboardShortcuts: boolean) => void; updateIsHonest: () => void; updateQuincyEmail: (isSendQuincyEmail: boolean) => void; @@ -73,13 +73,13 @@ const mapDispatchToProps = { createFlashMessage, navigate, submitNewAbout, - toggleNightMode: (theme: Themes) => updateMyTheme({ theme }), toggleSoundMode: (sound: boolean) => updateMySound({ sound }), toggleKeyboardShortcuts: (keyboardShortcuts: boolean) => updateMyKeyboardShortcuts({ keyboardShortcuts }), updateIsHonest: updateMyHonesty, updateQuincyEmail: (sendQuincyEmail: boolean) => updateMyQuincyEmail({ sendQuincyEmail }), + resetEditorLayout: () => resetMyEditorLayout(), verifyCert }; @@ -88,9 +88,9 @@ export function ShowSettings(props: ShowSettingsProps): JSX.Element { const { createFlashMessage, isSignedIn, - toggleNightMode, toggleSoundMode, toggleKeyboardShortcuts, + resetEditorLayout, user: { completedChallenges, email, @@ -117,7 +117,6 @@ export function ShowSettings(props: ShowSettingsProps): JSX.Element { isHonest, sendQuincyEmail, username, - theme, keyboardShortcuts }, navigate, @@ -140,6 +139,7 @@ export function ShowSettings(props: ShowSettingsProps): JSX.Element { return ; } const sound = (store.get('fcc-sound') as boolean) ?? false; + const editorLayout = (store.get('challenge-layout') as boolean) ?? false; return ( <> @@ -158,11 +158,11 @@ export function ShowSettings(props: ShowSettingsProps): JSX.Element { {t('settings.for', { username: username })} diff --git a/client/src/components/Donation/donate-form.tsx b/client/src/components/Donation/donate-form.tsx index a426dfb58d477b..2166fad829d2ed 100644 --- a/client/src/components/Donation/donate-form.tsx +++ b/client/src/components/Donation/donate-form.tsx @@ -21,10 +21,10 @@ import { isDonatingSelector, signInLoadingSelector, donationFormStateSelector, - completedChallengesSelector + completedChallengesSelector, + themeSelector } from '../../redux/selectors'; -import { Themes } from '../settings/theme'; -import { DonateFormState } from '../../redux/types'; +import { LocalStorageThemes, DonateFormState } from '../../redux/types'; import type { CompletedChallenge } from '../../redux/prop-types'; import { CENTS_IN_DOLLAR, formattedAmountLabel } from './utils'; import DonateCompletion from './donate-completion'; @@ -61,7 +61,7 @@ type PostCharge = (data: { type DonateFormProps = { postCharge: PostCharge; - defaultTheme?: Themes; + defaultTheme?: LocalStorageThemes; email: string; handleProcessing?: () => void; editAmount?: () => void; @@ -72,10 +72,10 @@ type DonateFormProps = { isDonating: boolean; showLoading: boolean; t: TFunction; - theme: Themes; updateDonationFormState: (state: DonationApprovalData) => unknown; paymentContext: PaymentContext; completedChallenges: CompletedChallenge[]; + theme: LocalStorageThemes; }; const mapStateToProps = createSelector( @@ -85,21 +85,23 @@ const mapStateToProps = createSelector( donationFormStateSelector, userSelector, completedChallengesSelector, + themeSelector, ( showLoading: DonateFormProps['showLoading'], isSignedIn: DonateFormProps['isSignedIn'], isDonating: DonateFormProps['isDonating'], donationFormState: DonateFormState, - { email, theme }: { email: string; theme: Themes }, - completedChallenges: CompletedChallenge[] + { email }: { email: string }, + completedChallenges: CompletedChallenge[], + theme: LocalStorageThemes ) => ({ isSignedIn, isDonating, showLoading, donationFormState, email, - theme, - completedChallenges + completedChallenges, + theme }) ); diff --git a/client/src/components/Donation/donation-modal-body.tsx b/client/src/components/Donation/donation-modal-body.tsx index 3416be24fb7aa3..6537a3a1b85d7c 100644 --- a/client/src/components/Donation/donation-modal-body.tsx +++ b/client/src/components/Donation/donation-modal-body.tsx @@ -1,9 +1,11 @@ -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useState, useRef } from 'react'; import { useTranslation } from 'react-i18next'; +import { useFeature } from '@growthbook/growthbook-react'; import { Col, Row, Modal, Spacer } from '@freecodecamp/ui'; import { closeDonationModal } from '../../redux/actions'; import { PaymentContext } from '../../../../shared/config/donation-settings'; // import donationAnimation from '../../assets/images/donation-bear-animation.svg'; +import donationAnimationB from '../../assets/images/new-bear-animation.svg'; import supporterBear from '../../assets/images/supporter-bear.svg'; import callGA from '../../analytics/call-ga'; import MultiTierDonationForm from './multi-tier-donation-form'; @@ -127,6 +129,9 @@ const AnimationContainer = ({ }: { secondsRemaining: number; }) => { + const animationKey = useRef(Date.now()).current; + const newBearAnimation = useFeature('new-bear-animation').on; + const animationSrc = `${newBearAnimation ? donationAnimationB : donationAnimation}?t=${animationKey}`; const { t } = useTranslation(); return ( <> @@ -136,26 +141,44 @@ const AnimationContainer = ({ {t('donate.animation-countdown', { secondsRemaining })}
-
`; diff --git a/client/src/components/profile/components/bio.tsx b/client/src/components/profile/components/bio.tsx index 0cb330b87ff98f..9c142695fade79 100644 --- a/client/src/components/profile/components/bio.tsx +++ b/client/src/components/profile/components/bio.tsx @@ -34,51 +34,53 @@ const Bio = ({ return ( -
- +
+
+ +
+
+

@{username}

+ {isSessionUser && ( + + )} +
+ {name &&

{name}

} + + {about &&

{about}

} +
+ {joinDate && ( +
+ + {parseDate(joinDate, t)} +
+ )} + {location && ( +
+ + {t('profile.from', { location })} +
+ )} +
+ -
-
-

@{username}

- {isSessionUser && ( - - )} -
- {name &&

{name}

} - - {about &&

{about}

} -
- {joinDate && ( -
- - {parseDate(joinDate, t)} -
- )} - {location && ( -
- - {t('profile.from', { location })} -
- )} -
- -
+ ); }; diff --git a/client/src/components/profile/components/camper.css b/client/src/components/profile/components/camper.css index a17f00ab4537d3..e66aa972c952c0 100644 --- a/client/src/components/profile/components/camper.css +++ b/client/src/components/profile/components/camper.css @@ -7,6 +7,8 @@ .avatar-camper { display: flex; + position: absolute; + top: -160px; } .header { @@ -36,7 +38,6 @@ .profile-meta-container { display: flex; flex-direction: row; - margin-bottom: 2rem; color: var(--quaternary-color); } @@ -44,13 +45,19 @@ display: flex; justify-content: space-between; align-items: baseline; - margin-top: 1em; + margin-top: 2em; } .profile-edit-container h1 { margin: 0; } +.profile-edit-container button { + position: absolute; + right: 18px; + top: 18px; +} + .profile-meta-container div { margin-inline-end: 12px; } @@ -59,6 +66,10 @@ margin-inline-end: 4px; } +.social-icons-row { + margin-top: 1em; +} + .social-icons-row a { display: inline-block; margin-inline-end: 12px; diff --git a/client/src/components/profile/components/camper.tsx b/client/src/components/profile/components/camper.tsx index cf09ef7fca7d95..54b637a8fc6dec 100644 --- a/client/src/components/profile/components/camper.tsx +++ b/client/src/components/profile/components/camper.tsx @@ -66,36 +66,37 @@ function Camper({
{(isDonating || isTopContributor) && ( -

{t('profile.badges')}

-
- {isDonating && ( -
-
- +
+

{t('profile.badges')}

+
+ {isDonating && ( +
+
+ +
+
+

{t('profile.supporter')}

+

{t('profile.donated')}

+
-
-

{t('profile.supporter')}

-

{t('profile.donated')}

+ )} + {isTopContributor && ( +
+
+ +
+
+

{t('profile.contributor')}

+

+ {t('profile.contributor-prolific', { + year: yearsTopContributor.join(', ') + })} +

+
-
- )} - {isTopContributor && ( -
-
- -
-
-

{t('profile.contributor')}

-

- {t('profile.contributor-prolific', { - year: yearsTopContributor.join(', ') - })} -

-
-
- )} -
-
+ )} +
+ )} diff --git a/client/src/components/profile/components/certifications.tsx b/client/src/components/profile/components/certifications.tsx index 9b39d86e17aa27..b0284098e286cb 100644 --- a/client/src/components/profile/components/certifications.tsx +++ b/client/src/components/profile/components/certifications.tsx @@ -54,7 +54,7 @@ function CertButton({ username, cert }: CertButtonProps): JSX.Element { href={`/certification/${username}/${cert.certSlug}`} > {t('buttons.view-cert-title', { - certTitle: t(`certification.title.${cert.certSlug}`) + certTitle: t(`certification.title.${cert.certSlug}-cert`) })} @@ -72,45 +72,50 @@ function Certificates({ const { t } = useTranslation(); return ( -

{t('profile.fcc-certs')}

-
- {hasModernCert && currentCerts ? ( -
    - {currentCerts - .filter(({ show }) => show) - .map(cert => ( - - ))} -
- ) : ( -

{t('profile.no-certs')}

- )} - {hasLegacyCert && ( -
- -

- {t('settings.headings.legacy-certs')} -

- - {legacyCerts && ( - <> -
    - {legacyCerts - .filter(({ show }) => show) - .map(cert => ( - - ))} -
- - - )} -
- )} -
+
+

{t('profile.fcc-certs')}

+
+ {hasModernCert && currentCerts ? ( +
    + {currentCerts + .filter(({ show }) => show) + .map(cert => ( + + ))} +
+ ) : ( +

{t('profile.no-certs')}

+ )} + {hasLegacyCert && ( +
+ +

+ {t('settings.headings.legacy-certs')} +

+ + {legacyCerts && ( + <> +
    + {legacyCerts + .filter(({ show }) => show) + .map(cert => ( + + ))} +
+ + + )} +
+ )} +
); } diff --git a/client/src/components/profile/components/heat-map.tsx b/client/src/components/profile/components/heat-map.tsx index 47a79557a3f69f..608ddb9890600b 100644 --- a/client/src/components/profile/components/heat-map.tsx +++ b/client/src/components/profile/components/heat-map.tsx @@ -97,72 +97,74 @@ class HeatMapInner extends Component { return ( - - - { - // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access - if (!value || value.count < 1) return 'color-empty'; - // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access - if (value.count < 4) return 'color-scale-1'; - // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access - if (value.count < 8) return 'color-scale-2'; - // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access - if (value.count >= 8) return 'color-scale-a-lot'; - return 'color-empty'; - }} - endDate={endOfCalendar} - startDate={startOfCalendar} - tooltipDataAttrs={(value: { count: number; date: Date }) => { - const dateFormatted: string = - value && value.date - ? value.date.toLocaleDateString([localeCode, 'en-US'], { - year: 'numeric', - month: 'short', - day: 'numeric' - }) - : ''; - return { - 'data-tip': - value && value.count > -1 - ? t('profile.points', { - count: value.count, - date: dateFormatted - }) - : '' - }; - }} - values={dataToDisplay} - /> - - - - {title} - - - -
+ values={dataToDisplay} + /> + + + + {title} + + + + ); } diff --git a/client/src/components/profile/components/portfolio-projects.css b/client/src/components/profile/components/portfolio-projects.css index 80e3ae66cd6713..61137269845934 100644 --- a/client/src/components/profile/components/portfolio-projects.css +++ b/client/src/components/profile/components/portfolio-projects.css @@ -2,7 +2,6 @@ .portfolio-card { display: flex; flex-direction: column; - margin-top: 2rem; width: 100%; height: auto; overflow: hidden; diff --git a/client/src/components/profile/components/portfolio-projects.tsx b/client/src/components/profile/components/portfolio-projects.tsx index df770d6d1a3c87..5e77f44fb54cb0 100644 --- a/client/src/components/profile/components/portfolio-projects.tsx +++ b/client/src/components/profile/components/portfolio-projects.tsx @@ -18,39 +18,47 @@ export const PortfolioProjects = ({ } return ( -

{t('profile.projects')}

- {portfolioProjects.map(({ title, url, image, description, id }) => ( - - {image && ( - { - currentTarget.src = - 'https://cdn.freecodecamp.org/platform/universal/fcc_meta_1920X1080-indigo.png'; - }} - /> - )} -
-
-

- {title} - , {t('aria.opens-new-window')} -

-

{description}

-
-
- - ))} - -
+
+

{t('profile.projects')}

+ + {portfolioProjects.map( + ({ title, url, image, description, id }, index) => ( + + + {image && ( + { + currentTarget.src = + 'https://cdn.freecodecamp.org/platform/universal/fcc_meta_1920X1080-indigo.png'; + }} + /> + )} +
+
+

+ {title} + + , {t('aria.opens-new-window')} + +

+

{description}

+
+
+ + {index < portfolioProjects.length - 1 &&
} + + ) + )} + +
); }; diff --git a/client/src/components/profile/components/portfolio.tsx b/client/src/components/profile/components/portfolio.tsx index 987277134c2e30..7d45bae306b12a 100644 --- a/client/src/components/profile/components/portfolio.tsx +++ b/client/src/components/profile/components/portfolio.tsx @@ -33,6 +33,7 @@ type PortfolioProps = { type PortfolioState = { portfolio: PortfolioProjectData[]; unsavedItemId: string | null; + isImageValid: ProfileValidation; }; interface ProfileValidation { @@ -55,15 +56,20 @@ function createFindById(id: string) { } class PortfolioSettings extends Component { + validationImage: HTMLImageElement; static displayName: string; constructor(props: PortfolioProps) { super(props); - + this.validationImage = new Image(); const { portfolio = [] } = props; this.state = { portfolio: [...portfolio], - unsavedItemId: null + unsavedItemId: null, + isImageValid: { + state: 'success', + message: '' + } }; } @@ -76,7 +82,7 @@ class PortfolioSettings extends Component { (e: React.ChangeEvent) => { e.preventDefault(); const userInput = e.target.value.slice(); - return this.setState(state => { + this.setState(state => { const { portfolio: currentPortfolio } = state; const mutablePortfolio = currentPortfolio.slice(0); const index = findIndex(currentPortfolio, p => p.id === id); @@ -86,6 +92,14 @@ class PortfolioSettings extends Component { [key]: userInput }; + if (key === 'image' && userInput) { + void this.validateImageLoad(userInput).then(imageValidation => { + this.setState({ isImageValid: imageValidation }); + }); + } else if (key === 'image' && !userInput) { + this.setState({ isImageValid: { state: 'success', message: '' } }); + } + return { portfolio: mutablePortfolio }; }); }; @@ -168,29 +182,45 @@ class PortfolioSettings extends Component { return { state: 'success', message: '' }; } - getUrlValidation(maybeUrl: string, isImage?: boolean) { - const { t } = this.props; - const len = maybeUrl.length; - if (len >= 4 && !hasProtocolRE.test(maybeUrl)) { - return { - state: 'error', - message: t('validation.invalid-protocol') + async validateImageLoad(image: string): Promise { + return new Promise(resolve => { + this.validationImage.src = encodeURI(image); + + this.validationImage.onload = () => { + resolve({ + state: 'success', + message: '' + }); }; + + this.validationImage.onerror = () => { + resolve({ + state: 'error', + message: this.props.t('validation.url-not-image') + }); + }; + }); + } + + getUrlValidation(url: string) { + const { t } = this.props; + const len = url.length; + + if (!url) { + return { state: 'success', message: '' }; } - if (isImage && !maybeUrl) { - return { state: null, message: '' }; - } - if (isImage && !/\.(png|jpg|jpeg|gif)$/.test(maybeUrl)) { + + if (len >= 4 && !hasProtocolRE.test(url)) { return { state: 'error', - message: t('validation.url-not-image') + message: t('validation.invalid-protocol') }; } - return isURL(maybeUrl) + + return isURL(url) ? { state: 'success', message: '' } : { state: 'warning', message: t('validation.use-valid-url') }; } - formCorrect(portfolio: PortfolioProjectData) { const { id, title, description, url, image } = portfolio; @@ -199,10 +229,9 @@ class PortfolioSettings extends Component { const { state: urlState, message: urlMessage } = this.getUrlValidation(url); const { state: descriptionState, message: descriptionMessage } = this.getDescriptionValidation(description); - const { state: imageState, message: imageMessage } = this.getUrlValidation( - image, - true - ); + const { state: imageState, message: imageMessage } = + this.getUrlValidation(image); + const pristine = this.isFormPristine(id); const urlIsValid = !isURL(url, { @@ -263,6 +292,13 @@ class PortfolioSettings extends Component { this.toggleEditing(); return this.updateItem(id); }; + + const combineImageStatus = + imageState === 'success' && this.state.isImageValid.state === 'success' + ? null + : 'error'; + const combineImageMessage = imageMessage || this.state.isImageValid.message; + return (
{ {t('settings.labels.image')} @@ -328,9 +364,9 @@ class PortfolioSettings extends Component { name='portfolio-image' id={`${id}-image-input`} /> - {imageMessage ? ( + {combineImageMessage ? ( - {imageMessage} + {combineImageMessage} ) : null} @@ -387,6 +423,7 @@ class PortfolioSettings extends Component { render() { const { t } = this.props; const { portfolio = [], unsavedItemId } = this.state; + return (
{t('settings.headings.portfolio')} diff --git a/client/src/components/profile/components/stats.tsx b/client/src/components/profile/components/stats.tsx index 05a46366319452..8a9cca951fcc8b 100644 --- a/client/src/components/profile/components/stats.tsx +++ b/client/src/components/profile/components/stats.tsx @@ -113,29 +113,30 @@ function Stats({ points, calendar }: StatsProps): JSX.Element { return ( -

{t('profile.stats')}

- -
-
-
- {t('profile.current-streak')} -
-
{currentStreak || 0}
-
-
-
- {t('profile.total-points')} -
-
{points}
-
-
-
- {t('profile.longest-streak')} -
-
{longestStreak || 0}
-
-
-
+
+

{t('profile.stats')}

+ +
+
+
+ {t('profile.current-streak')} +
+
{currentStreak || 0}
+
+
+
+ {t('profile.total-points')} +
+
{points}
+
+
+
+ {t('profile.longest-streak')} +
+
{longestStreak || 0}
+
+
+
); } diff --git a/client/src/components/profile/components/time-line.tsx b/client/src/components/profile/components/time-line.tsx index 0bb5c9c1519a1b..4a22a212a44a76 100644 --- a/client/src/components/profile/components/time-line.tsx +++ b/client/src/components/profile/components/time-line.tsx @@ -176,64 +176,66 @@ function TimelineInner({ return ( -

{t('profile.timeline')}

- - {completedMap.length === 0 ? ( -

- {t('profile.none-completed')}  - {t('profile.get-started')} -

- ) : ( - - - - - - - - - - {sortedTimeline.slice(startIndex, endIndex).map(renderCompletion)} - -
{t('profile.challenge')}{t('settings.labels.solution')}{t('profile.completed')}
- )} - {id && ( - - - {`${username}'s Solution to ${ - idToNameMap.get(id)?.challengeTitle ?? '' - }`} - - - - - - - - - )} - {totalPages > 1 && ( - +

{t('profile.timeline')}

+ + {completedMap.length === 0 ? ( +

+ {t('profile.none-completed')}  + {t('profile.get-started')} +

+ ) : ( + + + + + + + + + + {sortedTimeline.slice(startIndex, endIndex).map(renderCompletion)} + +
{t('profile.challenge')}{t('settings.labels.solution')}{t('profile.completed')}
+ )} + {id && ( + + + {`${username}'s Solution to ${ + idToNameMap.get(id)?.challengeTitle ?? '' + }`} + + + + + + + + + )} + {totalPages > 1 && ( + + )} + - )} - - + +
); } @@ -265,7 +267,7 @@ function useIdToNameMap(t: TFunction): Map { const idToNameMap = new Map(); for (const id of getCertIds()) { const certPath = getPathFromID(id); - const certName = t(`certification.title.${certPath}`); + const certName = t(`certification.title.${certPath}-cert`); idToNameMap.set(id, { challengeTitle: certName, certPath: certPath diff --git a/client/src/components/profile/profile.css b/client/src/components/profile/profile.css index 62b3b15bce0fae..afcc72457fbed2 100644 --- a/client/src/components/profile/profile.css +++ b/client/src/components/profile/profile.css @@ -3,3 +3,16 @@ height: fit-content; padding: 0 !important; } + +.card { + margin: 0; + padding: 1em; + box-shadow: none; + background: var(--primary-background); + border: 1px solid var(--quaternary-background); + margin-bottom: 1em; +} + +.card-header { + position: relative; +} diff --git a/client/src/components/profile/profile.test.tsx b/client/src/components/profile/profile.test.tsx index 8dfee898c8a9ed..bf4b8c0ca99656 100644 --- a/client/src/components/profile/profile.test.tsx +++ b/client/src/components/profile/profile.test.tsx @@ -2,7 +2,7 @@ import { render, screen } from '@testing-library/react'; import React from 'react'; import { Provider } from 'react-redux'; import { createStore } from 'redux'; -import { Themes } from '../settings/theme'; +import { UserThemes } from '../../redux/types'; import Profile from './profile'; jest.mock('../../analytics'); @@ -46,7 +46,7 @@ const userProps = { sendQuincyEmail: true, sound: true, keyboardShortcuts: false, - theme: Themes.Default, + theme: UserThemes.Default, twitter: 'string', username: 'string', website: 'string', diff --git a/client/src/components/search/searchBar/no-hits-suggestion.tsx b/client/src/components/search/searchBar/no-hits-suggestion.tsx index 31e3d121c3e088..083759656367a2 100644 --- a/client/src/components/search/searchBar/no-hits-suggestion.tsx +++ b/client/src/components/search/searchBar/no-hits-suggestion.tsx @@ -1,16 +1,16 @@ import React from 'react'; interface NoHitsSuggestionProps { - handleMouseEnter: (e: React.ChangeEvent) => void; - handleMouseLeave: (e: React.ChangeEvent) => void; title: string; } const NoHitsSuggestion = ({ title }: NoHitsSuggestionProps): JSX.Element => { return ( -
- {title} -
+
  • +
    + {title} +
    +
    • ); }; diff --git a/client/src/components/search/searchBar/search-bar-footer.tsx b/client/src/components/search/searchBar/search-bar-footer.tsx new file mode 100644 index 00000000000000..25e34f21536e1e --- /dev/null +++ b/client/src/components/search/searchBar/search-bar-footer.tsx @@ -0,0 +1,50 @@ +import React from 'react'; +import { useTranslation } from 'react-i18next'; +import { searchPageUrl } from '../../../utils/algolia-locale-setup'; +import NoHitsSuggestion from './no-hits-suggestion'; + +interface SearchBarFooterProps { + hasHits: boolean; + query?: string; + selectedIndex: number; + onMouseEnter: (e: React.SyntheticEvent) => void; + onMouseLeave: (e: React.SyntheticEvent) => void; +} + +const SearchBarFooter = ({ + hasHits, + query, + selectedIndex, + onMouseEnter, + onMouseLeave +}: SearchBarFooterProps) => { + const { t } = useTranslation(); + const title = t('search.no-tutorials'); + + if (!query) { + return null; + } + + return hasHits ? ( +
  • + + + {t('search.see-results', { searchQuery: query })} + + +
    • + ) : ( + + ); +}; + +export default SearchBarFooter; diff --git a/client/src/components/search/searchBar/search-bar.tsx b/client/src/components/search/searchBar/search-bar.tsx index 47fc09b5118bf9..7d92f9801b1e7d 100644 --- a/client/src/components/search/searchBar/search-bar.tsx +++ b/client/src/components/search/searchBar/search-bar.tsx @@ -185,13 +185,13 @@ export class SearchBar extends Component { indexUp: (e: KeyboardEvent | undefined): void => { e?.preventDefault(); this.setState(({ index, hits }) => ({ - index: index === -1 ? hits.length - 1 : index - 1 + index: index === -1 ? hits.length : index - 1 })); }, indexDown: (e: KeyboardEvent | undefined): void => { e?.preventDefault(); this.setState(({ index, hits }) => ({ - index: index === hits.length - 1 ? -1 : index + 1 + index: index === hits.length ? -1 : index + 1 })); } }; diff --git a/client/src/components/search/searchBar/search-hits.tsx b/client/src/components/search/searchBar/search-hits.tsx index 58ed02c73b915a..f0c763fd039112 100644 --- a/client/src/components/search/searchBar/search-hits.tsx +++ b/client/src/components/search/searchBar/search-hits.tsx @@ -2,12 +2,9 @@ import { isEmpty } from 'lodash-es'; import React, { useEffect } from 'react'; import { useTranslation } from 'react-i18next'; import { useHits } from 'react-instantsearch'; -import { searchPageUrl } from '../../../utils/algolia-locale-setup'; import Suggestion from './search-suggestion'; -import NoHitsSuggestion from './no-hits-suggestion'; import type { Hit } from './types'; - -const searchUrl = searchPageUrl; +import SearchBarFooter from './search-bar-footer'; interface SearchHitsProps { handleMouseEnter: (e: React.SyntheticEvent) => void; @@ -23,29 +20,11 @@ function SearchHits({ selectedIndex }: SearchHitsProps) { const { results } = useHits(); - const query = results ? results.query : ''; const { t } = useTranslation(); - const noHits = isEmpty(results?.hits); - const noHitsTitle = t('search.no-tutorials'); - const footer = [ - { - __position: 8, - objectID: `footer-${query}`, - query: query, - url: noHits ? '' : `${searchUrl}?query=${encodeURIComponent(query)}`, - _highlightResult: { - query: { - value: `${t('search.see-results', { searchQuery: query })}`, - matchLevel: 'none' as const, - matchedWords: [] - } - } - } - ]; const allHits: Hit[] = - results?.hits && results?.query ? [...results.hits, ...footer] : []; + results?.hits && results?.query ? [...results.hits] : []; useEffect(() => { handleHits(allHits); @@ -64,21 +43,22 @@ function SearchHits({ data-fccobjectid={hit.objectID} key={hit.objectID} > - {noHits ? ( - - ) : ( + {!noHits && ( )} ))} +
    ); diff --git a/client/src/components/search/searchBar/search-suggestion.tsx b/client/src/components/search/searchBar/search-suggestion.tsx index 741c4bd6e689fe..12813165a86a9e 100644 --- a/client/src/components/search/searchBar/search-suggestion.tsx +++ b/client/src/components/search/searchBar/search-suggestion.tsx @@ -13,14 +13,9 @@ const Suggestion = ({ handleMouseEnter, handleMouseLeave }: SuggestionProps): JSX.Element => { - const dropdownFooter = hit.objectID.includes('footer-'); return ( - {dropdownFooter ? ( - - ) : ( - - )} + ); diff --git a/client/src/components/search/searchBar/searchbar.css b/client/src/components/search/searchBar/searchbar.css index 883d60f49e8e6a..64967d986229ae 100644 --- a/client/src/components/search/searchBar/searchbar.css +++ b/client/src/components/search/searchBar/searchbar.css @@ -135,7 +135,7 @@ background-color: var(--gray-75); } -.ais-Hits-item:hover { +.ais-Hits-item:not(:has(.no-hits-footer.fcc_suggestion_item)):hover { background-color: var(--blue-dark); } diff --git a/client/src/components/settings/certification.tsx b/client/src/components/settings/certification.tsx index 2bd282baf6f752..ce10b65c76b28c 100644 --- a/client/src/components/settings/certification.tsx +++ b/client/src/components/settings/certification.tsx @@ -2,7 +2,6 @@ import { find } from 'lodash-es'; import React, { MouseEvent, useState } from 'react'; import { withTranslation } from 'react-i18next'; import type { TFunction } from 'i18next'; -import { createSelector } from 'reselect'; import ScrollableAnchor, { configureAnchors } from 'react-scrollable-anchor'; import { connect } from 'react-redux'; import { Table, Button, Spacer } from '@freecodecamp/ui'; @@ -11,20 +10,17 @@ import { regeneratePathAndHistory } from '../../../../shared/utils/polyvinyl'; import ProjectPreviewModal from '../../templates/Challenges/components/project-preview-modal'; import ExamResultsModal from '../SolutionViewer/exam-results-modal'; import { openModal } from '../../templates/Challenges/redux/actions'; -import { - currentCertTitles, - legacyCertTitles, - upcomingCertTitles, - certsToProjects, - type CertTitle -} from '../../../config/cert-and-project-map'; +import { certsToProjects } from '../../../config/cert-and-project-map'; import { FlashMessages } from '../Flash/redux/flash-messages'; import ProjectModal from '../SolutionViewer/project-modal'; import { FullWidthRow, Link } from '../helpers'; import { SolutionDisplayWidget } from '../solution-display-widget'; import { Certification, - certSlugTypeMap + certSlugTypeMap, + currentCertifications, + legacyCertifications, + upcomingCertifications } from '../../../../shared/config/certification-settings'; import env from '../../../config/env.json'; @@ -48,39 +44,18 @@ const mapDispatchToProps = { openModal }; -const isCertSelector = ({ +const createCertifiedMap = ({ is2018DataVisCert, isApisMicroservicesCert, isJsAlgoDataStructCert, - isBackEndCert, - isDataVisCert, - isFrontEndCert, isInfosecQaCert, isQaCertV7, isInfosecCertV7, isFrontEndLibsCert, - isFullStackCert, isRespWebDesignCert, - isSciCompPyCertV7, - isDataAnalysisPyCertV7, - isMachineLearningPyCertV7, - isRelationalDatabaseCertV8, - isCollegeAlgebraPyCertV8, - isFoundationalCSharpCertV8, - isJsAlgoDataStructCertV8 -}: ClaimedCertifications) => ({ - is2018DataVisCert, - isApisMicroservicesCert, - isJsAlgoDataStructCert, - isBackEndCert, isDataVisCert, isFrontEndCert, - isInfosecQaCert, - isQaCertV7, - isInfosecCertV7, - isFrontEndLibsCert, - isFullStackCert, - isRespWebDesignCert, + isBackEndCert, isSciCompPyCertV7, isDataAnalysisPyCertV7, isMachineLearningPyCertV7, @@ -88,56 +63,36 @@ const isCertSelector = ({ isCollegeAlgebraPyCertV8, isFoundationalCSharpCertV8, isJsAlgoDataStructCertV8 +}: ClaimedCertifications): Record< + Exclude, + boolean +> => ({ + [Certification.RespWebDesign]: isRespWebDesignCert, + [Certification.JsAlgoDataStruct]: isJsAlgoDataStructCert, + [Certification.FrontEndDevLibs]: isFrontEndLibsCert, + [Certification.DataVis]: is2018DataVisCert, + [Certification.BackEndDevApis]: isApisMicroservicesCert, + [Certification.QualityAssurance]: isQaCertV7, + [Certification.InfoSec]: isInfosecCertV7, + [Certification.SciCompPy]: isSciCompPyCertV7, + [Certification.DataAnalysisPy]: isDataAnalysisPyCertV7, + [Certification.MachineLearningPy]: isMachineLearningPyCertV7, + [Certification.RelationalDb]: isRelationalDatabaseCertV8, + [Certification.CollegeAlgebraPy]: isCollegeAlgebraPyCertV8, + [Certification.FoundationalCSharp]: isFoundationalCSharpCertV8, + [Certification.LegacyFrontEnd]: isFrontEndCert, + [Certification.LegacyDataVis]: isDataVisCert, + [Certification.LegacyBackEnd]: isBackEndCert, + [Certification.LegacyInfoSecQa]: isInfosecQaCert, + // LegacyFullStack cannot be handled by this because there are no projects to + // be rendered. The new FullStackDeveloper certification is a normal + // certification with projects. + [Certification.FullStackDeveloper]: false, + [Certification.A2English]: false, + [Certification.B1English]: false, + [Certification.JsAlgoDataStructNew]: isJsAlgoDataStructCertV8 }); -const isCertMapSelector = createSelector( - isCertSelector, - ({ - is2018DataVisCert, - isApisMicroservicesCert, - isJsAlgoDataStructCert, - isInfosecQaCert, - isQaCertV7, - isInfosecCertV7, - isFrontEndLibsCert, - isRespWebDesignCert, - isDataVisCert, - isFrontEndCert, - isBackEndCert, - isSciCompPyCertV7, - isDataAnalysisPyCertV7, - isMachineLearningPyCertV7, - isRelationalDatabaseCertV8, - isCollegeAlgebraPyCertV8, - isFoundationalCSharpCertV8, - isJsAlgoDataStructCertV8 - }) => ({ - 'Responsive Web Design': isRespWebDesignCert, - 'Legacy JavaScript Algorithms and Data Structures': isJsAlgoDataStructCert, - 'Front End Development Libraries': isFrontEndLibsCert, - 'Data Visualization': is2018DataVisCert, - 'Back End Development and APIs': isApisMicroservicesCert, - 'Quality Assurance': isQaCertV7, - 'Information Security': isInfosecCertV7, - 'Scientific Computing with Python': isSciCompPyCertV7, - 'Data Analysis with Python': isDataAnalysisPyCertV7, - 'Machine Learning with Python': isMachineLearningPyCertV7, - 'Relational Database': isRelationalDatabaseCertV8, - 'College Algebra with Python': isCollegeAlgebraPyCertV8, - 'Foundational C# with Microsoft': isFoundationalCSharpCertV8, - 'Legacy Front End': isFrontEndCert, - 'Legacy Data Visualization': isDataVisCert, - 'Legacy Back End': isBackEndCert, - 'Legacy Information Security and Quality Assurance': isInfosecQaCert, - // Certification. - 'Certified Full Stack Developer': false, - 'Upcoming Python Certification': false, - 'A2 English for Developers': false, - 'B1 English for Developers': false, - 'JavaScript Algorithms and Data Structures (Beta)': isJsAlgoDataStructCertV8 - }) -); - const honestyInfoMessage = { type: 'info', message: FlashMessages.HonestFirst @@ -192,27 +147,21 @@ const LegacyFullStack = (props: CertificationSettingsProps) => {

    - {t('certification.title.Legacy Full Stack Certification')} + {t(`certification.title.${Certification.LegacyFullStack}-cert`)}

    {t('settings.claim-legacy', { - cert: t('certification.title.Legacy Full Stack Certification') + cert: t(`certification.title.${Certification.LegacyFullStack}-cert`) })}

      -
    • {t('certification.title.Responsive Web Design')}
      • -
    • - {t('certification.title.JavaScript Algorithms and Data Structures')} -
      • -
    • {t('certification.title.Front End Development Libraries')}
      • -
    • {t('certification.title.Data Visualization')}
      • -
    • {t('certification.title.Back End Development and APIs')}
      • -
    • - {t( - 'certification.title.Legacy Information Security and Quality Assurance' - )} -
      • +
    • {t(`certification.title.${Certification.RespWebDesign}`)}
      • +
    • {t(`certification.title.${Certification.JsAlgoDataStruct}`)}
      • +
    • {t(`certification.title.${Certification.LegacyFrontEnd}`)}
      • +
    • {t(`certification.title.${Certification.LegacyDataVis}`)}
      • +
    • {t(`certification.title.${Certification.LegacyBackEnd}`)}
      • +
    • {t(`certification.title.${Certification.LegacyInfoSecQa}`)}
    @@ -228,7 +177,7 @@ const LegacyFullStack = (props: CertificationSettingsProps) => { > {t('buttons.show-cert')}{' '} - {t('certification.title.Legacy Full Stack')} + {t(`certification.title.${Certification.LegacyFullStack}`)} ) : ( @@ -242,7 +191,7 @@ const LegacyFullStack = (props: CertificationSettingsProps) => { > {t('buttons.claim-cert')}{' '} - {t('certification.title.Legacy Full Stack')} + {t(`certification.title.${Certification.LegacyFullStack}`)} )} @@ -273,8 +222,7 @@ function CertificationSettings(props: CertificationSettingsProps) { const handleSolutionModalHide = () => initialiseState(); - const getUserIsCertMap = () => isCertMapSelector(props); - + const isCertifiedMap = createCertifiedMap(props); const getProjectSolution = (projectId: string, projectTitle: string) => { const { completedChallenges, openModal } = props; const completedProject = find( @@ -327,20 +275,19 @@ function CertificationSettings(props: CertificationSettingsProps) { }; const Certification = ({ - certName, + certSlug, t }: { - certName: Exclude; + certSlug: Exclude; t: TFunction; }) => { - const { certSlug } = certsToProjects[certName][0]; return (

    - {t(`certification.title.${certName}`, certName)} + {t(`certification.title.${certSlug}`, certSlug)}

    @@ -351,8 +298,8 @@ function CertificationSettings(props: CertificationSettingsProps) {
    @@ -363,14 +310,13 @@ function CertificationSettings(props: CertificationSettingsProps) { }; function ProjectsFor({ - certName, + certSlug, isCert }: { - certName: Exclude; + certSlug: Exclude; isCert: boolean; }) { const { username, isHonest, createFlashMessage, t, verifyCert } = props; - const { certSlug } = certsToProjects[certName][0]; const certLocation = `/certification/${username}/${certSlug}`; const handleClaim = (e: MouseEvent) => { @@ -383,7 +329,7 @@ function CertificationSettings(props: CertificationSettingsProps) { return ( <> - {certsToProjects[certName].map(({ link, title, id }) => ( + {certsToProjects[certSlug].map(({ link, title, id }) => ( @@ -400,12 +346,16 @@ function CertificationSettings(props: CertificationSettingsProps) { {isCert ? ( ) : ( )} @@ -419,18 +369,18 @@ function CertificationSettings(props: CertificationSettingsProps) { return (
    {t('settings.headings.certs')} - {currentCertTitles.map(title => ( - + {currentCertifications.map(cert => ( + ))} {t('settings.headings.legacy-certs')} - {legacyCertTitles.map(title => ( - + {legacyCertifications.map(cert => ( + ))} {showUpcomingChanges && - upcomingCertTitles.map(title => ( - + upcomingCertifications.map(cert => ( + ))} void; - toggleNightMode: () => void; toggleSoundMode: (sound: boolean) => void; + resetEditorLayout: () => void; }; const MiscSettings = ({ - currentTheme, keyboardShortcuts, sound, + editorLayout, + resetEditorLayout, toggleKeyboardShortcuts, - toggleNightMode, toggleSoundMode }: MiscSettingsProps) => { const { t } = useTranslation(); @@ -30,10 +30,6 @@ const MiscSettings = ({ <> - + + + ); diff --git a/client/src/components/settings/theme.tsx b/client/src/components/settings/theme.tsx deleted file mode 100644 index 64c87a038cd24f..00000000000000 --- a/client/src/components/settings/theme.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import React from 'react'; -import { useTranslation } from 'react-i18next'; -import type { updateMyTheme } from '../../redux/settings/actions'; - -import ToggleButtonSetting from './toggle-button-setting'; - -export enum Themes { - Night = 'night', - Default = 'default' -} - -export type ThemeProps = { - currentTheme: Themes; - toggleNightMode: typeof updateMyTheme; -}; - -export default function ThemeSettings({ - currentTheme, - toggleNightMode -}: ThemeProps): JSX.Element { - const { t } = useTranslation(); - - return ( - { - toggleNightMode( - currentTheme === Themes.Night ? Themes.Default : Themes.Night - ); - }} - /> - ); -} - -ThemeSettings.displayName = 'ThemeSettings'; diff --git a/client/src/components/settings/toggle-radio-setting.tsx b/client/src/components/settings/toggle-radio-setting.tsx index bf0db5866a3870..59002521eefe65 100644 --- a/client/src/components/settings/toggle-radio-setting.tsx +++ b/client/src/components/settings/toggle-radio-setting.tsx @@ -40,7 +40,7 @@ export default function ToggleRadioSetting({ {explain ?

    {explain}

    : null}
    -
    + + +
    - - - - - - - - ); - } +
    + + )} + + + + + + ) : ( + + + + + + + + {title} + + + + {qualifiedForExam ? ( + +

    {t('learn.exam.qualified')}

    +     + ) : ( + <> + {!prerequisitesComplete ? ( + + ) : ( + + )} + + )} + + + + + + + + +     +     +     +     + ); } ShowExam.displayName = 'ShowExam'; diff --git a/client/src/templates/Challenges/fill-in-the-blank/show.tsx b/client/src/templates/Challenges/fill-in-the-blank/show.tsx index 1c1b757f683d14..df9291a16a2fb5 100644 --- a/client/src/templates/Challenges/fill-in-the-blank/show.tsx +++ b/client/src/templates/Challenges/fill-in-the-blank/show.tsx @@ -1,10 +1,10 @@ // Package Utilities import { graphql } from 'gatsby'; -import React, { Component } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import Helmet from 'react-helmet'; import { ObserveKeys } from 'react-hotkeys'; import type { TFunction } from 'i18next'; -import { withTranslation } from 'react-i18next'; +import { useTranslation } from 'react-i18next'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import type { Dispatch } from 'redux'; @@ -30,6 +30,8 @@ import { initTests } from '../redux/actions'; import Scene from '../components/scene/scene'; +import { SceneSubject } from '../components/scene/scene-subject'; +import { getChallengePaths } from '../utils/challenge-paths'; import { isChallengeCompletedSelector } from '../redux/selectors'; import './show.css'; @@ -70,151 +72,89 @@ interface ShowFillInTheBlankProps { updateSolutionFormValues: () => void; } -interface ShowFillInTheBlankState { - showWrong: boolean; - userAnswers: (string | null)[]; - answersCorrect: (boolean | null)[]; - allBlanksFilled: boolean; - feedback: string | null; - showFeedback: boolean; - isScenePlaying: boolean; -} - -// Component -class ShowFillInTheBlank extends Component< - ShowFillInTheBlankProps, - ShowFillInTheBlankState -> { - static displayName: string; - private container: React.RefObject = React.createRef(); - - constructor(props: ShowFillInTheBlankProps) { - super(props); - - const { - data: { - challengeNode: { - challenge: { - fillInTheBlank: { blanks } - } - } +const ShowFillInTheBlank = ({ + data: { + challengeNode: { + challenge: { + title, + description, + instructions, + explanation, + superBlock, + block, + translationPending, + fields: { blockName, tests }, + challengeType, + fillInTheBlank, + helpCategory, + scene } - } = props; - - const emptyArray = blanks.map(() => null); - - this.state = { - showWrong: false, - userAnswers: emptyArray, - answersCorrect: emptyArray, - allBlanksFilled: false, - feedback: null, - showFeedback: false, - isScenePlaying: false - }; - - this.handleSubmit = this.handleSubmit.bind(this); - } - - componentDidMount(): void { - const { - challengeMounted, - data: { - challengeNode: { - challenge: { - fields: { tests }, - title, - challengeType, - helpCategory - } - } - }, - pageContext: { challengeMeta }, - initTests, - updateChallengeMeta - } = this.props; + } + }, + challengeMounted, + openHelpModal, + updateChallengeMeta, + openCompletionModal, + pageContext: { challengeMeta }, + isChallengeCompleted +}: ShowFillInTheBlankProps) => { + const { t } = useTranslation(); + const emptyArray = fillInTheBlank.blanks.map(() => null); + + const [showWrong, setShowWrong] = useState(false); + const [userAnswers, setUserAnswers] = useState<(null | string)[]>(emptyArray); + const [answersCorrect, setAnswersCorrect] = + useState<(null | boolean)[]>(emptyArray); + const [allBlanksFilled, setAllBlanksFilled] = useState(false); + const [feedback, setFeedback] = useState(null); + const [showFeedback, setShowFeedback] = useState(false); + + const container = useRef(null); + + useEffect(() => { + initTests(tests); + const challengePaths = getChallengePaths({ + currentCurriculumPaths: challengeMeta + }); updateChallengeMeta({ ...challengeMeta, title, challengeType, - helpCategory + helpCategory, + ...challengePaths }); - initTests(tests); challengeMounted(challengeMeta.id); - this.container.current?.focus(); - } + container.current?.focus(); + // This effect should be run once on mount + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); - componentDidUpdate(prevProps: ShowFillInTheBlankProps): void { - const { - data: { - challengeNode: { - challenge: { title: prevTitle } - } - } - } = prevProps; - const { - challengeMounted, - data: { - challengeNode: { - challenge: { title: currentTitle, challengeType, helpCategory } - } - }, - pageContext: { challengeMeta }, - updateChallengeMeta - } = this.props; - if (prevTitle !== currentTitle) { - updateChallengeMeta({ - ...challengeMeta, - title: currentTitle, - challengeType, - helpCategory - }); - challengeMounted(challengeMeta.id); - } - } - - handleSubmit() { - const { - openCompletionModal, - data: { - challengeNode: { - challenge: { - fillInTheBlank: { blanks } - } - } - } - } = this.props; - const { userAnswers } = this.state; - - const blankAnswers = blanks.map(b => b.answer); + const handleSubmit = () => { + const blankAnswers = fillInTheBlank.blanks.map(b => b.answer); const newAnswersCorrect = userAnswers.map( (userAnswer, i) => !!userAnswer && userAnswer.trim() === blankAnswers[i] ); - + setAnswersCorrect(newAnswersCorrect); const hasWrongAnswer = newAnswersCorrect.some(a => a === false); if (!hasWrongAnswer) { - this.setState({ - answersCorrect: newAnswersCorrect - }); - + setShowFeedback(false); + setFeedback(null); openCompletionModal(); } else { const firstWrongIndex = newAnswersCorrect.findIndex(a => a === false); const feedback = - firstWrongIndex >= 0 ? blanks[firstWrongIndex].feedback : null; + firstWrongIndex >= 0 + ? fillInTheBlank.blanks[firstWrongIndex].feedback + : null; - this.setState({ - answersCorrect: newAnswersCorrect, - showWrong: true, - showFeedback: true, - feedback: feedback - }); + setFeedback(feedback); + setShowWrong(true); + setShowFeedback(true); } - } + }; - handleInputChange = (e: React.ChangeEvent): void => { - const { userAnswers, answersCorrect } = this.state; + const handleInputChange = (e: React.ChangeEvent): void => { const inputIndex = parseInt(e.target.getAttribute('data-index') as string); const newUserAnswers = [...userAnswers]; @@ -225,145 +165,103 @@ class ShowFillInTheBlank extends Component< const allBlanksFilled = newUserAnswers.every(a => a); - this.setState({ - userAnswers: newUserAnswers, - answersCorrect: newAnswersCorrect, - allBlanksFilled, - showWrong: false - }); + setUserAnswers(newUserAnswers); + setAnswersCorrect(newAnswersCorrect); + setAllBlanksFilled(allBlanksFilled); + setShowWrong(false); }; - setIsScenePlaying = (shouldPlay: boolean) => { - this.setState({ - isScenePlaying: shouldPlay - }); + const handlePlayScene = () => { + sceneSubject.notify(); }; - render() { - const { - data: { - challengeNode: { - challenge: { - title, - description, - instructions, - explanation, - superBlock, - block, - translationPending, - fields: { blockName }, - fillInTheBlank, - scene - } - } - }, - openHelpModal, - pageContext: { - challengeMeta: { nextChallengePath, prevChallengePath } - }, - t, - isChallengeCompleted - } = this.props; - - const blockNameTitle = `${t( - `intro:${superBlock}.blocks.${block}.title` - )} - ${title}`; - - const { allBlanksFilled, feedback, showFeedback, showWrong } = this.state; - - return ( - this.handleSubmit()} - containerRef={this.container} - nextChallengePath={nextChallengePath} - prevChallengePath={prevChallengePath} - playScene={() => this.setIsScenePlaying(true)} - > - - - - + const blockNameTitle = `${t( + `intro:${superBlock}.blocks.${block}.title` + )} - ${title}`; + + const sceneSubject = new SceneSubject(); + + return ( + handleSubmit()} + containerRef={container} + playScene={handlePlayScene} + > + + + + + + + {title} + + + + - - {title} - + - - - - + {scene && } - {scene && ( - + + {instructions && ( + <> + + + )} - - {instructions && ( - <> - - - - )} - - {/* what we want to observe is ctrl/cmd + enter, but ObserveKeys is buggy and throws an error + {/* what we want to observe is ctrl/cmd + enter, but ObserveKeys is buggy and throws an error if it encounters a key combination, so we have to pass in the individual keys to observe */} - - - + + + - {explanation ? ( - - ) : ( - - )} + {explanation ? ( + + ) : ( + + )} - - - - - - - - - - - - - ); - } -} + + + + + + + + + + + + + ); +}; ShowFillInTheBlank.displayName = 'ShowFillInTheBlank'; -export default connect( - mapStateToProps, - mapDispatchToProps -)(withTranslation()(ShowFillInTheBlank)); +export default connect(mapStateToProps, mapDispatchToProps)(ShowFillInTheBlank); export const query = graphql` query FillInTheBlankChallenge($id: String!) { diff --git a/client/src/templates/Challenges/generic/show.tsx b/client/src/templates/Challenges/generic/show.tsx index cf2a664e21cd08..3640eff1151a93 100644 --- a/client/src/templates/Challenges/generic/show.tsx +++ b/client/src/templates/Challenges/generic/show.tsx @@ -24,10 +24,12 @@ import { } from '../redux/actions'; import { isChallengeCompletedSelector } from '../redux/selectors'; import { BlockTypes } from '../../../../../shared/config/blocks'; +import { getChallengePaths } from '../utils/challenge-paths'; import Scene from '../components/scene/scene'; import MultipleChoiceQuestions from '../components/multiple-choice-questions'; import ChallengeExplanation from '../components/challenge-explanation'; import HelpModal from '../components/help-modal'; +import { SceneSubject } from '../components/scene/scene-subject'; // Styles import './show.css'; @@ -96,7 +98,6 @@ const ShowGeneric = ({ isChallengeCompleted }: ShowQuizProps) => { const { t } = useTranslation(); - const { nextChallengePath, prevChallengePath } = challengeMeta; const container = useRef(null); const blockNameTitle = `${t( @@ -105,11 +106,15 @@ const ShowGeneric = ({ useEffect(() => { initTests(tests); + const challengePaths = getChallengePaths({ + currentCurriculumPaths: challengeMeta + }); updateChallengeMeta({ ...challengeMeta, title, challengeType, - helpCategory + helpCategory, + ...challengePaths }); challengeMounted(challengeMeta.id); container.current?.focus(); @@ -117,23 +122,6 @@ const ShowGeneric = ({ // eslint-disable-next-line react-hooks/exhaustive-deps }, []); - useEffect(() => { - updateChallengeMeta({ - ...challengeMeta, - title, - challengeType, - helpCategory - }); - challengeMounted(challengeMeta.id); - }, [ - title, - challengeMeta, - challengeType, - helpCategory, - challengeMounted, - updateChallengeMeta - ]); - // video const [videoIsLoaded, setVideoIsLoaded] = useState(false); @@ -141,9 +129,6 @@ const ShowGeneric = ({ setVideoIsLoaded(true); }; - // scene - const [isScenePlaying, setIsScenePlaying] = useState(false); - // assignments const [assignmentsCompleted, setAssignmentsCompleted] = useState(0); const allAssignmentsCompleted = assignmentsCompleted === assignments.length; @@ -162,6 +147,9 @@ const ShowGeneric = ({ const [submittedMcqAnswers, setSubmittedMcqAnswers] = useState( questions.map(() => null) ); + + const [hasAnsweredMcqCorrectly, sethasAnsweredMcqCorrectly] = useState(true); + const [showFeedback, setShowFeedback] = useState(false); const handleMcqOptionChange = ( @@ -175,7 +163,6 @@ const ShowGeneric = ({ ); }; - // submit const handleSubmit = () => { const hasCompletedAssignments = assignments.length === 0 || allAssignmentsCompleted; @@ -187,15 +174,21 @@ const ShowGeneric = ({ if (hasCompletedAssignments && mcqCorrect) { openCompletionModal(); } + + if (mcqSolutions.length > selectedMcqOptions.length || !mcqCorrect) { + sethasAnsweredMcqCorrectly(false); + } else { + sethasAnsweredMcqCorrectly(true); + } }; + const sceneSubject = new SceneSubject(); + return ( setIsScenePlaying(true) : undefined} + playScene={scene ? () => sceneSubject.notify() : undefined} > - + )} @@ -231,17 +227,14 @@ const ShowGeneric = ({ )} - {scene && ( - - )} + {scene && } {instructions && ( - + )} @@ -268,6 +261,10 @@ const ShowGeneric = ({ ) : null} + {!hasAnsweredMcqCorrectly && ( +

    {t('learn.answered-mcq')}

    + )} + - - -
    - - - - - - -     -     - ); - } + return ( + + + + + + + + + {title} + + + +
    + + + +
    + + + + +     +     +     +     + ); } -MsTrophy.displayName = 'MsTrophy'; - export default connect( mapStateToProps, mapDispatchToProps diff --git a/client/src/templates/Challenges/projects/backend/show.tsx b/client/src/templates/Challenges/projects/backend/show.tsx index 6e0b335b38e642..1b365e29cac4b0 100644 --- a/client/src/templates/Challenges/projects/backend/show.tsx +++ b/client/src/templates/Challenges/projects/backend/show.tsx @@ -1,9 +1,5 @@ -/* eslint-disable @typescript-eslint/no-unsafe-assignment */ -/* eslint-disable @typescript-eslint/no-unsafe-call */ -/* eslint-disable @typescript-eslint/no-unsafe-member-access */ - import { graphql } from 'gatsby'; -import React, { Component } from 'react'; +import React, { useEffect, useRef } from 'react'; import Helmet from 'react-helmet'; import { withTranslation } from 'react-i18next'; import type { TFunction } from 'i18next'; @@ -38,7 +34,9 @@ import { consoleOutputSelector, isChallengeCompletedSelector } from '../../redux/selectors'; + import { getGuideUrl } from '../../utils'; +import { getChallengePaths } from '../../utils/challenge-paths'; import SolutionForm from '../solution-form'; import ProjectToolPanel from '../tool-panel'; @@ -95,59 +93,18 @@ interface BackEndProps { updateSolutionFormValues: () => void; } -// Component -class BackEnd extends Component { - static displayName: string; - private container: React.RefObject = React.createRef(); - - constructor(props: BackEndProps) { - super(props); - this.state = {}; - this.updateDimensions = this.updateDimensions.bind(this); - this.handleSubmit = this.handleSubmit.bind(this); - } - - componentDidMount() { - this.initializeComponent(); - window.addEventListener('resize', () => this.updateDimensions()); - this.container.current?.focus(); - } - - updateDimensions() { - this.setState({ width: window.innerWidth, height: window.innerHeight }); - } +const ShowBackEnd = (props: BackEndProps) => { + const container = useRef(null); - componentWillUnmount() { - window.removeEventListener('resize', () => this.updateDimensions()); - } - - componentDidUpdate(prevProps: BackEndProps) { - const { - data: { - challengeNode: { - challenge: { - title: prevTitle, - fields: { tests: prevTests } - } - } - } - } = prevProps; - const { - data: { - challengeNode: { - challenge: { - title: currentTitle, - fields: { tests: currTests } - } - } - } - } = this.props; - if (prevTitle !== currentTitle || prevTests !== currTests) { - this.initializeComponent(); - } - } + const handleSubmit = ({ + showCompletionModal + }: { + showCompletionModal: boolean; + }) => { + props.executeChallenge({ showCompletionModal }); + }; - initializeComponent() { + useEffect(() => { const { challengeMounted, initConsole, @@ -164,122 +121,107 @@ class BackEnd extends Component { } }, pageContext: { challengeMeta } - } = this.props; + } = props; initConsole(); initTests(tests); + const challengePaths = getChallengePaths({ + currentCurriculumPaths: challengeMeta + }); updateChallengeMeta({ ...challengeMeta, title, challengeType, - helpCategory + helpCategory, + ...challengePaths }); challengeMounted(challengeMeta.id); - } - - handleSubmit({ - showCompletionModal - }: { - showCompletionModal: boolean; - }): void { - this.props.executeChallenge({ - showCompletionModal - }); - } - - render() { - const { - data: { - challengeNode: { - challenge: { - fields: { blockName }, - challengeType, - forumTopicId, - title, - description, - instructions, - translationPending, - superBlock, - block - } + container.current?.focus(); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + + const { + data: { + challengeNode: { + challenge: { + fields: { blockName }, + challengeType, + forumTopicId, + title, + description, + instructions, + translationPending, + superBlock, + block } - }, - isChallengeCompleted, - output, - pageContext: { - challengeMeta: { nextChallengePath, prevChallengePath } - }, - t, - tests, - updateSolutionFormValues - } = this.props; - - const blockNameTitle = `${t( - `intro:${superBlock}.blocks.${block}.title` - )} - ${title}`; - - return ( - - - - - - - - - {title} - - - - - -
    - + + + + + + + + {title} + + + + + +
    + - - - - - -     -     -     -     - ); - } -} - -BackEnd.displayName = 'BackEnd'; + output={output} + /> + + + + + + + + + + ); +}; export default connect( mapStateToProps, mapDispatchToActions -)(withTranslation()(BackEnd)); +)(withTranslation()(ShowBackEnd)); export const query = graphql` query BackendChallenge($id: String!) { diff --git a/client/src/templates/Challenges/projects/frontend/show.tsx b/client/src/templates/Challenges/projects/frontend/show.tsx index 54076b9dcb4bb5..070f0f7d1a0f3f 100644 --- a/client/src/templates/Challenges/projects/frontend/show.tsx +++ b/client/src/templates/Challenges/projects/frontend/show.tsx @@ -1,7 +1,7 @@ import { graphql } from 'gatsby'; -import React, { Component } from 'react'; +import React, { useEffect, useRef } from 'react'; import Helmet from 'react-helmet'; -import type { TFunction } from 'i18next'; +import { type TFunction } from 'i18next'; import { withTranslation } from 'react-i18next'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; @@ -31,6 +31,7 @@ import { isChallengeCompletedSelector } from '../../redux/selectors'; import { getGuideUrl } from '../../utils'; import SolutionForm from '../solution-form'; import ProjectToolPanel from '../tool-panel'; +import { getChallengePaths } from '../../utils/challenge-paths'; // Redux Setup const mapStateToProps = createSelector( @@ -67,165 +68,120 @@ interface ProjectProps { updateSolutionFormValues: () => void; } -// Component -class Project extends Component { - static displayName: string; - private container: React.RefObject = React.createRef(); +const ShowFrontEndProject = (props: ProjectProps) => { + const handleSubmit = ({ + showCompletionModal + }: { + showCompletionModal: boolean; + }): void => { + if (showCompletionModal) { + props.openCompletionModal(); + } + }; - constructor(props: ProjectProps) { - super(props); - this.handleSubmit = this.handleSubmit.bind(this); - } - componentDidMount() { + const container = useRef(null); + + useEffect(() => { const { challengeMounted, data: { challengeNode: { - challenge: { - fields: { tests }, - title, - challengeType, - helpCategory - } + challenge: { fields, title, challengeType, helpCategory } } }, pageContext: { challengeMeta }, initTests, updateChallengeMeta - } = this.props; - initTests(tests); + } = props; + initTests(fields.tests); + const challengePaths = getChallengePaths({ + currentCurriculumPaths: challengeMeta + }); updateChallengeMeta({ ...challengeMeta, title, challengeType, - helpCategory + helpCategory, + ...challengePaths }); challengeMounted(challengeMeta.id); - this.container.current?.focus(); - } + container.current?.focus(); + // This effect should be run once on mount + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); - componentDidUpdate(prevProps: ProjectProps): void { - const { - data: { - challengeNode: { - challenge: { title: prevTitle } + const { + data: { + challengeNode: { + challenge: { + challengeType, + fields: { blockName }, + forumTopicId, + title, + description, + instructions, + superBlock, + block, + translationPending } } - } = prevProps; - const { - challengeMounted, - data: { - challengeNode: { - challenge: { title: currentTitle, challengeType, helpCategory } - } - }, - pageContext: { challengeMeta }, - updateChallengeMeta - } = this.props; - if (prevTitle !== currentTitle) { - updateChallengeMeta({ - ...challengeMeta, - title: currentTitle, - challengeType, - helpCategory - }); - challengeMounted(challengeMeta.id); - } - } - - handleSubmit({ - showCompletionModal - }: { - showCompletionModal: boolean; - }): void { - if (showCompletionModal) { - this.props.openCompletionModal(); - } - } - - render() { - const { - data: { - challengeNode: { - challenge: { - challengeType, - fields: { blockName }, - forumTopicId, - title, - description, - instructions, - superBlock, - block, - translationPending - } - } - }, - isChallengeCompleted, - pageContext: { - challengeMeta: { nextChallengePath, prevChallengePath } - }, - t, - updateSolutionFormValues - } = this.props; + }, + isChallengeCompleted, + t, + updateSolutionFormValues + } = props; - const blockNameTitle = `${t( - `intro:${superBlock}.blocks.${block}.title` - )} - ${title}`; + const blockNameTitle = `${t( + `intro:${superBlock}.blocks.${block}.title` + )} - ${title}`; - return ( - - - - - - - - - {title} - - - - - -
    - - - - -     -     -     -     - ); - } -} - -Project.displayName = 'Project'; + return ( + + + + + + + + + {title} + + + + + +
    + + + + +     +     +     +     + ); +}; export default connect( mapStateToProps, mapDispatchToProps -)(withTranslation()(Project)); +)(withTranslation()(ShowFrontEndProject)); export const query = graphql` query ProjectChallenge($id: String!) { diff --git a/client/src/templates/Challenges/quiz/show.tsx b/client/src/templates/Challenges/quiz/show.tsx index 29d61963c53e7c..5fd0cec5199b85 100644 --- a/client/src/templates/Challenges/quiz/show.tsx +++ b/client/src/templates/Challenges/quiz/show.tsx @@ -26,6 +26,7 @@ import ChallengeDescription from '../components/challenge-description'; import Hotkeys from '../components/hotkeys'; import ChallengeTitle from '../components/challenge-title'; import CompletionModal from '../components/completion-modal'; +import { getChallengePaths } from '../utils/challenge-paths'; import { challengeMounted, updateChallengeMeta, @@ -114,7 +115,6 @@ const ShowQuiz = ({ const { t } = useTranslation(); const curLocation = useLocation(); - const { nextChallengePath, prevChallengePath } = challengeMeta; const container = useRef(null); // Campers are not allowed to change their answers once the quiz is submitted. @@ -190,11 +190,15 @@ const ShowQuiz = ({ useEffect(() => { initTests(tests); + const challengePaths = getChallengePaths({ + currentCurriculumPaths: challengeMeta + }); updateChallengeMeta({ ...challengeMeta, title, challengeType, - helpCategory + helpCategory, + ...challengePaths }); challengeMounted(challengeMeta.id); container.current?.focus(); @@ -202,23 +206,6 @@ const ShowQuiz = ({ // eslint-disable-next-line react-hooks/exhaustive-deps }, []); - useEffect(() => { - updateChallengeMeta({ - ...challengeMeta, - title, - challengeType, - helpCategory - }); - challengeMounted(challengeMeta.id); - }, [ - title, - challengeMeta, - challengeType, - helpCategory, - challengeMounted, - updateChallengeMeta - ]); - const handleFinishQuiz = () => { setShowUnanswered(true); @@ -299,8 +286,6 @@ const ShowQuiz = ({ - + diff --git a/client/src/templates/Challenges/rechallenge/transformers.js b/client/src/templates/Challenges/rechallenge/transformers.js index 2782c98bdf2384..85a45f5d0cbe8f 100644 --- a/client/src/templates/Challenges/rechallenge/transformers.js +++ b/client/src/templates/Challenges/rechallenge/transformers.js @@ -28,6 +28,7 @@ const protectTimeout = 100; const testProtectTimeout = 1500; const loopsPerTimeoutCheck = 100; const testLoopsPerTimeoutCheck = 2000; +const MODULE_TRANSFORM_PLUGIN = 'transform-modules-umd'; function loopProtectCB(line) { console.log( @@ -132,6 +133,18 @@ const getJSXTranspiler = loopProtectOptions => async challengeFile => { ); }; +const getJSXModuleTranspiler = loopProtectOptions => async challengeFile => { + await loadBabel(); + await loadPresetReact(); + const baseOptions = getBabelOptions(presetsJSX, loopProtectOptions); + const babelOptions = { + ...baseOptions, + plugins: [...baseOptions.plugins, MODULE_TRANSFORM_PLUGIN], + moduleId: 'index' // TODO: this should be dynamic + }; + return transformContents(babelTransformCode(babelOptions), challengeFile); +}; + const getTSTranspiler = loopProtectOptions => async challengeFile => { await loadBabel(); await checkTSServiceIsReady(); @@ -147,7 +160,15 @@ const createTranspiler = loopProtectOptions => { [testJS, getJSTranspiler(loopProtectOptions)], [testJSX, getJSXTranspiler(loopProtectOptions)], [testTypeScript, getTSTranspiler(loopProtectOptions)], - [testHTML, transformHtml], + [testHTML, getHtmlTranspiler({ useModules: false })], + [stubTrue, identity] + ]); +}; + +const createModuleTransformer = loopProtectOptions => { + return cond([ + [testJSX, getJSXModuleTranspiler(loopProtectOptions)], + [testHTML, getHtmlTranspiler({ useModules: true })], [stubTrue, identity] ]); }; @@ -186,22 +207,40 @@ async function transformSASS(documentElement) { ); } -async function transformScript(documentElement) { +async function transformScript(documentElement, { useModules }) { await loadBabel(); await loadPresetEnv(); await loadPresetReact(); const scriptTags = documentElement.querySelectorAll('script'); scriptTags.forEach(script => { const isBabel = script.type === 'text/babel'; + const hasSource = !!script.src; // TODO: make the use of JSX conditional on more than just the script type. // It should only be used for React challenges since it would be confusing // for learners to see the results of a transformation they didn't ask for. - const options = isBabel ? presetsJSX : presetsJS; + const baseOptions = isBabel ? presetsJSX : presetsJS; + + const options = { + ...baseOptions, + ...(useModules && { plugins: [MODULE_TRANSFORM_PLUGIN] }) + }; + + // The type has to be removed, otherwise the browser will ignore the script. + // However, if we're importing modules, the type will be removed when the + // scripts are embedded in the HTML. + if (isBabel && !useModules) script.removeAttribute('type'); + // We could use babel standalone to transform inline code in the preview, + // but that generates a warning that's shown to learner. By removing the + // type attribute and transforming the code we can avoid that warning. + if (isBabel && !hasSource) { + script.removeAttribute('type'); + script.setAttribute('data-type', 'text/babel'); + } - if (isBabel) script.removeAttribute('type'); // otherwise the browser will ignore the script - script.innerHTML = babelTransformCode(getBabelOptions(options))( - script.innerHTML - ); + // Skip unnecessary transformations + script.innerHTML = script.innerHTML + ? babelTransformCode(options)(script.innerHTML) + : ''; }); } @@ -211,7 +250,8 @@ export const embedFilesInHtml = async function (challengeFiles) { const { indexHtml, stylesCss, scriptJs, indexJsx, indexTs } = challengeFilesToObject(challengeFiles); - const embedStylesAndScript = (documentElement, contentDocument) => { + const embedStylesAndScript = contentDocument => { + const documentElement = contentDocument.documentElement; const link = documentElement.querySelector('link[href="styles.css"]') ?? documentElement.querySelector('link[href="./styles.css"]'); @@ -222,6 +262,15 @@ export const embedFilesInHtml = async function (challengeFiles) { const tsScript = documentElement.querySelector('script[src="index.ts"]') ?? documentElement.querySelector('script[src="./index.ts"]'); + + const jsxScript = + documentElement.querySelector( + `script[data-plugins="${MODULE_TRANSFORM_PLUGIN}"][type="text/babel"][src="index.jsx"]` + ) ?? + documentElement.querySelector( + `script[data-plugins="${MODULE_TRANSFORM_PLUGIN}"][type="text/babel"][src="./index.jsx"]` + ); + if (link) { const style = contentDocument.createElement('style'); style.classList.add('fcc-injected-styles'); @@ -242,6 +291,13 @@ export const embedFilesInHtml = async function (challengeFiles) { tsScript.removeAttribute('src'); tsScript.setAttribute('data-src', 'index.ts'); } + if (jsxScript) { + jsxScript.innerHTML = indexJsx?.contents; + jsxScript.removeAttribute('src'); + jsxScript.removeAttribute('type'); + jsxScript.setAttribute('data-src', 'index.jsx'); + jsxScript.setAttribute('data-type', 'text/babel'); + } return documentElement.innerHTML; }; @@ -250,13 +306,13 @@ export const embedFilesInHtml = async function (challengeFiles) { embedStylesAndScript, indexHtml.contents ); - return [challengeFiles, contents]; + return contents; } else if (indexJsx) { - return [challengeFiles, ``]; + return ``; } else if (scriptJs) { - return [challengeFiles, ``]; + return ``; } else if (indexTs) { - return [challengeFiles, ``]; + return ``; } else { throw Error('No html, ts or js(x) file found'); } @@ -275,22 +331,24 @@ const parseAndTransform = async function (transform, contents) { const parser = new DOMParser(); const newDoc = parser.parseFromString(contents, 'text/html'); - return await transform(newDoc.documentElement, newDoc); + return await transform(newDoc); }; -const transformHtml = async function (file) { - const transform = async documentElement => { - await Promise.all([ - transformSASS(documentElement), - transformScript(documentElement) - ]); - return documentElement.innerHTML; +const getHtmlTranspiler = scriptOptions => + async function (file) { + const transform = async contentDocument => { + const documentElement = contentDocument.documentElement; + await Promise.all([ + transformSASS(documentElement), + transformScript(documentElement, scriptOptions) + ]); + return documentElement.innerHTML; + }; + + const contents = await parseAndTransform(transform, file.contents); + return transformContents(() => contents, file); }; - const contents = await parseAndTransform(transform, file.contents); - return transformContents(() => contents, file); -}; - export const getTransformers = loopProtectOptions => [ createSource, replaceNBSP, @@ -298,6 +356,12 @@ export const getTransformers = loopProtectOptions => [ partial(compileHeadTail, '') ]; +export const getMultifileJSXTransformers = loopProtectOptions => [ + createSource, + replaceNBSP, + createModuleTransformer(loopProtectOptions) +]; + export const getPythonTransformers = () => [ createSource, replaceNBSP, diff --git a/client/src/templates/Challenges/redux/completion-epic.js b/client/src/templates/Challenges/redux/completion-epic.js index 79e2116e58b995..fb200721bf66f8 100644 --- a/client/src/templates/Challenges/redux/completion-epic.js +++ b/client/src/templates/Challenges/redux/completion-epic.js @@ -219,7 +219,7 @@ export default function completionEpic(action$, state$) { const state = state$.value; const { - nextBlock, + isLastChallengeInBlock, nextChallengePath, challengeType, superBlock, @@ -243,8 +243,7 @@ export default function completionEpic(action$, state$) { submitter = submitters[submitTypes[challengeType]]; } - const lastChallengeInBlock = block !== nextBlock; - let pathToNavigateTo = lastChallengeInBlock + let pathToNavigateTo = isLastChallengeInBlock ? blockHashSlug : nextChallengePath; @@ -254,7 +253,7 @@ export default function completionEpic(action$, state$) { return submitter(type, state).pipe( concat( - of(setIsAdvancing(!lastChallengeInBlock), setIsProcessing(false)) + of(setIsAdvancing(!isLastChallengeInBlock), setIsProcessing(false)) ), mergeMap(x => canAllowDonationRequest(state, x) diff --git a/client/src/templates/Challenges/redux/index.js b/client/src/templates/Challenges/redux/index.js index 0e331c874915f6..a24ffab0d3a2e6 100644 --- a/client/src/templates/Challenges/redux/index.js +++ b/client/src/templates/Challenges/redux/index.js @@ -23,7 +23,7 @@ const initialState = { block: '', blockHashSlug: '/', id: '', - nextBlock: '', + isLastChallengeInBlock: false, nextChallengePath: '/', prevChallengePath: '/', challengeType: -1 diff --git a/client/src/templates/Challenges/redux/selectors.js b/client/src/templates/Challenges/redux/selectors.js index ea893c2ad9e3be..745151ca5cee0d 100644 --- a/client/src/templates/Challenges/redux/selectors.js +++ b/client/src/templates/Challenges/redux/selectors.js @@ -96,7 +96,8 @@ export const challengeDataSelector = state => { challengeType === challengeTypes.modern || challengeType === challengeTypes.multifileCertProject || challengeType === challengeTypes.multifilePythonCertProject || - challengeType === challengeTypes.python + challengeType === challengeTypes.python || + challengeType === challengeTypes.lab ) { const { required = [], template = '' } = challengeMetaSelector(state); challengeData = { diff --git a/client/src/templates/Challenges/utils/build.ts b/client/src/templates/Challenges/utils/build.ts index dc1954cf1efaf0..d8210abfe333cd 100644 --- a/client/src/templates/Challenges/utils/build.ts +++ b/client/src/templates/Challenges/utils/build.ts @@ -8,7 +8,8 @@ import { concatHtml } from '../rechallenge/builders'; import { getTransformers, embedFilesInHtml, - getPythonTransformers + getPythonTransformers, + getMultifileJSXTransformers } from '../rechallenge/transformers'; import { createTestFramer, @@ -92,7 +93,7 @@ function buildSourceMap(challengeFiles: ChallengeFile[]): Source | undefined { return source; } -const buildFunctions = { +export const buildFunctions = { [challengeTypes.js]: buildJSChallenge, [challengeTypes.jsProject]: buildJSChallenge, [challengeTypes.html]: buildDOMChallenge, @@ -103,7 +104,8 @@ const buildFunctions = { [challengeTypes.multifileCertProject]: buildDOMChallenge, [challengeTypes.colab]: buildBackendChallenge, [challengeTypes.python]: buildPythonChallenge, - [challengeTypes.multifilePythonCertProject]: buildPythonChallenge + [challengeTypes.multifilePythonCertProject]: buildPythonChallenge, + [challengeTypes.lab]: buildDOMChallenge }; export function canBuildChallenge(challengeData: BuildChallengeData): boolean { @@ -132,7 +134,8 @@ const testRunners = { [challengeTypes.pythonProject]: getDOMTestRunner, [challengeTypes.python]: getPyTestRunner, [challengeTypes.multifileCertProject]: getDOMTestRunner, - [challengeTypes.multifilePythonCertProject]: getPyTestRunner + [challengeTypes.multifilePythonCertProject]: getPyTestRunner, + [challengeTypes.lab]: getDOMTestRunner }; // TODO: Figure out and (hopefully) simplify the return type. // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types @@ -227,18 +230,22 @@ export async function buildDOMChallenge( ): Promise { // TODO: make this required in the schema. if (!challengeFiles) throw Error('No challenge files provided'); - const loadEnzyme = challengeFiles.some( + const hasJsx = challengeFiles.some( challengeFile => challengeFile.ext === 'jsx' ); + const isMultifile = challengeFiles.length > 1; - const pipeLine = composeFunctions(...getTransformers(options)); + // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment + const transformers = + isMultifile && hasJsx + ? getMultifileJSXTransformers(options) + : getTransformers(options); + + const pipeLine = composeFunctions(...transformers); const usesTestRunner = options?.usesTestRunner ?? false; const finalFiles = await Promise.all(challengeFiles.map(pipeLine)); const error = finalFiles.find(({ error }) => error)?.error; - const [embeddedFiles, contents] = (await embedFilesInHtml(finalFiles)) as [ - ChallengeFile[], - string - ]; + const contents = (await embedFilesInHtml(finalFiles)) as string; // if there is an error, we just build the test runner so that it can be // used to run tests against the code without actually running the code. @@ -256,8 +263,8 @@ export async function buildDOMChallenge( // necessary at the moment. challengeType: challengeTypes.html, build: concatHtml(toBuild), - sources: buildSourceMap(embeddedFiles), - loadEnzyme, + sources: buildSourceMap(finalFiles), + loadEnzyme: hasJsx, error }; } @@ -330,7 +337,8 @@ export function updatePreview( if ( buildData.challengeType === challengeTypes.html || - buildData.challengeType === challengeTypes.multifileCertProject + buildData.challengeType === challengeTypes.multifileCertProject || + buildData.challengeType === challengeTypes.lab ) { return new Promise(resolve => createMainPreviewFramer( @@ -364,7 +372,8 @@ export function updateProjectPreview( ): void { if ( buildData.challengeType === challengeTypes.html || - buildData.challengeType === challengeTypes.multifileCertProject + buildData.challengeType === challengeTypes.multifileCertProject || + buildData.challengeType === challengeTypes.lab ) { createProjectPreviewFramer( document, @@ -383,7 +392,8 @@ export function challengeHasPreview({ challengeType }: ChallengeMeta): boolean { challengeType === challengeTypes.modern || challengeType === challengeTypes.multifileCertProject || challengeType === challengeTypes.multifilePythonCertProject || - challengeType === challengeTypes.python + challengeType === challengeTypes.python || + challengeType === challengeTypes.lab ); } diff --git a/client/src/templates/Challenges/utils/challenge-paths.ts b/client/src/templates/Challenges/utils/challenge-paths.ts new file mode 100644 index 00000000000000..48e51a2fb984e5 --- /dev/null +++ b/client/src/templates/Challenges/utils/challenge-paths.ts @@ -0,0 +1,12 @@ +import { NavigationPaths } from '../../../redux/prop-types'; + +export const getChallengePaths = ({ + currentCurriculumPaths +}: { + currentCurriculumPaths: NavigationPaths; +}): NavigationPaths => { + return { + nextChallengePath: currentCurriculumPaths.nextChallengePath, + prevChallengePath: currentCurriculumPaths.prevChallengePath + }; +}; diff --git a/client/src/templates/Challenges/video.css b/client/src/templates/Challenges/video.css index ede2677cc3101a..c1b8e598957d9a 100644 --- a/client/src/templates/Challenges/video.css +++ b/client/src/templates/Challenges/video.css @@ -139,6 +139,7 @@ input:focus-visible + .video-quiz-input-visible { .mcq-feedback { border-top: none; + display: block; } .mcq-prism-correct code { diff --git a/client/src/templates/Challenges/video/show.tsx b/client/src/templates/Challenges/video/show.tsx deleted file mode 100644 index 0165e47051f464..00000000000000 --- a/client/src/templates/Challenges/video/show.tsx +++ /dev/null @@ -1,357 +0,0 @@ -// Package Utilities -import { graphql } from 'gatsby'; -import React, { Component } from 'react'; -import Helmet from 'react-helmet'; -import { ObserveKeys } from 'react-hotkeys'; -import type { TFunction } from 'i18next'; -import { withTranslation } from 'react-i18next'; -import { connect } from 'react-redux'; -import { bindActionCreators } from 'redux'; -import type { Dispatch } from 'redux'; -import { createSelector } from 'reselect'; -import { isEqual } from 'lodash-es'; -import { Container, Col, Row, Button, Spacer } from '@freecodecamp/ui'; - -// Local Utilities -import LearnLayout from '../../../components/layouts/learn'; -import { ChallengeNode, ChallengeMeta, Test } from '../../../redux/prop-types'; -import { challengeTypes } from '../../../../../shared/config/challenge-types'; -import ChallengeDescription from '../components/challenge-description'; -import Hotkeys from '../components/hotkeys'; -import VideoPlayer from '../components/video-player'; -import ChallengeTitle from '../components/challenge-title'; -import CompletionModal from '../components/completion-modal'; -import HelpModal from '../components/help-modal'; -import MultipleChoiceQuestions from '../components/multiple-choice-questions'; -import { - challengeMounted, - updateChallengeMeta, - openModal, - updateSolutionFormValues, - initTests -} from '../redux/actions'; -import { isChallengeCompletedSelector } from '../redux/selectors'; - -// Redux Setup -const mapStateToProps = createSelector( - isChallengeCompletedSelector, - (isChallengeCompleted: boolean) => ({ - isChallengeCompleted - }) -); -const mapDispatchToProps = (dispatch: Dispatch) => - bindActionCreators( - { - initTests, - updateChallengeMeta, - challengeMounted, - updateSolutionFormValues, - openCompletionModal: () => openModal('completion'), - openHelpModal: () => openModal('help') - }, - dispatch - ); - -// Types -interface ShowVideoProps { - challengeMounted: (arg0: string) => void; - data: { challengeNode: ChallengeNode }; - description: string; - initTests: (xs: Test[]) => void; - isChallengeCompleted: boolean; - openCompletionModal: () => void; - openHelpModal: () => void; - pageContext: { - challengeMeta: ChallengeMeta; - }; - t: TFunction; - updateChallengeMeta: (arg0: ChallengeMeta) => void; - updateSolutionFormValues: () => void; -} - -interface ShowVideoState { - subtitles: string; - downloadURL: string | null; - selectedMcqOptions: (number | null)[]; - submittedMcqAnswers: (number | null)[]; - showFeedback: boolean; - videoIsLoaded: boolean; -} - -// Component -class ShowVideo extends Component { - static displayName: string; - private container: React.RefObject = React.createRef(); - - constructor(props: ShowVideoProps) { - super(props); - - const { - data: { - challengeNode: { - challenge: { questions } - } - } - } = this.props; - - this.state = { - subtitles: '', - downloadURL: null, - selectedMcqOptions: questions.map(() => null), - submittedMcqAnswers: questions.map(() => null), - showFeedback: false, - videoIsLoaded: false - }; - } - - componentDidMount(): void { - const { - challengeMounted, - data: { - challengeNode: { - challenge: { - fields: { tests }, - title, - challengeType, - helpCategory - } - } - }, - pageContext: { challengeMeta }, - initTests, - updateChallengeMeta - } = this.props; - initTests(tests); - updateChallengeMeta({ - ...challengeMeta, - title, - challengeType, - helpCategory - }); - challengeMounted(challengeMeta.id); - this.container.current?.focus(); - } - - componentDidUpdate(prevProps: ShowVideoProps): void { - const { - data: { - challengeNode: { - challenge: { title: prevTitle } - } - } - } = prevProps; - const { - challengeMounted, - data: { - challengeNode: { - challenge: { title: currentTitle, challengeType, helpCategory } - } - }, - pageContext: { challengeMeta }, - updateChallengeMeta - } = this.props; - if (prevTitle !== currentTitle) { - updateChallengeMeta({ - ...challengeMeta, - title: currentTitle, - challengeType, - helpCategory - }); - challengeMounted(challengeMeta.id); - } - } - - handleSubmit = () => { - const { - data: { - challengeNode: { - challenge: { questions } - } - }, - openCompletionModal - } = this.props; - - // subract 1 because the solutions are 1-indexed - const mcqSolutions = questions.map(question => question.solution - 1); - - this.setState({ - submittedMcqAnswers: this.state.selectedMcqOptions, - showFeedback: true - }); - - const allMcqAnswersCorrect = isEqual( - mcqSolutions, - this.state.selectedMcqOptions - ); - - if (allMcqAnswersCorrect) { - openCompletionModal(); - } - }; - - handleMcqOptionChange = ( - questionIndex: number, - answerIndex: number - ): void => { - this.setState(state => ({ - selectedMcqOptions: state.selectedMcqOptions.map((option, index) => - index === questionIndex ? answerIndex : option - ) - })); - }; - - onVideoLoad = () => { - this.setState({ - videoIsLoaded: true - }); - }; - - render() { - const { - data: { - challengeNode: { - challenge: { - title, - challengeType, - description, - superBlock, - block, - translationPending, - videoId, - videoLocaleIds, - bilibiliIds, - fields: { blockName }, - questions - } - } - }, - openHelpModal, - pageContext: { - challengeMeta: { nextChallengePath, prevChallengePath } - }, - t, - isChallengeCompleted - } = this.props; - - const blockNameTitle = `${t( - `intro:${superBlock}.blocks.${block}.title` - )} - ${title}`; - - return ( - - - - - - - - {title} - - - {challengeType === challengeTypes.video && ( - - - - )} - - - - - - - - - - - - - - - - - - - ); - } -} - -ShowVideo.displayName = 'ShowVideo'; - -export default connect( - mapStateToProps, - mapDispatchToProps -)(withTranslation()(ShowVideo)); - -export const query = graphql` - query VideoChallenge($id: String!) { - challengeNode(id: { eq: $id }) { - challenge { - videoId - videoLocaleIds { - espanol - italian - portuguese - } - bilibiliIds { - aid - bvid - cid - } - title - description - challengeType - helpCategory - superBlock - block - fields { - blockName - slug - tests { - text - testString - } - } - questions { - text - answers { - answer - feedback - } - solution - } - translationPending - } - } - } -`; diff --git a/client/src/templates/Introduction/components/block.test.tsx b/client/src/templates/Introduction/components/block.test.tsx index 29d52c0a1b6909..c039b46bb963a0 100644 --- a/client/src/templates/Introduction/components/block.test.tsx +++ b/client/src/templates/Introduction/components/block.test.tsx @@ -69,7 +69,7 @@ const defaultProps = { }, sourceInstanceName: 'mockSourceInstanceName', superOrder: 1, - superBlock: SuperBlocks.UpcomingPython, + superBlock: SuperBlocks.RespWebDesign, tail: ['mockTail'], template: 'mockTemplate', tests: [] as Test[], diff --git a/client/src/templates/Introduction/components/block.tsx b/client/src/templates/Introduction/components/block.tsx index bbb4befd724b95..e9b6df12f1b912 100644 --- a/client/src/templates/Introduction/components/block.tsx +++ b/client/src/templates/Introduction/components/block.tsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { Component, ReactNode } from 'react'; import type { DefaultTFuncReturn, TFunction } from 'i18next'; import { withTranslation } from 'react-i18next'; import { connect } from 'react-redux'; @@ -7,6 +7,7 @@ import { bindActionCreators, Dispatch } from 'redux'; import { createSelector } from 'reselect'; import { Spacer } from '@freecodecamp/ui'; +import { challengeTypes } from '../../../../../shared/config/challenge-types'; import { SuperBlocks } from '../../../../../shared/config/curriculum'; import envData from '../../../../config/env.json'; import { isAuditedSuperBlock } from '../../../../../shared/utils/is-audited'; @@ -26,7 +27,7 @@ import BlockHeader from './block-header'; import '../intro.css'; -const { curriculumLocale, showUpcomingChanges, showNewCurriculum } = envData; +const { curriculumLocale } = envData; type Challenge = ChallengeNode['challenge']; @@ -71,7 +72,7 @@ class Block extends Component { toggleBlock(block); }; - render(): JSX.Element { + render(): ReactNode { const { block, blockType, @@ -83,8 +84,9 @@ class Block extends Component { } = this.props; let completedCount = 0; + let stepNumber = 0; - const challengesWithCompleted = challenges.map(challenge => { + const extendedChallenges = challenges.map(challenge => { const { id } = challenge; const isCompleted = completedChallengeIds.some( (completedChallengeId: string) => completedChallengeId === id @@ -92,7 +94,13 @@ class Block extends Component { if (isCompleted) { completedCount++; } - return { ...challenge, isCompleted }; + // Dialogues are interwoven with other challenges in the curriculum, but + // are not considered to be steps. + if (challenge.challengeType !== challengeTypes.dialogue) { + stepNumber++; + } + + return { ...challenge, isCompleted, stepNumber }; }); const isProjectBlock = challenges.some(challenge => { @@ -103,10 +111,7 @@ class Block extends Component { return isGridBased(superBlock, challenge.challengeType); }); - const isAudited = isAuditedSuperBlock(curriculumLocale, superBlock, { - showNewCurriculum, - showUpcomingChanges - }); + const isAudited = isAuditedSuperBlock(curriculumLocale, superBlock); const blockTitle = t(`intro:${superBlock}.blocks.${block}.title`); // the real type of TFunction is the type below, because intro can be an array of strings @@ -118,17 +123,24 @@ class Block extends Component { const expandText = t('intro:misc-text.expand'); const collapseText = t('intro:misc-text.collapse'); - const isBlockCompleted = completedCount === challengesWithCompleted.length; + const isBlockCompleted = completedCount === extendedChallenges.length; const percentageCompleted = Math.floor( - (completedCount / challengesWithCompleted.length) * 100 + (completedCount / extendedChallenges.length) * 100 ); + // since the Blocks are not components, we need link to exist even if it's + // not being used to render anything + const link = challenges[0]?.fields.slug || ''; + const blockLayout = challenges[0]?.blockLayout; + + const isEmptyBlock = !challenges.length; + const courseCompletionStatus = () => { if (completedCount === 0) { return t('learn.not-started'); } - if (completedCount === challengesWithCompleted.length) { + if (completedCount === extendedChallenges.length) { return t('learn.completed'); } return `${percentageCompleted}% ${t('learn.completed')}`; @@ -174,19 +186,19 @@ class Block extends Component { + >{`${completedCount}/${extendedChallenges.length}`} ,{' '} {t('learn.challenges-completed', { completedCount, - totalChallenges: challengesWithCompleted.length + totalChallenges: extendedChallenges.length })} {isExpanded && ( )} @@ -218,7 +230,7 @@ class Block extends Component { @@ -258,7 +270,7 @@ class Block extends Component {
    { onClick={() => { this.handleBlockClick(); }} - to={challengesWithCompleted[0].fields.slug} + to={link} > {blockTitle}{' '} - {t('misc.certification-project')} + {isBlockCompleted + ? `${t('misc.certification-project')}, ${t('learn.completed')}` + : `${t('misc.certification-project')}, ${t('learn.not-completed')}`} @@ -322,7 +336,10 @@ class Block extends Component { * so we can play with it without affecting the existing block layouts. */ const ChallengeListBlock = ( - + <> + + +
    @@ -351,13 +368,13 @@ class Block extends Component { {isExpanded && (
    )}
    -     + ); /** @@ -367,7 +384,10 @@ class Block extends Component { * so we can play with it without affecting the existing block layouts. */ const LinkBlock = ( - + <> + + +
    {!isAudited && ( @@ -386,17 +406,22 @@ class Block extends Component { onClick={() => { this.handleBlockClick(); }} - to={challengesWithCompleted[0].fields.slug} + to={link} > {blockType && } {blockTitle} + + {isBlockCompleted + ? `, ${t('learn.completed')}` + : `, ${t('learn.not-completed')}`} +
    -     + ); /** @@ -404,7 +429,10 @@ class Block extends Component { * This layout is specifically used for the new Full Stack Developer Certification. */ const ChallengeGridBlock = ( - + <> + + +
    @@ -433,7 +461,7 @@ class Block extends Component { {isExpanded && (
    {
    )}
    -     + ); const layoutToComponent = { @@ -455,10 +483,15 @@ class Block extends Component { }; return ( - <> - {layoutToComponent[challenges[0].blockLayout]} - {(!isGridBlock || isProjectBlock) && } - + !isEmptyBlock && ( + <> + {layoutToComponent[blockLayout]} + {(!isGridBlock || isProjectBlock) && + superBlock !== SuperBlocks.FullStackDeveloper && ( + + )} + + ) ); } } diff --git a/client/src/templates/Introduction/components/challenges.tsx b/client/src/templates/Introduction/components/challenges.tsx index 97adebbe8f755d..d2da9b744b882d 100644 --- a/client/src/templates/Introduction/components/challenges.tsx +++ b/client/src/templates/Introduction/components/challenges.tsx @@ -3,20 +3,14 @@ import { withTranslation, useTranslation } from 'react-i18next'; import GreenNotCompleted from '../../../assets/icons/green-not-completed'; import GreenPass from '../../../assets/icons/green-pass'; -import { ChallengeWithCompletedNode } from '../../../redux/prop-types'; +import { ExtendedChallenge } from '../../../redux/prop-types'; import { SuperBlocks } from '../../../../../shared/config/curriculum'; import { challengeTypes } from '../../../../../shared/config/challenge-types'; import { Link } from '../../../components/helpers'; import { ButtonLink } from '../../../components/helpers/button-link'; -const getStepNumber = (dashedName: string) => { - // dashedName should be in the format 'step-1' or 'task-1' - const match = dashedName.match(/-(\d+)/); - return match ? match[1] : ''; -}; - interface Challenges { - challengesWithCompleted: ChallengeWithCompletedNode[]; + challenges: ExtendedChallenge[]; isProjectBlock: boolean; isGridMap?: boolean; blockTitle?: string | null; @@ -25,11 +19,7 @@ interface Challenges { const CheckMark = ({ isCompleted }: { isCompleted: boolean }) => isCompleted ? : ; -const Challenge = ({ - challenge -}: { - challenge: ChallengeWithCompletedNode; -}) => ( +const ListChallenge = ({ challenge }: { challenge: ExtendedChallenge }) => ( @@ -38,7 +28,7 @@ const Challenge = ({ ); -const Project = ({ challenge }: { challenge: ChallengeWithCompletedNode }) => ( +const CertChallenge = ({ challenge }: { challenge: ExtendedChallenge }) => ( {challenge.title} @@ -47,19 +37,43 @@ const Project = ({ challenge }: { challenge: ChallengeWithCompletedNode }) => ( ); +// Step or Task challenge +const GridChallenge = ({ challenge }: { challenge: ExtendedChallenge }) => { + const { t } = useTranslation(); + + return ( + + + {challenge.superBlock === SuperBlocks.A2English + ? t('aria.task') + : t('aria.step')} + + {challenge.stepNumber} + + {challenge.isCompleted ? t('icons.passed') : t('icons.not-passed')} + + + ); +}; + function Challenges({ - challengesWithCompleted, + challenges, isProjectBlock, isGridMap = false, blockTitle }: Challenges): JSX.Element { const { t } = useTranslation(); - const firstIncompleteChallenge = challengesWithCompleted.find( + const firstIncompleteChallenge = challenges.find( challenge => !challenge.isCompleted ); - const isChallengeStarted = !!challengesWithCompleted.find( + const isChallengeStarted = !!challenges.find( challenge => challenge.isCompleted ); @@ -78,14 +92,14 @@ function Challenges({