diff --git a/translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.bg.png b/translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.bg.png
new file mode 100644
index 00000000..68f6077e
Binary files /dev/null and b/translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.bg.png differ
diff --git a/translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.ro.png b/translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.ro.png
new file mode 100644
index 00000000..879a982f
Binary files /dev/null and b/translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.ro.png differ
diff --git a/translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.bg.png b/translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.bg.png
new file mode 100644
index 00000000..d32e28f2
Binary files /dev/null and b/translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.bg.png differ
diff --git a/translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.ro.png b/translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.ro.png
new file mode 100644
index 00000000..fe829eaf
Binary files /dev/null and b/translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.ro.png differ
diff --git a/translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.bg.png b/translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.bg.png
new file mode 100644
index 00000000..1fcfb3f3
Binary files /dev/null and b/translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.bg.png differ
diff --git a/translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.ro.png b/translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.ro.png
new file mode 100644
index 00000000..b3f2bb68
Binary files /dev/null and b/translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.ro.png differ
diff --git a/translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.bg.png b/translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.bg.png
new file mode 100644
index 00000000..c902d780
Binary files /dev/null and b/translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.bg.png differ
diff --git a/translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.ro.png b/translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.ro.png
new file mode 100644
index 00000000..72fe8c70
Binary files /dev/null and b/translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.ro.png differ
diff --git a/translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.bg.png b/translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.bg.png
new file mode 100644
index 00000000..bc956aea
Binary files /dev/null and b/translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.bg.png differ
diff --git a/translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.ro.png b/translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.ro.png
new file mode 100644
index 00000000..737b07a5
Binary files /dev/null and b/translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.ro.png differ
diff --git a/translated_images/backgroundColor.e19c3c60768150c8de229c89233ecb5d859aeabef0ada99d2236dd2c44c1510f.bg.png b/translated_images/backgroundColor.e19c3c60768150c8de229c89233ecb5d859aeabef0ada99d2236dd2c44c1510f.bg.png
new file mode 100644
index 00000000..3bd93a53
Binary files /dev/null and b/translated_images/backgroundColor.e19c3c60768150c8de229c89233ecb5d859aeabef0ada99d2236dd2c44c1510f.bg.png differ
diff --git a/translated_images/backgroundColor.e19c3c60768150c8de229c89233ecb5d859aeabef0ada99d2236dd2c44c1510f.ro.png b/translated_images/backgroundColor.e19c3c60768150c8de229c89233ecb5d859aeabef0ada99d2236dd2c44c1510f.ro.png
new file mode 100644
index 00000000..3bd93a53
Binary files /dev/null and b/translated_images/backgroundColor.e19c3c60768150c8de229c89233ecb5d859aeabef0ada99d2236dd2c44c1510f.ro.png differ
diff --git a/translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.bg.png b/translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.bg.png
new file mode 100644
index 00000000..14141e51
Binary files /dev/null and b/translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.bg.png differ
diff --git a/translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.ro.png b/translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.ro.png
new file mode 100644
index 00000000..667519a9
Binary files /dev/null and b/translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.ro.png differ
diff --git a/translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.bg.jpg b/translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.bg.jpg
new file mode 100644
index 00000000..29aef5c3
Binary files /dev/null and b/translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.bg.jpg differ
diff --git a/translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.ro.jpg b/translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.ro.jpg
new file mode 100644
index 00000000..613eb2ab
Binary files /dev/null and b/translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.ro.jpg differ
diff --git a/translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.bg.png b/translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.bg.png
new file mode 100644
index 00000000..267273d0
Binary files /dev/null and b/translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.bg.png differ
diff --git a/translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.ro.png b/translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.ro.png
new file mode 100644
index 00000000..0f38e934
Binary files /dev/null and b/translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.ro.png differ
diff --git a/translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.bg.png b/translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.bg.png
new file mode 100644
index 00000000..ad358fbb
Binary files /dev/null and b/translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.bg.png differ
diff --git a/translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.ro.png b/translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.ro.png
new file mode 100644
index 00000000..b9c03829
Binary files /dev/null and b/translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.ro.png differ
diff --git a/translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.bg.png b/translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.bg.png
new file mode 100644
index 00000000..52c4260f
Binary files /dev/null and b/translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.bg.png differ
diff --git a/translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.ro.png b/translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.ro.png
new file mode 100644
index 00000000..f2aa1900
Binary files /dev/null and b/translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.ro.png differ
diff --git a/translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.bg.png b/translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.bg.png
new file mode 100644
index 00000000..ccc65305
Binary files /dev/null and b/translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.bg.png differ
diff --git a/translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.ro.png b/translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.ro.png
new file mode 100644
index 00000000..ccc65305
Binary files /dev/null and b/translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.ro.png differ
diff --git a/translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.bg.png b/translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.bg.png
new file mode 100644
index 00000000..d3fe7cff
Binary files /dev/null and b/translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.bg.png differ
diff --git a/translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.ro.png b/translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.ro.png
new file mode 100644
index 00000000..9f2f67a8
Binary files /dev/null and b/translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.ro.png differ
diff --git a/translated_images/clone_repo.6a202fb230ab6bdd8e8f536661f12088315044ed26899f00b5815db04bff9217.bg.png b/translated_images/clone_repo.6a202fb230ab6bdd8e8f536661f12088315044ed26899f00b5815db04bff9217.bg.png
new file mode 100644
index 00000000..08336276
Binary files /dev/null and b/translated_images/clone_repo.6a202fb230ab6bdd8e8f536661f12088315044ed26899f00b5815db04bff9217.bg.png differ
diff --git a/translated_images/clone_repo.6a202fb230ab6bdd8e8f536661f12088315044ed26899f00b5815db04bff9217.ro.png b/translated_images/clone_repo.6a202fb230ab6bdd8e8f536661f12088315044ed26899f00b5815db04bff9217.ro.png
new file mode 100644
index 00000000..0770b94b
Binary files /dev/null and b/translated_images/clone_repo.6a202fb230ab6bdd8e8f536661f12088315044ed26899f00b5815db04bff9217.ro.png differ
diff --git a/translated_images/create-a-fork.297ab42b4bd0af9989c1a00dc1ad10805a7e109296a5f47acebacaf5ff098a30.bg.png b/translated_images/create-a-fork.297ab42b4bd0af9989c1a00dc1ad10805a7e109296a5f47acebacaf5ff098a30.bg.png
new file mode 100644
index 00000000..fc42c11e
Binary files /dev/null and b/translated_images/create-a-fork.297ab42b4bd0af9989c1a00dc1ad10805a7e109296a5f47acebacaf5ff098a30.bg.png differ
diff --git a/translated_images/create-a-fork.297ab42b4bd0af9989c1a00dc1ad10805a7e109296a5f47acebacaf5ff098a30.ro.png b/translated_images/create-a-fork.297ab42b4bd0af9989c1a00dc1ad10805a7e109296a5f47acebacaf5ff098a30.ro.png
new file mode 100644
index 00000000..396217fb
Binary files /dev/null and b/translated_images/create-a-fork.297ab42b4bd0af9989c1a00dc1ad10805a7e109296a5f47acebacaf5ff098a30.ro.png differ
diff --git a/translated_images/create-new-file-pb.0797800d977ec3ebf484be2545060e443a902973aaa5267219c07fe199b0e2d4.bg.png b/translated_images/create-new-file-pb.0797800d977ec3ebf484be2545060e443a902973aaa5267219c07fe199b0e2d4.bg.png
new file mode 100644
index 00000000..d13c890f
Binary files /dev/null and b/translated_images/create-new-file-pb.0797800d977ec3ebf484be2545060e443a902973aaa5267219c07fe199b0e2d4.bg.png differ
diff --git a/translated_images/create-new-file-pb.0797800d977ec3ebf484be2545060e443a902973aaa5267219c07fe199b0e2d4.ro.png b/translated_images/create-new-file-pb.0797800d977ec3ebf484be2545060e443a902973aaa5267219c07fe199b0e2d4.ro.png
new file mode 100644
index 00000000..3c26bb7d
Binary files /dev/null and b/translated_images/create-new-file-pb.0797800d977ec3ebf484be2545060e443a902973aaa5267219c07fe199b0e2d4.ro.png differ
diff --git a/translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.bg.png b/translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.bg.png
new file mode 100644
index 00000000..a1fb99b5
Binary files /dev/null and b/translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.bg.png differ
diff --git a/translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.ro.png b/translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.ro.png
new file mode 100644
index 00000000..a1fb99b5
Binary files /dev/null and b/translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.ro.png differ
diff --git a/translated_images/createcodespace.0238bbf4d7a8d955fa8fa7f7b6602a3cb6499a24708fbee589f83211c5a613b7.bg.png b/translated_images/createcodespace.0238bbf4d7a8d955fa8fa7f7b6602a3cb6499a24708fbee589f83211c5a613b7.bg.png
new file mode 100644
index 00000000..64576a55
Binary files /dev/null and b/translated_images/createcodespace.0238bbf4d7a8d955fa8fa7f7b6602a3cb6499a24708fbee589f83211c5a613b7.bg.png differ
diff --git a/translated_images/createcodespace.0238bbf4d7a8d955fa8fa7f7b6602a3cb6499a24708fbee589f83211c5a613b7.ro.png b/translated_images/createcodespace.0238bbf4d7a8d955fa8fa7f7b6602a3cb6499a24708fbee589f83211c5a613b7.ro.png
new file mode 100644
index 00000000..c0090f4d
Binary files /dev/null and b/translated_images/createcodespace.0238bbf4d7a8d955fa8fa7f7b6602a3cb6499a24708fbee589f83211c5a613b7.ro.png differ
diff --git a/translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.bg.png b/translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.bg.png
new file mode 100644
index 00000000..6ec91d27
Binary files /dev/null and b/translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.bg.png differ
diff --git a/translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.ro.png b/translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.ro.png
new file mode 100644
index 00000000..6d4598a3
Binary files /dev/null and b/translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.ro.png differ
diff --git a/translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.bg.png b/translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.bg.png
new file mode 100644
index 00000000..b5c50842
Binary files /dev/null and b/translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.bg.png differ
diff --git a/translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.ro.png b/translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.ro.png
new file mode 100644
index 00000000..f341514c
Binary files /dev/null and b/translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.ro.png differ
diff --git a/translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.bg.png b/translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.bg.png
new file mode 100644
index 00000000..f08f8e33
Binary files /dev/null and b/translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.bg.png differ
diff --git a/translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.ro.png b/translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.ro.png
new file mode 100644
index 00000000..d6c73a82
Binary files /dev/null and b/translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.ro.png differ
diff --git a/translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.bg.png b/translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.bg.png
new file mode 100644
index 00000000..76a981e8
Binary files /dev/null and b/translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.bg.png differ
diff --git a/translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.ro.png b/translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.ro.png
new file mode 100644
index 00000000..9cbb9298
Binary files /dev/null and b/translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.ro.png differ
diff --git a/translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.bg.jpg b/translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.bg.jpg
new file mode 100644
index 00000000..c66ecb4a
Binary files /dev/null and b/translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.bg.jpg differ
diff --git a/translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.ro.jpg b/translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.ro.jpg
new file mode 100644
index 00000000..fb653f89
Binary files /dev/null and b/translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.ro.jpg differ
diff --git a/translated_images/edit-a-file-pb.263555922c14fc523f53f394da84b6e155b1c6d1835dfa572b33ea98a209ef94.bg.png b/translated_images/edit-a-file-pb.263555922c14fc523f53f394da84b6e155b1c6d1835dfa572b33ea98a209ef94.bg.png
new file mode 100644
index 00000000..7eeabbca
Binary files /dev/null and b/translated_images/edit-a-file-pb.263555922c14fc523f53f394da84b6e155b1c6d1835dfa572b33ea98a209ef94.bg.png differ
diff --git a/translated_images/edit-a-file-pb.263555922c14fc523f53f394da84b6e155b1c6d1835dfa572b33ea98a209ef94.ro.png b/translated_images/edit-a-file-pb.263555922c14fc523f53f394da84b6e155b1c6d1835dfa572b33ea98a209ef94.ro.png
new file mode 100644
index 00000000..8dd72449
Binary files /dev/null and b/translated_images/edit-a-file-pb.263555922c14fc523f53f394da84b6e155b1c6d1835dfa572b33ea98a209ef94.ro.png differ
diff --git a/translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.bg.png b/translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.bg.png
new file mode 100644
index 00000000..9064fd67
Binary files /dev/null and b/translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.bg.png differ
diff --git a/translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.ro.png b/translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.ro.png
new file mode 100644
index 00000000..1c1e81e4
Binary files /dev/null and b/translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.ro.png differ
diff --git a/translated_images/enemyShip.035a46787bff658cd126f2e02f640e60fc84536ee2d009a1a5792f3e0423c148.bg.png b/translated_images/enemyShip.035a46787bff658cd126f2e02f640e60fc84536ee2d009a1a5792f3e0423c148.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.035a46787bff658cd126f2e02f640e60fc84536ee2d009a1a5792f3e0423c148.bg.png differ
diff --git a/translated_images/enemyShip.035a46787bff658cd126f2e02f640e60fc84536ee2d009a1a5792f3e0423c148.ro.png b/translated_images/enemyShip.035a46787bff658cd126f2e02f640e60fc84536ee2d009a1a5792f3e0423c148.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.035a46787bff658cd126f2e02f640e60fc84536ee2d009a1a5792f3e0423c148.ro.png differ
diff --git a/translated_images/enemyShip.1a1354d7988de290ea352832e06745922d463e9a4a7cca3b8f89477e934b16b2.bg.png b/translated_images/enemyShip.1a1354d7988de290ea352832e06745922d463e9a4a7cca3b8f89477e934b16b2.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.1a1354d7988de290ea352832e06745922d463e9a4a7cca3b8f89477e934b16b2.bg.png differ
diff --git a/translated_images/enemyShip.1a1354d7988de290ea352832e06745922d463e9a4a7cca3b8f89477e934b16b2.ro.png b/translated_images/enemyShip.1a1354d7988de290ea352832e06745922d463e9a4a7cca3b8f89477e934b16b2.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.1a1354d7988de290ea352832e06745922d463e9a4a7cca3b8f89477e934b16b2.ro.png differ
diff --git a/translated_images/enemyShip.22cbee6ea27a5809ef09dddc81a4f77714de1a4c8fe2b29ee5d13651f8d60fe0.bg.png b/translated_images/enemyShip.22cbee6ea27a5809ef09dddc81a4f77714de1a4c8fe2b29ee5d13651f8d60fe0.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.22cbee6ea27a5809ef09dddc81a4f77714de1a4c8fe2b29ee5d13651f8d60fe0.bg.png differ
diff --git a/translated_images/enemyShip.22cbee6ea27a5809ef09dddc81a4f77714de1a4c8fe2b29ee5d13651f8d60fe0.ro.png b/translated_images/enemyShip.22cbee6ea27a5809ef09dddc81a4f77714de1a4c8fe2b29ee5d13651f8d60fe0.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.22cbee6ea27a5809ef09dddc81a4f77714de1a4c8fe2b29ee5d13651f8d60fe0.ro.png differ
diff --git a/translated_images/enemyShip.321ecb1b4eb21f2c5b74a5118216ac3cbdf4cda52de32993a6c157547e7539bd.bg.png b/translated_images/enemyShip.321ecb1b4eb21f2c5b74a5118216ac3cbdf4cda52de32993a6c157547e7539bd.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.321ecb1b4eb21f2c5b74a5118216ac3cbdf4cda52de32993a6c157547e7539bd.bg.png differ
diff --git a/translated_images/enemyShip.321ecb1b4eb21f2c5b74a5118216ac3cbdf4cda52de32993a6c157547e7539bd.ro.png b/translated_images/enemyShip.321ecb1b4eb21f2c5b74a5118216ac3cbdf4cda52de32993a6c157547e7539bd.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.321ecb1b4eb21f2c5b74a5118216ac3cbdf4cda52de32993a6c157547e7539bd.ro.png differ
diff --git a/translated_images/enemyShip.4fbf2889e6129db41989c4c74999ae81dd8d4dd994f1df01f720e923a5749a36.bg.png b/translated_images/enemyShip.4fbf2889e6129db41989c4c74999ae81dd8d4dd994f1df01f720e923a5749a36.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.4fbf2889e6129db41989c4c74999ae81dd8d4dd994f1df01f720e923a5749a36.bg.png differ
diff --git a/translated_images/enemyShip.4fbf2889e6129db41989c4c74999ae81dd8d4dd994f1df01f720e923a5749a36.ro.png b/translated_images/enemyShip.4fbf2889e6129db41989c4c74999ae81dd8d4dd994f1df01f720e923a5749a36.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.4fbf2889e6129db41989c4c74999ae81dd8d4dd994f1df01f720e923a5749a36.ro.png differ
diff --git a/translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.bg.png b/translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.bg.png differ
diff --git a/translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.ro.png b/translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.ro.png differ
diff --git a/translated_images/enemyShip.62983ed4bfb2220fe28986c8c8c5e6f1528caf879a4290bddbf3550469374c5d.bg.png b/translated_images/enemyShip.62983ed4bfb2220fe28986c8c8c5e6f1528caf879a4290bddbf3550469374c5d.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.62983ed4bfb2220fe28986c8c8c5e6f1528caf879a4290bddbf3550469374c5d.bg.png differ
diff --git a/translated_images/enemyShip.62983ed4bfb2220fe28986c8c8c5e6f1528caf879a4290bddbf3550469374c5d.ro.png b/translated_images/enemyShip.62983ed4bfb2220fe28986c8c8c5e6f1528caf879a4290bddbf3550469374c5d.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.62983ed4bfb2220fe28986c8c8c5e6f1528caf879a4290bddbf3550469374c5d.ro.png differ
diff --git a/translated_images/enemyShip.add7036e1c3c30144d4500534897f937d962ffb178f6d7dbb536c2b19f05d3b7.bg.png b/translated_images/enemyShip.add7036e1c3c30144d4500534897f937d962ffb178f6d7dbb536c2b19f05d3b7.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.add7036e1c3c30144d4500534897f937d962ffb178f6d7dbb536c2b19f05d3b7.bg.png differ
diff --git a/translated_images/enemyShip.add7036e1c3c30144d4500534897f937d962ffb178f6d7dbb536c2b19f05d3b7.ro.png b/translated_images/enemyShip.add7036e1c3c30144d4500534897f937d962ffb178f6d7dbb536c2b19f05d3b7.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.add7036e1c3c30144d4500534897f937d962ffb178f6d7dbb536c2b19f05d3b7.ro.png differ
diff --git a/translated_images/enemyShip.b39a140287683bf7a409e00e19b41f29793c9dea0220e5d9fb174978fec357a2.bg.png b/translated_images/enemyShip.b39a140287683bf7a409e00e19b41f29793c9dea0220e5d9fb174978fec357a2.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.b39a140287683bf7a409e00e19b41f29793c9dea0220e5d9fb174978fec357a2.bg.png differ
diff --git a/translated_images/enemyShip.b39a140287683bf7a409e00e19b41f29793c9dea0220e5d9fb174978fec357a2.ro.png b/translated_images/enemyShip.b39a140287683bf7a409e00e19b41f29793c9dea0220e5d9fb174978fec357a2.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.b39a140287683bf7a409e00e19b41f29793c9dea0220e5d9fb174978fec357a2.ro.png differ
diff --git a/translated_images/enemyShip.b9626ed228a17a323a180f11f359f96848de1c9ee48d76702b49cd1cc3ef3821.bg.png b/translated_images/enemyShip.b9626ed228a17a323a180f11f359f96848de1c9ee48d76702b49cd1cc3ef3821.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.b9626ed228a17a323a180f11f359f96848de1c9ee48d76702b49cd1cc3ef3821.bg.png differ
diff --git a/translated_images/enemyShip.b9626ed228a17a323a180f11f359f96848de1c9ee48d76702b49cd1cc3ef3821.ro.png b/translated_images/enemyShip.b9626ed228a17a323a180f11f359f96848de1c9ee48d76702b49cd1cc3ef3821.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.b9626ed228a17a323a180f11f359f96848de1c9ee48d76702b49cd1cc3ef3821.ro.png differ
diff --git a/translated_images/enemyShip.deb0477a7312f54d5e9b3f707b02af3cfa2cafa04e1e9a3dd5818e6ab0244b2c.bg.png b/translated_images/enemyShip.deb0477a7312f54d5e9b3f707b02af3cfa2cafa04e1e9a3dd5818e6ab0244b2c.bg.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.deb0477a7312f54d5e9b3f707b02af3cfa2cafa04e1e9a3dd5818e6ab0244b2c.bg.png differ
diff --git a/translated_images/enemyShip.deb0477a7312f54d5e9b3f707b02af3cfa2cafa04e1e9a3dd5818e6ab0244b2c.ro.png b/translated_images/enemyShip.deb0477a7312f54d5e9b3f707b02af3cfa2cafa04e1e9a3dd5818e6ab0244b2c.ro.png
new file mode 100644
index 00000000..51122167
Binary files /dev/null and b/translated_images/enemyShip.deb0477a7312f54d5e9b3f707b02af3cfa2cafa04e1e9a3dd5818e6ab0244b2c.ro.png differ
diff --git a/translated_images/enemyUFO.bf8585e4e8dcdb68e03f67a534d870334c5db3557ad4f960027eac7782cf7ceb.bg.png b/translated_images/enemyUFO.bf8585e4e8dcdb68e03f67a534d870334c5db3557ad4f960027eac7782cf7ceb.bg.png
new file mode 100644
index 00000000..0431526a
Binary files /dev/null and b/translated_images/enemyUFO.bf8585e4e8dcdb68e03f67a534d870334c5db3557ad4f960027eac7782cf7ceb.bg.png differ
diff --git a/translated_images/enemyUFO.bf8585e4e8dcdb68e03f67a534d870334c5db3557ad4f960027eac7782cf7ceb.ro.png b/translated_images/enemyUFO.bf8585e4e8dcdb68e03f67a534d870334c5db3557ad4f960027eac7782cf7ceb.ro.png
new file mode 100644
index 00000000..0431526a
Binary files /dev/null and b/translated_images/enemyUFO.bf8585e4e8dcdb68e03f67a534d870334c5db3557ad4f960027eac7782cf7ceb.ro.png differ
diff --git a/translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.bg.png b/translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.bg.png
new file mode 100644
index 00000000..69b63456
Binary files /dev/null and b/translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.bg.png differ
diff --git a/translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.ro.png b/translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.ro.png
new file mode 100644
index 00000000..8280ec6a
Binary files /dev/null and b/translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.ro.png differ
diff --git a/translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png b/translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png
new file mode 100644
index 00000000..5a1d2c97
Binary files /dev/null and b/translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png differ
diff --git a/translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png b/translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png
new file mode 100644
index 00000000..bc3caf2c
Binary files /dev/null and b/translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png differ
diff --git a/translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.bg.png b/translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.bg.png
new file mode 100644
index 00000000..682d0a01
Binary files /dev/null and b/translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.bg.png differ
diff --git a/translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.ro.png b/translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.ro.png
new file mode 100644
index 00000000..39177b61
Binary files /dev/null and b/translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.ro.png differ
diff --git a/translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.bg.png b/translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.bg.png
new file mode 100644
index 00000000..efe713be
Binary files /dev/null and b/translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.bg.png differ
diff --git a/translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.ro.png b/translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.ro.png
new file mode 100644
index 00000000..b11a3d39
Binary files /dev/null and b/translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.ro.png differ
diff --git a/translated_images/favicon.37b561214b36d454f9fd1f725d77f310fe256eb88f2a0ae08b9cb18aeb30650c.bg.png b/translated_images/favicon.37b561214b36d454f9fd1f725d77f310fe256eb88f2a0ae08b9cb18aeb30650c.bg.png
new file mode 100644
index 00000000..26e0ae43
Binary files /dev/null and b/translated_images/favicon.37b561214b36d454f9fd1f725d77f310fe256eb88f2a0ae08b9cb18aeb30650c.bg.png differ
diff --git a/translated_images/favicon.37b561214b36d454f9fd1f725d77f310fe256eb88f2a0ae08b9cb18aeb30650c.ro.png b/translated_images/favicon.37b561214b36d454f9fd1f725d77f310fe256eb88f2a0ae08b9cb18aeb30650c.ro.png
new file mode 100644
index 00000000..26e0ae43
Binary files /dev/null and b/translated_images/favicon.37b561214b36d454f9fd1f725d77f310fe256eb88f2a0ae08b9cb18aeb30650c.ro.png differ
diff --git a/translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.bg.png b/translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.bg.png
new file mode 100644
index 00000000..2e3ff8fb
Binary files /dev/null and b/translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.bg.png differ
diff --git a/translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.ro.png b/translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.ro.png
new file mode 100644
index 00000000..00745747
Binary files /dev/null and b/translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.ro.png differ
diff --git a/translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.bg.png b/translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.bg.png
new file mode 100644
index 00000000..35c0c531
Binary files /dev/null and b/translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.bg.png differ
diff --git a/translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.ro.png b/translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.ro.png
new file mode 100644
index 00000000..ee9d1477
Binary files /dev/null and b/translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.ro.png differ
diff --git a/translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png b/translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png
new file mode 100644
index 00000000..97a02070
Binary files /dev/null and b/translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png differ
diff --git a/translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png b/translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png
new file mode 100644
index 00000000..a5c9df5b
Binary files /dev/null and b/translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png differ
diff --git a/translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.bg.png b/translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.bg.png
new file mode 100644
index 00000000..285e0f30
Binary files /dev/null and b/translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.bg.png differ
diff --git a/translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.ro.png b/translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.ro.png
new file mode 100644
index 00000000..48722353
Binary files /dev/null and b/translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.ro.png differ
diff --git a/translated_images/laserGreen.89904f0f499455604f204b641dfe992cb6f688d5b1c82a2227d1674af84c0b20.bg.png b/translated_images/laserGreen.89904f0f499455604f204b641dfe992cb6f688d5b1c82a2227d1674af84c0b20.bg.png
new file mode 100644
index 00000000..cfd373b4
Binary files /dev/null and b/translated_images/laserGreen.89904f0f499455604f204b641dfe992cb6f688d5b1c82a2227d1674af84c0b20.bg.png differ
diff --git a/translated_images/laserGreen.89904f0f499455604f204b641dfe992cb6f688d5b1c82a2227d1674af84c0b20.ro.png b/translated_images/laserGreen.89904f0f499455604f204b641dfe992cb6f688d5b1c82a2227d1674af84c0b20.ro.png
new file mode 100644
index 00000000..cfd373b4
Binary files /dev/null and b/translated_images/laserGreen.89904f0f499455604f204b641dfe992cb6f688d5b1c82a2227d1674af84c0b20.ro.png differ
diff --git a/translated_images/laserGreenShot.e4fbfc4714c08a5b1a3e94429dde0e5ad4f010c25f0d0b6c321aea62014ed203.bg.png b/translated_images/laserGreenShot.e4fbfc4714c08a5b1a3e94429dde0e5ad4f010c25f0d0b6c321aea62014ed203.bg.png
new file mode 100644
index 00000000..816fdf33
Binary files /dev/null and b/translated_images/laserGreenShot.e4fbfc4714c08a5b1a3e94429dde0e5ad4f010c25f0d0b6c321aea62014ed203.bg.png differ
diff --git a/translated_images/laserGreenShot.e4fbfc4714c08a5b1a3e94429dde0e5ad4f010c25f0d0b6c321aea62014ed203.ro.png b/translated_images/laserGreenShot.e4fbfc4714c08a5b1a3e94429dde0e5ad4f010c25f0d0b6c321aea62014ed203.ro.png
new file mode 100644
index 00000000..816fdf33
Binary files /dev/null and b/translated_images/laserGreenShot.e4fbfc4714c08a5b1a3e94429dde0e5ad4f010c25f0d0b6c321aea62014ed203.ro.png differ
diff --git a/translated_images/laserRed.2040e11f55c0a40a9800af7a11247676b4969e6c87e697f29589f605a0192b05.bg.png b/translated_images/laserRed.2040e11f55c0a40a9800af7a11247676b4969e6c87e697f29589f605a0192b05.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.2040e11f55c0a40a9800af7a11247676b4969e6c87e697f29589f605a0192b05.bg.png differ
diff --git a/translated_images/laserRed.2040e11f55c0a40a9800af7a11247676b4969e6c87e697f29589f605a0192b05.ro.png b/translated_images/laserRed.2040e11f55c0a40a9800af7a11247676b4969e6c87e697f29589f605a0192b05.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.2040e11f55c0a40a9800af7a11247676b4969e6c87e697f29589f605a0192b05.ro.png differ
diff --git a/translated_images/laserRed.381bc5555491ce677eedc34e728c7c4f5676ce6c74db68d8a4d82fde952cb8fb.bg.png b/translated_images/laserRed.381bc5555491ce677eedc34e728c7c4f5676ce6c74db68d8a4d82fde952cb8fb.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.381bc5555491ce677eedc34e728c7c4f5676ce6c74db68d8a4d82fde952cb8fb.bg.png differ
diff --git a/translated_images/laserRed.381bc5555491ce677eedc34e728c7c4f5676ce6c74db68d8a4d82fde952cb8fb.ro.png b/translated_images/laserRed.381bc5555491ce677eedc34e728c7c4f5676ce6c74db68d8a4d82fde952cb8fb.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.381bc5555491ce677eedc34e728c7c4f5676ce6c74db68d8a4d82fde952cb8fb.ro.png differ
diff --git a/translated_images/laserRed.69730edd76f0b3bd5a45ae075c3dd1a064017020ddff4b4c3f007c21d9a62ebc.bg.png b/translated_images/laserRed.69730edd76f0b3bd5a45ae075c3dd1a064017020ddff4b4c3f007c21d9a62ebc.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.69730edd76f0b3bd5a45ae075c3dd1a064017020ddff4b4c3f007c21d9a62ebc.bg.png differ
diff --git a/translated_images/laserRed.69730edd76f0b3bd5a45ae075c3dd1a064017020ddff4b4c3f007c21d9a62ebc.ro.png b/translated_images/laserRed.69730edd76f0b3bd5a45ae075c3dd1a064017020ddff4b4c3f007c21d9a62ebc.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.69730edd76f0b3bd5a45ae075c3dd1a064017020ddff4b4c3f007c21d9a62ebc.ro.png differ
diff --git a/translated_images/laserRed.b583dc1728eb8581da951a0ec74c42cf06cf6903e9b939c71baaf04ef1a60f90.bg.png b/translated_images/laserRed.b583dc1728eb8581da951a0ec74c42cf06cf6903e9b939c71baaf04ef1a60f90.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.b583dc1728eb8581da951a0ec74c42cf06cf6903e9b939c71baaf04ef1a60f90.bg.png differ
diff --git a/translated_images/laserRed.b583dc1728eb8581da951a0ec74c42cf06cf6903e9b939c71baaf04ef1a60f90.ro.png b/translated_images/laserRed.b583dc1728eb8581da951a0ec74c42cf06cf6903e9b939c71baaf04ef1a60f90.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.b583dc1728eb8581da951a0ec74c42cf06cf6903e9b939c71baaf04ef1a60f90.ro.png differ
diff --git a/translated_images/laserRed.cae9ab24ea9b18fd5fde4b22153f4d71291a363bd611de8108bc6a40cecefe24.bg.png b/translated_images/laserRed.cae9ab24ea9b18fd5fde4b22153f4d71291a363bd611de8108bc6a40cecefe24.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.cae9ab24ea9b18fd5fde4b22153f4d71291a363bd611de8108bc6a40cecefe24.bg.png differ
diff --git a/translated_images/laserRed.cae9ab24ea9b18fd5fde4b22153f4d71291a363bd611de8108bc6a40cecefe24.ro.png b/translated_images/laserRed.cae9ab24ea9b18fd5fde4b22153f4d71291a363bd611de8108bc6a40cecefe24.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.cae9ab24ea9b18fd5fde4b22153f4d71291a363bd611de8108bc6a40cecefe24.ro.png differ
diff --git a/translated_images/laserRed.d81ce4986f87c251d4fd93a2fcfb8215c90684ad71d59de7bb0c2561a8e76d56.bg.png b/translated_images/laserRed.d81ce4986f87c251d4fd93a2fcfb8215c90684ad71d59de7bb0c2561a8e76d56.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.d81ce4986f87c251d4fd93a2fcfb8215c90684ad71d59de7bb0c2561a8e76d56.bg.png differ
diff --git a/translated_images/laserRed.d81ce4986f87c251d4fd93a2fcfb8215c90684ad71d59de7bb0c2561a8e76d56.ro.png b/translated_images/laserRed.d81ce4986f87c251d4fd93a2fcfb8215c90684ad71d59de7bb0c2561a8e76d56.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.d81ce4986f87c251d4fd93a2fcfb8215c90684ad71d59de7bb0c2561a8e76d56.ro.png differ
diff --git a/translated_images/laserRed.e58ef8db2585dfbe451c9f46f4190d75f555479ddc24e2b75be28fe3a2894f24.bg.png b/translated_images/laserRed.e58ef8db2585dfbe451c9f46f4190d75f555479ddc24e2b75be28fe3a2894f24.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.e58ef8db2585dfbe451c9f46f4190d75f555479ddc24e2b75be28fe3a2894f24.bg.png differ
diff --git a/translated_images/laserRed.e58ef8db2585dfbe451c9f46f4190d75f555479ddc24e2b75be28fe3a2894f24.ro.png b/translated_images/laserRed.e58ef8db2585dfbe451c9f46f4190d75f555479ddc24e2b75be28fe3a2894f24.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.e58ef8db2585dfbe451c9f46f4190d75f555479ddc24e2b75be28fe3a2894f24.ro.png differ
diff --git a/translated_images/laserRed.e66e29ace6666064cf451ce990d73b779028e21542cded84ecad88577353aad1.bg.png b/translated_images/laserRed.e66e29ace6666064cf451ce990d73b779028e21542cded84ecad88577353aad1.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.e66e29ace6666064cf451ce990d73b779028e21542cded84ecad88577353aad1.bg.png differ
diff --git a/translated_images/laserRed.e66e29ace6666064cf451ce990d73b779028e21542cded84ecad88577353aad1.ro.png b/translated_images/laserRed.e66e29ace6666064cf451ce990d73b779028e21542cded84ecad88577353aad1.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.e66e29ace6666064cf451ce990d73b779028e21542cded84ecad88577353aad1.ro.png differ
diff --git a/translated_images/laserRed.e86e8fb629c6026e20cc7e8507f8a1f2fc82cc355117c721eb08ac67c40d3e6a.bg.png b/translated_images/laserRed.e86e8fb629c6026e20cc7e8507f8a1f2fc82cc355117c721eb08ac67c40d3e6a.bg.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.e86e8fb629c6026e20cc7e8507f8a1f2fc82cc355117c721eb08ac67c40d3e6a.bg.png differ
diff --git a/translated_images/laserRed.e86e8fb629c6026e20cc7e8507f8a1f2fc82cc355117c721eb08ac67c40d3e6a.ro.png b/translated_images/laserRed.e86e8fb629c6026e20cc7e8507f8a1f2fc82cc355117c721eb08ac67c40d3e6a.ro.png
new file mode 100644
index 00000000..9b6c5f9b
Binary files /dev/null and b/translated_images/laserRed.e86e8fb629c6026e20cc7e8507f8a1f2fc82cc355117c721eb08ac67c40d3e6a.ro.png differ
diff --git a/translated_images/laserRedShot.c39d066745996a71e5ffb0eeec4eff60fede6dc7fb65bdf8ef8b64193fda04c9.bg.png b/translated_images/laserRedShot.c39d066745996a71e5ffb0eeec4eff60fede6dc7fb65bdf8ef8b64193fda04c9.bg.png
new file mode 100644
index 00000000..28ecda5b
Binary files /dev/null and b/translated_images/laserRedShot.c39d066745996a71e5ffb0eeec4eff60fede6dc7fb65bdf8ef8b64193fda04c9.bg.png differ
diff --git a/translated_images/laserRedShot.c39d066745996a71e5ffb0eeec4eff60fede6dc7fb65bdf8ef8b64193fda04c9.ro.png b/translated_images/laserRedShot.c39d066745996a71e5ffb0eeec4eff60fede6dc7fb65bdf8ef8b64193fda04c9.ro.png
new file mode 100644
index 00000000..28ecda5b
Binary files /dev/null and b/translated_images/laserRedShot.c39d066745996a71e5ffb0eeec4eff60fede6dc7fb65bdf8ef8b64193fda04c9.ro.png differ
diff --git a/translated_images/life.27144b6d4bfdea76e9613184ff89c93d44888d2c9068a8599553a4306cd539ea.bg.png b/translated_images/life.27144b6d4bfdea76e9613184ff89c93d44888d2c9068a8599553a4306cd539ea.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.27144b6d4bfdea76e9613184ff89c93d44888d2c9068a8599553a4306cd539ea.bg.png differ
diff --git a/translated_images/life.27144b6d4bfdea76e9613184ff89c93d44888d2c9068a8599553a4306cd539ea.ro.png b/translated_images/life.27144b6d4bfdea76e9613184ff89c93d44888d2c9068a8599553a4306cd539ea.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.27144b6d4bfdea76e9613184ff89c93d44888d2c9068a8599553a4306cd539ea.ro.png differ
diff --git a/translated_images/life.2a159298dd98f4efde6d8b2792eaff08d6944f39e57dbfa65b0b3d7f27addf7e.bg.png b/translated_images/life.2a159298dd98f4efde6d8b2792eaff08d6944f39e57dbfa65b0b3d7f27addf7e.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.2a159298dd98f4efde6d8b2792eaff08d6944f39e57dbfa65b0b3d7f27addf7e.bg.png differ
diff --git a/translated_images/life.2a159298dd98f4efde6d8b2792eaff08d6944f39e57dbfa65b0b3d7f27addf7e.ro.png b/translated_images/life.2a159298dd98f4efde6d8b2792eaff08d6944f39e57dbfa65b0b3d7f27addf7e.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.2a159298dd98f4efde6d8b2792eaff08d6944f39e57dbfa65b0b3d7f27addf7e.ro.png differ
diff --git a/translated_images/life.466df3b1692a244ad9189538ae5184e6bb43165d7c3172f66b5a60790a1541cc.bg.png b/translated_images/life.466df3b1692a244ad9189538ae5184e6bb43165d7c3172f66b5a60790a1541cc.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.466df3b1692a244ad9189538ae5184e6bb43165d7c3172f66b5a60790a1541cc.bg.png differ
diff --git a/translated_images/life.466df3b1692a244ad9189538ae5184e6bb43165d7c3172f66b5a60790a1541cc.ro.png b/translated_images/life.466df3b1692a244ad9189538ae5184e6bb43165d7c3172f66b5a60790a1541cc.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.466df3b1692a244ad9189538ae5184e6bb43165d7c3172f66b5a60790a1541cc.ro.png differ
diff --git a/translated_images/life.65a2aaceca87528424e6e93a36e953b58d4facfefbfd42dc4d6ad2db43076018.bg.png b/translated_images/life.65a2aaceca87528424e6e93a36e953b58d4facfefbfd42dc4d6ad2db43076018.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.65a2aaceca87528424e6e93a36e953b58d4facfefbfd42dc4d6ad2db43076018.bg.png differ
diff --git a/translated_images/life.65a2aaceca87528424e6e93a36e953b58d4facfefbfd42dc4d6ad2db43076018.ro.png b/translated_images/life.65a2aaceca87528424e6e93a36e953b58d4facfefbfd42dc4d6ad2db43076018.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.65a2aaceca87528424e6e93a36e953b58d4facfefbfd42dc4d6ad2db43076018.ro.png differ
diff --git a/translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.bg.png b/translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.bg.png differ
diff --git a/translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.ro.png b/translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.ro.png differ
diff --git a/translated_images/life.78b6e96a3003767e113e7d6fbb5d57fc59245a92579256c08af23c93f2e2b0a3.bg.png b/translated_images/life.78b6e96a3003767e113e7d6fbb5d57fc59245a92579256c08af23c93f2e2b0a3.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.78b6e96a3003767e113e7d6fbb5d57fc59245a92579256c08af23c93f2e2b0a3.bg.png differ
diff --git a/translated_images/life.78b6e96a3003767e113e7d6fbb5d57fc59245a92579256c08af23c93f2e2b0a3.ro.png b/translated_images/life.78b6e96a3003767e113e7d6fbb5d57fc59245a92579256c08af23c93f2e2b0a3.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.78b6e96a3003767e113e7d6fbb5d57fc59245a92579256c08af23c93f2e2b0a3.ro.png differ
diff --git a/translated_images/life.86d843ce9c23289c0094eff7154a7b6d3cada290b7db733424ee1c68864143c5.bg.png b/translated_images/life.86d843ce9c23289c0094eff7154a7b6d3cada290b7db733424ee1c68864143c5.bg.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.86d843ce9c23289c0094eff7154a7b6d3cada290b7db733424ee1c68864143c5.bg.png differ
diff --git a/translated_images/life.86d843ce9c23289c0094eff7154a7b6d3cada290b7db733424ee1c68864143c5.ro.png b/translated_images/life.86d843ce9c23289c0094eff7154a7b6d3cada290b7db733424ee1c68864143c5.ro.png
new file mode 100644
index 00000000..3487f796
Binary files /dev/null and b/translated_images/life.86d843ce9c23289c0094eff7154a7b6d3cada290b7db733424ee1c68864143c5.ro.png differ
diff --git a/translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.bg.png b/translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.bg.png
new file mode 100644
index 00000000..da918260
Binary files /dev/null and b/translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.bg.png differ
diff --git a/translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.ro.png b/translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.ro.png
new file mode 100644
index 00000000..a53bceee
Binary files /dev/null and b/translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.ro.png differ
diff --git a/translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.bg.png b/translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.bg.png
new file mode 100644
index 00000000..fbc31a37
Binary files /dev/null and b/translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.bg.png differ
diff --git a/translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.ro.png b/translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.ro.png
new file mode 100644
index 00000000..4371c4fc
Binary files /dev/null and b/translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.ro.png differ
diff --git a/translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.bg.png b/translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.bg.png
new file mode 100644
index 00000000..c75ad6f9
Binary files /dev/null and b/translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.bg.png differ
diff --git a/translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.ro.png b/translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.ro.png
new file mode 100644
index 00000000..ce8890f4
Binary files /dev/null and b/translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.ro.png differ
diff --git a/translated_images/meteorBig.1e452b3ad7af50adaafcbe25c82b2758be31cdff66d6b417b79f5453bf9ad3e0.bg.png b/translated_images/meteorBig.1e452b3ad7af50adaafcbe25c82b2758be31cdff66d6b417b79f5453bf9ad3e0.bg.png
new file mode 100644
index 00000000..b3cd5407
Binary files /dev/null and b/translated_images/meteorBig.1e452b3ad7af50adaafcbe25c82b2758be31cdff66d6b417b79f5453bf9ad3e0.bg.png differ
diff --git a/translated_images/meteorBig.1e452b3ad7af50adaafcbe25c82b2758be31cdff66d6b417b79f5453bf9ad3e0.ro.png b/translated_images/meteorBig.1e452b3ad7af50adaafcbe25c82b2758be31cdff66d6b417b79f5453bf9ad3e0.ro.png
new file mode 100644
index 00000000..b3cd5407
Binary files /dev/null and b/translated_images/meteorBig.1e452b3ad7af50adaafcbe25c82b2758be31cdff66d6b417b79f5453bf9ad3e0.ro.png differ
diff --git a/translated_images/meteorSmall.0d729bc71c12d41f26f077dfbecaccb9016e21e11dac7966e4f2de825e5de3b6.bg.png b/translated_images/meteorSmall.0d729bc71c12d41f26f077dfbecaccb9016e21e11dac7966e4f2de825e5de3b6.bg.png
new file mode 100644
index 00000000..a61e0e28
Binary files /dev/null and b/translated_images/meteorSmall.0d729bc71c12d41f26f077dfbecaccb9016e21e11dac7966e4f2de825e5de3b6.bg.png differ
diff --git a/translated_images/meteorSmall.0d729bc71c12d41f26f077dfbecaccb9016e21e11dac7966e4f2de825e5de3b6.ro.png b/translated_images/meteorSmall.0d729bc71c12d41f26f077dfbecaccb9016e21e11dac7966e4f2de825e5de3b6.ro.png
new file mode 100644
index 00000000..a61e0e28
Binary files /dev/null and b/translated_images/meteorSmall.0d729bc71c12d41f26f077dfbecaccb9016e21e11dac7966e4f2de825e5de3b6.ro.png differ
diff --git a/translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.bg.png b/translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.bg.png
new file mode 100644
index 00000000..af725df5
Binary files /dev/null and b/translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.bg.png differ
diff --git a/translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.ro.png b/translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.ro.png
new file mode 100644
index 00000000..68564cd8
Binary files /dev/null and b/translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.ro.png differ
diff --git a/translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.bg.png b/translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.bg.png
new file mode 100644
index 00000000..b60a6bfa
Binary files /dev/null and b/translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.bg.png differ
diff --git a/translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.ro.png b/translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.ro.png
new file mode 100644
index 00000000..690403ee
Binary files /dev/null and b/translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.ro.png differ
diff --git a/translated_images/nebula.55c2933d36d035d359ef8d8422e7a7f260b3f6d15c026a18472bf8e71185d59c.bg.png b/translated_images/nebula.55c2933d36d035d359ef8d8422e7a7f260b3f6d15c026a18472bf8e71185d59c.bg.png
new file mode 100644
index 00000000..75523088
Binary files /dev/null and b/translated_images/nebula.55c2933d36d035d359ef8d8422e7a7f260b3f6d15c026a18472bf8e71185d59c.bg.png differ
diff --git a/translated_images/nebula.55c2933d36d035d359ef8d8422e7a7f260b3f6d15c026a18472bf8e71185d59c.ro.png b/translated_images/nebula.55c2933d36d035d359ef8d8422e7a7f260b3f6d15c026a18472bf8e71185d59c.ro.png
new file mode 100644
index 00000000..75523088
Binary files /dev/null and b/translated_images/nebula.55c2933d36d035d359ef8d8422e7a7f260b3f6d15c026a18472bf8e71185d59c.ro.png differ
diff --git a/translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.bg.png b/translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.bg.png
new file mode 100644
index 00000000..45f8c82f
Binary files /dev/null and b/translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.bg.png differ
diff --git a/translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.ro.png b/translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.ro.png
new file mode 100644
index 00000000..68c1f4ed
Binary files /dev/null and b/translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.ro.png differ
diff --git a/translated_images/open-palette-menu.46dda01084738da84fc55100956fcc915f33e9de8c19813148ac3b1803871cff.bg.png b/translated_images/open-palette-menu.46dda01084738da84fc55100956fcc915f33e9de8c19813148ac3b1803871cff.bg.png
new file mode 100644
index 00000000..3fe15272
Binary files /dev/null and b/translated_images/open-palette-menu.46dda01084738da84fc55100956fcc915f33e9de8c19813148ac3b1803871cff.bg.png differ
diff --git a/translated_images/open-palette-menu.46dda01084738da84fc55100956fcc915f33e9de8c19813148ac3b1803871cff.ro.png b/translated_images/open-palette-menu.46dda01084738da84fc55100956fcc915f33e9de8c19813148ac3b1803871cff.ro.png
new file mode 100644
index 00000000..236282c6
Binary files /dev/null and b/translated_images/open-palette-menu.46dda01084738da84fc55100956fcc915f33e9de8c19813148ac3b1803871cff.ro.png differ
diff --git a/translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.bg.png b/translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.bg.png
new file mode 100644
index 00000000..88c20b95
Binary files /dev/null and b/translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.bg.png differ
diff --git a/translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.ro.png b/translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.ro.png
new file mode 100644
index 00000000..78c4e859
Binary files /dev/null and b/translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.ro.png differ
diff --git a/translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.bg.png b/translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.bg.png
new file mode 100644
index 00000000..ae914693
Binary files /dev/null and b/translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.bg.png differ
diff --git a/translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.ro.png b/translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.ro.png
new file mode 100644
index 00000000..36887cd1
Binary files /dev/null and b/translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.ro.png differ
diff --git a/translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.bg.png b/translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.bg.png
new file mode 100644
index 00000000..88783500
Binary files /dev/null and b/translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.bg.png differ
diff --git a/translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.ro.png b/translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.ro.png
new file mode 100644
index 00000000..88783500
Binary files /dev/null and b/translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.ro.png differ
diff --git a/translated_images/plant1.a876180d8659acb9a51f95b2466b207b95dec201fafa23efcd4137fb62d0acb1.bg.png b/translated_images/plant1.a876180d8659acb9a51f95b2466b207b95dec201fafa23efcd4137fb62d0acb1.bg.png
new file mode 100644
index 00000000..0632233d
Binary files /dev/null and b/translated_images/plant1.a876180d8659acb9a51f95b2466b207b95dec201fafa23efcd4137fb62d0acb1.bg.png differ
diff --git a/translated_images/plant1.a876180d8659acb9a51f95b2466b207b95dec201fafa23efcd4137fb62d0acb1.ro.png b/translated_images/plant1.a876180d8659acb9a51f95b2466b207b95dec201fafa23efcd4137fb62d0acb1.ro.png
new file mode 100644
index 00000000..0632233d
Binary files /dev/null and b/translated_images/plant1.a876180d8659acb9a51f95b2466b207b95dec201fafa23efcd4137fb62d0acb1.ro.png differ
diff --git a/translated_images/plant10.2f2c47804ae52dd3550b3f97782a76629d5819bba30e8a8b79933a9ccde606d4.bg.png b/translated_images/plant10.2f2c47804ae52dd3550b3f97782a76629d5819bba30e8a8b79933a9ccde606d4.bg.png
new file mode 100644
index 00000000..209ee5d2
Binary files /dev/null and b/translated_images/plant10.2f2c47804ae52dd3550b3f97782a76629d5819bba30e8a8b79933a9ccde606d4.bg.png differ
diff --git a/translated_images/plant10.2f2c47804ae52dd3550b3f97782a76629d5819bba30e8a8b79933a9ccde606d4.ro.png b/translated_images/plant10.2f2c47804ae52dd3550b3f97782a76629d5819bba30e8a8b79933a9ccde606d4.ro.png
new file mode 100644
index 00000000..209ee5d2
Binary files /dev/null and b/translated_images/plant10.2f2c47804ae52dd3550b3f97782a76629d5819bba30e8a8b79933a9ccde606d4.ro.png differ
diff --git a/translated_images/plant11.0ce0081b0ef17aa1793cc5fe6d7de6f8cf7f8cfb24933c3c457386194fc10e77.bg.png b/translated_images/plant11.0ce0081b0ef17aa1793cc5fe6d7de6f8cf7f8cfb24933c3c457386194fc10e77.bg.png
new file mode 100644
index 00000000..201bec9e
Binary files /dev/null and b/translated_images/plant11.0ce0081b0ef17aa1793cc5fe6d7de6f8cf7f8cfb24933c3c457386194fc10e77.bg.png differ
diff --git a/translated_images/plant11.0ce0081b0ef17aa1793cc5fe6d7de6f8cf7f8cfb24933c3c457386194fc10e77.ro.png b/translated_images/plant11.0ce0081b0ef17aa1793cc5fe6d7de6f8cf7f8cfb24933c3c457386194fc10e77.ro.png
new file mode 100644
index 00000000..201bec9e
Binary files /dev/null and b/translated_images/plant11.0ce0081b0ef17aa1793cc5fe6d7de6f8cf7f8cfb24933c3c457386194fc10e77.ro.png differ
diff --git a/translated_images/plant12.6b934c4312a00228719509ac56cd568ec45672bfdcc732bac7f42391035d606c.bg.png b/translated_images/plant12.6b934c4312a00228719509ac56cd568ec45672bfdcc732bac7f42391035d606c.bg.png
new file mode 100644
index 00000000..593e1573
Binary files /dev/null and b/translated_images/plant12.6b934c4312a00228719509ac56cd568ec45672bfdcc732bac7f42391035d606c.bg.png differ
diff --git a/translated_images/plant12.6b934c4312a00228719509ac56cd568ec45672bfdcc732bac7f42391035d606c.ro.png b/translated_images/plant12.6b934c4312a00228719509ac56cd568ec45672bfdcc732bac7f42391035d606c.ro.png
new file mode 100644
index 00000000..593e1573
Binary files /dev/null and b/translated_images/plant12.6b934c4312a00228719509ac56cd568ec45672bfdcc732bac7f42391035d606c.ro.png differ
diff --git a/translated_images/plant13.37d6ab2e2481421f0611f07685309cc07fe42d63e6abbaa963f972dbff7d176d.bg.png b/translated_images/plant13.37d6ab2e2481421f0611f07685309cc07fe42d63e6abbaa963f972dbff7d176d.bg.png
new file mode 100644
index 00000000..0f69b814
Binary files /dev/null and b/translated_images/plant13.37d6ab2e2481421f0611f07685309cc07fe42d63e6abbaa963f972dbff7d176d.bg.png differ
diff --git a/translated_images/plant13.37d6ab2e2481421f0611f07685309cc07fe42d63e6abbaa963f972dbff7d176d.ro.png b/translated_images/plant13.37d6ab2e2481421f0611f07685309cc07fe42d63e6abbaa963f972dbff7d176d.ro.png
new file mode 100644
index 00000000..0f69b814
Binary files /dev/null and b/translated_images/plant13.37d6ab2e2481421f0611f07685309cc07fe42d63e6abbaa963f972dbff7d176d.ro.png differ
diff --git a/translated_images/plant14.908791477a46eb7f40a85155f53861fa5734be5075443b5c19f78e758f64d286.bg.png b/translated_images/plant14.908791477a46eb7f40a85155f53861fa5734be5075443b5c19f78e758f64d286.bg.png
new file mode 100644
index 00000000..221277ef
Binary files /dev/null and b/translated_images/plant14.908791477a46eb7f40a85155f53861fa5734be5075443b5c19f78e758f64d286.bg.png differ
diff --git a/translated_images/plant14.908791477a46eb7f40a85155f53861fa5734be5075443b5c19f78e758f64d286.ro.png b/translated_images/plant14.908791477a46eb7f40a85155f53861fa5734be5075443b5c19f78e758f64d286.ro.png
new file mode 100644
index 00000000..221277ef
Binary files /dev/null and b/translated_images/plant14.908791477a46eb7f40a85155f53861fa5734be5075443b5c19f78e758f64d286.ro.png differ
diff --git a/translated_images/plant2.9e45efea224115b077fade85ce6871246bf85de20f419c57faed6b78e9ac7fcd.bg.png b/translated_images/plant2.9e45efea224115b077fade85ce6871246bf85de20f419c57faed6b78e9ac7fcd.bg.png
new file mode 100644
index 00000000..331ca68d
Binary files /dev/null and b/translated_images/plant2.9e45efea224115b077fade85ce6871246bf85de20f419c57faed6b78e9ac7fcd.bg.png differ
diff --git a/translated_images/plant2.9e45efea224115b077fade85ce6871246bf85de20f419c57faed6b78e9ac7fcd.ro.png b/translated_images/plant2.9e45efea224115b077fade85ce6871246bf85de20f419c57faed6b78e9ac7fcd.ro.png
new file mode 100644
index 00000000..331ca68d
Binary files /dev/null and b/translated_images/plant2.9e45efea224115b077fade85ce6871246bf85de20f419c57faed6b78e9ac7fcd.ro.png differ
diff --git a/translated_images/plant3.06efdd0fa0c4b1152034312e11765b1a8fad48ebc00b72a3e7df657f66f45449.bg.png b/translated_images/plant3.06efdd0fa0c4b1152034312e11765b1a8fad48ebc00b72a3e7df657f66f45449.bg.png
new file mode 100644
index 00000000..d94bd097
Binary files /dev/null and b/translated_images/plant3.06efdd0fa0c4b1152034312e11765b1a8fad48ebc00b72a3e7df657f66f45449.bg.png differ
diff --git a/translated_images/plant3.06efdd0fa0c4b1152034312e11765b1a8fad48ebc00b72a3e7df657f66f45449.ro.png b/translated_images/plant3.06efdd0fa0c4b1152034312e11765b1a8fad48ebc00b72a3e7df657f66f45449.ro.png
new file mode 100644
index 00000000..d94bd097
Binary files /dev/null and b/translated_images/plant3.06efdd0fa0c4b1152034312e11765b1a8fad48ebc00b72a3e7df657f66f45449.ro.png differ
diff --git a/translated_images/plant4.3b78072b427727c6e6eb08eefc8451b248577412dd025002cefb707238e8bf46.bg.png b/translated_images/plant4.3b78072b427727c6e6eb08eefc8451b248577412dd025002cefb707238e8bf46.bg.png
new file mode 100644
index 00000000..c60f756c
Binary files /dev/null and b/translated_images/plant4.3b78072b427727c6e6eb08eefc8451b248577412dd025002cefb707238e8bf46.bg.png differ
diff --git a/translated_images/plant4.3b78072b427727c6e6eb08eefc8451b248577412dd025002cefb707238e8bf46.ro.png b/translated_images/plant4.3b78072b427727c6e6eb08eefc8451b248577412dd025002cefb707238e8bf46.ro.png
new file mode 100644
index 00000000..c60f756c
Binary files /dev/null and b/translated_images/plant4.3b78072b427727c6e6eb08eefc8451b248577412dd025002cefb707238e8bf46.ro.png differ
diff --git a/translated_images/plant5.8ec58b18ac336fa8ec87ce1d5b433ee58c4918e67fdf0315d5407d80cbd97569.bg.png b/translated_images/plant5.8ec58b18ac336fa8ec87ce1d5b433ee58c4918e67fdf0315d5407d80cbd97569.bg.png
new file mode 100644
index 00000000..f2fe32fb
Binary files /dev/null and b/translated_images/plant5.8ec58b18ac336fa8ec87ce1d5b433ee58c4918e67fdf0315d5407d80cbd97569.bg.png differ
diff --git a/translated_images/plant5.8ec58b18ac336fa8ec87ce1d5b433ee58c4918e67fdf0315d5407d80cbd97569.ro.png b/translated_images/plant5.8ec58b18ac336fa8ec87ce1d5b433ee58c4918e67fdf0315d5407d80cbd97569.ro.png
new file mode 100644
index 00000000..f2fe32fb
Binary files /dev/null and b/translated_images/plant5.8ec58b18ac336fa8ec87ce1d5b433ee58c4918e67fdf0315d5407d80cbd97569.ro.png differ
diff --git a/translated_images/plant6.ca4ff8372e6676b1ffed650fba21cb2af52c70df969a8203e57fb5bedd81e9f0.bg.png b/translated_images/plant6.ca4ff8372e6676b1ffed650fba21cb2af52c70df969a8203e57fb5bedd81e9f0.bg.png
new file mode 100644
index 00000000..82e0db0d
Binary files /dev/null and b/translated_images/plant6.ca4ff8372e6676b1ffed650fba21cb2af52c70df969a8203e57fb5bedd81e9f0.bg.png differ
diff --git a/translated_images/plant6.ca4ff8372e6676b1ffed650fba21cb2af52c70df969a8203e57fb5bedd81e9f0.ro.png b/translated_images/plant6.ca4ff8372e6676b1ffed650fba21cb2af52c70df969a8203e57fb5bedd81e9f0.ro.png
new file mode 100644
index 00000000..82e0db0d
Binary files /dev/null and b/translated_images/plant6.ca4ff8372e6676b1ffed650fba21cb2af52c70df969a8203e57fb5bedd81e9f0.ro.png differ
diff --git a/translated_images/plant7.194d5a42fcf5a88c5dd4960c68e6f78707acdb4e21bf533a6a65f8d002ab660b.bg.png b/translated_images/plant7.194d5a42fcf5a88c5dd4960c68e6f78707acdb4e21bf533a6a65f8d002ab660b.bg.png
new file mode 100644
index 00000000..07cb7054
Binary files /dev/null and b/translated_images/plant7.194d5a42fcf5a88c5dd4960c68e6f78707acdb4e21bf533a6a65f8d002ab660b.bg.png differ
diff --git a/translated_images/plant7.194d5a42fcf5a88c5dd4960c68e6f78707acdb4e21bf533a6a65f8d002ab660b.ro.png b/translated_images/plant7.194d5a42fcf5a88c5dd4960c68e6f78707acdb4e21bf533a6a65f8d002ab660b.ro.png
new file mode 100644
index 00000000..07cb7054
Binary files /dev/null and b/translated_images/plant7.194d5a42fcf5a88c5dd4960c68e6f78707acdb4e21bf533a6a65f8d002ab660b.ro.png differ
diff --git a/translated_images/plant8.7b247809ab0eb492105cac4f42b79ac771ce56e401fdf3df170b3b6ef03c5642.bg.png b/translated_images/plant8.7b247809ab0eb492105cac4f42b79ac771ce56e401fdf3df170b3b6ef03c5642.bg.png
new file mode 100644
index 00000000..a0d261a9
Binary files /dev/null and b/translated_images/plant8.7b247809ab0eb492105cac4f42b79ac771ce56e401fdf3df170b3b6ef03c5642.bg.png differ
diff --git a/translated_images/plant8.7b247809ab0eb492105cac4f42b79ac771ce56e401fdf3df170b3b6ef03c5642.ro.png b/translated_images/plant8.7b247809ab0eb492105cac4f42b79ac771ce56e401fdf3df170b3b6ef03c5642.ro.png
new file mode 100644
index 00000000..a0d261a9
Binary files /dev/null and b/translated_images/plant8.7b247809ab0eb492105cac4f42b79ac771ce56e401fdf3df170b3b6ef03c5642.ro.png differ
diff --git a/translated_images/plant9.8fe614c01ded1b1ec05d1b4d6d527047b1ece5edba299c1c516aaf4b05eb19ed.bg.png b/translated_images/plant9.8fe614c01ded1b1ec05d1b4d6d527047b1ece5edba299c1c516aaf4b05eb19ed.bg.png
new file mode 100644
index 00000000..bc09a050
Binary files /dev/null and b/translated_images/plant9.8fe614c01ded1b1ec05d1b4d6d527047b1ece5edba299c1c516aaf4b05eb19ed.bg.png differ
diff --git a/translated_images/plant9.8fe614c01ded1b1ec05d1b4d6d527047b1ece5edba299c1c516aaf4b05eb19ed.ro.png b/translated_images/plant9.8fe614c01ded1b1ec05d1b4d6d527047b1ece5edba299c1c516aaf4b05eb19ed.ro.png
new file mode 100644
index 00000000..bc09a050
Binary files /dev/null and b/translated_images/plant9.8fe614c01ded1b1ec05d1b4d6d527047b1ece5edba299c1c516aaf4b05eb19ed.ro.png differ
diff --git a/translated_images/player.137ee0e47f895ffcdb50ba1b316936715ec8decfd6cee3258332a6c60e5d0d04.bg.png b/translated_images/player.137ee0e47f895ffcdb50ba1b316936715ec8decfd6cee3258332a6c60e5d0d04.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.137ee0e47f895ffcdb50ba1b316936715ec8decfd6cee3258332a6c60e5d0d04.bg.png differ
diff --git a/translated_images/player.137ee0e47f895ffcdb50ba1b316936715ec8decfd6cee3258332a6c60e5d0d04.ro.png b/translated_images/player.137ee0e47f895ffcdb50ba1b316936715ec8decfd6cee3258332a6c60e5d0d04.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.137ee0e47f895ffcdb50ba1b316936715ec8decfd6cee3258332a6c60e5d0d04.ro.png differ
diff --git a/translated_images/player.2887422f6982c3cd284b2bafd7551ff073a7b7b8a66edd2f0c2c722f94acfd5c.bg.png b/translated_images/player.2887422f6982c3cd284b2bafd7551ff073a7b7b8a66edd2f0c2c722f94acfd5c.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.2887422f6982c3cd284b2bafd7551ff073a7b7b8a66edd2f0c2c722f94acfd5c.bg.png differ
diff --git a/translated_images/player.2887422f6982c3cd284b2bafd7551ff073a7b7b8a66edd2f0c2c722f94acfd5c.ro.png b/translated_images/player.2887422f6982c3cd284b2bafd7551ff073a7b7b8a66edd2f0c2c722f94acfd5c.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.2887422f6982c3cd284b2bafd7551ff073a7b7b8a66edd2f0c2c722f94acfd5c.ro.png differ
diff --git a/translated_images/player.391fed427ede24f513d4b559cff8ff60f00818b31c81268b783a7f89054fda90.bg.png b/translated_images/player.391fed427ede24f513d4b559cff8ff60f00818b31c81268b783a7f89054fda90.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.391fed427ede24f513d4b559cff8ff60f00818b31c81268b783a7f89054fda90.bg.png differ
diff --git a/translated_images/player.391fed427ede24f513d4b559cff8ff60f00818b31c81268b783a7f89054fda90.ro.png b/translated_images/player.391fed427ede24f513d4b559cff8ff60f00818b31c81268b783a7f89054fda90.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.391fed427ede24f513d4b559cff8ff60f00818b31c81268b783a7f89054fda90.ro.png differ
diff --git a/translated_images/player.3c4f50182552a73a2b22542c75209c57231da2f51d88d571f198382e2fb3b45b.bg.png b/translated_images/player.3c4f50182552a73a2b22542c75209c57231da2f51d88d571f198382e2fb3b45b.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.3c4f50182552a73a2b22542c75209c57231da2f51d88d571f198382e2fb3b45b.bg.png differ
diff --git a/translated_images/player.3c4f50182552a73a2b22542c75209c57231da2f51d88d571f198382e2fb3b45b.ro.png b/translated_images/player.3c4f50182552a73a2b22542c75209c57231da2f51d88d571f198382e2fb3b45b.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.3c4f50182552a73a2b22542c75209c57231da2f51d88d571f198382e2fb3b45b.ro.png differ
diff --git a/translated_images/player.47bc9de0714c723dfe0705c328fb8769de71c87b99d340921c2247674d9d631a.bg.png b/translated_images/player.47bc9de0714c723dfe0705c328fb8769de71c87b99d340921c2247674d9d631a.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.47bc9de0714c723dfe0705c328fb8769de71c87b99d340921c2247674d9d631a.bg.png differ
diff --git a/translated_images/player.47bc9de0714c723dfe0705c328fb8769de71c87b99d340921c2247674d9d631a.ro.png b/translated_images/player.47bc9de0714c723dfe0705c328fb8769de71c87b99d340921c2247674d9d631a.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.47bc9de0714c723dfe0705c328fb8769de71c87b99d340921c2247674d9d631a.ro.png differ
diff --git a/translated_images/player.57b3107c03012695cedb271fdda06900e2d0d9580ae5fab5c563fdb029ba8584.bg.png b/translated_images/player.57b3107c03012695cedb271fdda06900e2d0d9580ae5fab5c563fdb029ba8584.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.57b3107c03012695cedb271fdda06900e2d0d9580ae5fab5c563fdb029ba8584.bg.png differ
diff --git a/translated_images/player.57b3107c03012695cedb271fdda06900e2d0d9580ae5fab5c563fdb029ba8584.ro.png b/translated_images/player.57b3107c03012695cedb271fdda06900e2d0d9580ae5fab5c563fdb029ba8584.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.57b3107c03012695cedb271fdda06900e2d0d9580ae5fab5c563fdb029ba8584.ro.png differ
diff --git a/translated_images/player.606f85953e5e564e7711d22697724750fdcc661d5f7c5295e2da7e46905fd322.bg.png b/translated_images/player.606f85953e5e564e7711d22697724750fdcc661d5f7c5295e2da7e46905fd322.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.606f85953e5e564e7711d22697724750fdcc661d5f7c5295e2da7e46905fd322.bg.png differ
diff --git a/translated_images/player.606f85953e5e564e7711d22697724750fdcc661d5f7c5295e2da7e46905fd322.ro.png b/translated_images/player.606f85953e5e564e7711d22697724750fdcc661d5f7c5295e2da7e46905fd322.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.606f85953e5e564e7711d22697724750fdcc661d5f7c5295e2da7e46905fd322.ro.png differ
diff --git a/translated_images/player.680ea4c619b54fe160261abdfe2e68139dedacb8d884b6cb405b9a6ab162940d.bg.png b/translated_images/player.680ea4c619b54fe160261abdfe2e68139dedacb8d884b6cb405b9a6ab162940d.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.680ea4c619b54fe160261abdfe2e68139dedacb8d884b6cb405b9a6ab162940d.bg.png differ
diff --git a/translated_images/player.680ea4c619b54fe160261abdfe2e68139dedacb8d884b6cb405b9a6ab162940d.ro.png b/translated_images/player.680ea4c619b54fe160261abdfe2e68139dedacb8d884b6cb405b9a6ab162940d.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.680ea4c619b54fe160261abdfe2e68139dedacb8d884b6cb405b9a6ab162940d.ro.png differ
diff --git a/translated_images/player.bfe14f110bddf56d10a1989066d170af2ce6b1412626c37a7e184963e54c7ef4.bg.png b/translated_images/player.bfe14f110bddf56d10a1989066d170af2ce6b1412626c37a7e184963e54c7ef4.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.bfe14f110bddf56d10a1989066d170af2ce6b1412626c37a7e184963e54c7ef4.bg.png differ
diff --git a/translated_images/player.bfe14f110bddf56d10a1989066d170af2ce6b1412626c37a7e184963e54c7ef4.ro.png b/translated_images/player.bfe14f110bddf56d10a1989066d170af2ce6b1412626c37a7e184963e54c7ef4.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.bfe14f110bddf56d10a1989066d170af2ce6b1412626c37a7e184963e54c7ef4.ro.png differ
diff --git a/translated_images/player.c99c25d54a615ca088fc55515a6ee76c766fba0e31b167816062f3ab3d22fbcd.bg.png b/translated_images/player.c99c25d54a615ca088fc55515a6ee76c766fba0e31b167816062f3ab3d22fbcd.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.c99c25d54a615ca088fc55515a6ee76c766fba0e31b167816062f3ab3d22fbcd.bg.png differ
diff --git a/translated_images/player.c99c25d54a615ca088fc55515a6ee76c766fba0e31b167816062f3ab3d22fbcd.ro.png b/translated_images/player.c99c25d54a615ca088fc55515a6ee76c766fba0e31b167816062f3ab3d22fbcd.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.c99c25d54a615ca088fc55515a6ee76c766fba0e31b167816062f3ab3d22fbcd.ro.png differ
diff --git a/translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.bg.png b/translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.bg.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.bg.png differ
diff --git a/translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.ro.png b/translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.ro.png
new file mode 100644
index 00000000..13fc0247
Binary files /dev/null and b/translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.ro.png differ
diff --git a/translated_images/playerDamaged.181703f652fd5176d25dbc286cdab2b79c9d7470dfd95af344dbb024780b6176.bg.png b/translated_images/playerDamaged.181703f652fd5176d25dbc286cdab2b79c9d7470dfd95af344dbb024780b6176.bg.png
new file mode 100644
index 00000000..91d73b26
Binary files /dev/null and b/translated_images/playerDamaged.181703f652fd5176d25dbc286cdab2b79c9d7470dfd95af344dbb024780b6176.bg.png differ
diff --git a/translated_images/playerDamaged.181703f652fd5176d25dbc286cdab2b79c9d7470dfd95af344dbb024780b6176.ro.png b/translated_images/playerDamaged.181703f652fd5176d25dbc286cdab2b79c9d7470dfd95af344dbb024780b6176.ro.png
new file mode 100644
index 00000000..91d73b26
Binary files /dev/null and b/translated_images/playerDamaged.181703f652fd5176d25dbc286cdab2b79c9d7470dfd95af344dbb024780b6176.ro.png differ
diff --git a/translated_images/playerLeft.0f928412e66ba5d9455ccc99ef113088d2510843b23f8dbcd3106425b221979f.bg.png b/translated_images/playerLeft.0f928412e66ba5d9455ccc99ef113088d2510843b23f8dbcd3106425b221979f.bg.png
new file mode 100644
index 00000000..941cd3ac
Binary files /dev/null and b/translated_images/playerLeft.0f928412e66ba5d9455ccc99ef113088d2510843b23f8dbcd3106425b221979f.bg.png differ
diff --git a/translated_images/playerLeft.0f928412e66ba5d9455ccc99ef113088d2510843b23f8dbcd3106425b221979f.ro.png b/translated_images/playerLeft.0f928412e66ba5d9455ccc99ef113088d2510843b23f8dbcd3106425b221979f.ro.png
new file mode 100644
index 00000000..941cd3ac
Binary files /dev/null and b/translated_images/playerLeft.0f928412e66ba5d9455ccc99ef113088d2510843b23f8dbcd3106425b221979f.ro.png differ
diff --git a/translated_images/playerRight.e4825f489e29f73719f8e3197ba0e5742e2ffbc178641009b57fe254c6abdc38.bg.png b/translated_images/playerRight.e4825f489e29f73719f8e3197ba0e5742e2ffbc178641009b57fe254c6abdc38.bg.png
new file mode 100644
index 00000000..4e69314c
Binary files /dev/null and b/translated_images/playerRight.e4825f489e29f73719f8e3197ba0e5742e2ffbc178641009b57fe254c6abdc38.bg.png differ
diff --git a/translated_images/playerRight.e4825f489e29f73719f8e3197ba0e5742e2ffbc178641009b57fe254c6abdc38.ro.png b/translated_images/playerRight.e4825f489e29f73719f8e3197ba0e5742e2ffbc178641009b57fe254c6abdc38.ro.png
new file mode 100644
index 00000000..4e69314c
Binary files /dev/null and b/translated_images/playerRight.e4825f489e29f73719f8e3197ba0e5742e2ffbc178641009b57fe254c6abdc38.ro.png differ
diff --git a/translated_images/preview.9215f0a010074476f8ab66e6becf3c1b594a30cca0a28b88fb4f3f4821594dc0.bg.jpg b/translated_images/preview.9215f0a010074476f8ab66e6becf3c1b594a30cca0a28b88fb4f3f4821594dc0.bg.jpg
new file mode 100644
index 00000000..811ff4bd
Binary files /dev/null and b/translated_images/preview.9215f0a010074476f8ab66e6becf3c1b594a30cca0a28b88fb4f3f4821594dc0.bg.jpg differ
diff --git a/translated_images/preview.9215f0a010074476f8ab66e6becf3c1b594a30cca0a28b88fb4f3f4821594dc0.ro.jpg b/translated_images/preview.9215f0a010074476f8ab66e6becf3c1b594a30cca0a28b88fb4f3f4821594dc0.ro.jpg
new file mode 100644
index 00000000..0d3b2f44
Binary files /dev/null and b/translated_images/preview.9215f0a010074476f8ab66e6becf3c1b594a30cca0a28b88fb4f3f4821594dc0.ro.jpg differ
diff --git a/translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.bg.png b/translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.bg.png
new file mode 100644
index 00000000..7cb33590
Binary files /dev/null and b/translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.bg.png differ
diff --git a/translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.ro.png b/translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.ro.png
new file mode 100644
index 00000000..4a5023bd
Binary files /dev/null and b/translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.ro.png differ
diff --git a/translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.bg.png b/translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.bg.png
new file mode 100644
index 00000000..1ae052b4
Binary files /dev/null and b/translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.bg.png differ
diff --git a/translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.ro.png b/translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.ro.png
new file mode 100644
index 00000000..e4aa1f71
Binary files /dev/null and b/translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.ro.png differ
diff --git a/translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.bg.png b/translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.bg.png
new file mode 100644
index 00000000..118c952d
Binary files /dev/null and b/translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.bg.png differ
diff --git a/translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.ro.png b/translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.ro.png
new file mode 100644
index 00000000..9e33ab28
Binary files /dev/null and b/translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.ro.png differ
diff --git a/translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.bg.png b/translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.bg.png
new file mode 100644
index 00000000..66e03b7d
Binary files /dev/null and b/translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.bg.png differ
diff --git a/translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.ro.png b/translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.ro.png
new file mode 100644
index 00000000..054a5d4c
Binary files /dev/null and b/translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.ro.png differ
diff --git a/translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.bg.png b/translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.bg.png
new file mode 100644
index 00000000..e6239188
Binary files /dev/null and b/translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.bg.png differ
diff --git a/translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.ro.png b/translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.ro.png
new file mode 100644
index 00000000..c543cd5c
Binary files /dev/null and b/translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.ro.png differ
diff --git a/translated_images/screenshot.e7a5ad659e3645682a7d44bd944af8147012dc403b4965712a052214b42e77c1.bg.png b/translated_images/screenshot.e7a5ad659e3645682a7d44bd944af8147012dc403b4965712a052214b42e77c1.bg.png
new file mode 100644
index 00000000..875b9ae5
Binary files /dev/null and b/translated_images/screenshot.e7a5ad659e3645682a7d44bd944af8147012dc403b4965712a052214b42e77c1.bg.png differ
diff --git a/translated_images/screenshot.e7a5ad659e3645682a7d44bd944af8147012dc403b4965712a052214b42e77c1.ro.png b/translated_images/screenshot.e7a5ad659e3645682a7d44bd944af8147012dc403b4965712a052214b42e77c1.ro.png
new file mode 100644
index 00000000..3ba1993a
Binary files /dev/null and b/translated_images/screenshot.e7a5ad659e3645682a7d44bd944af8147012dc403b4965712a052214b42e77c1.ro.png differ
diff --git a/translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.bg.png b/translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.bg.png
new file mode 100644
index 00000000..7f77d498
Binary files /dev/null and b/translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.bg.png differ
diff --git a/translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.ro.png b/translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.ro.png
new file mode 100644
index 00000000..d58b49e4
Binary files /dev/null and b/translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.ro.png differ
diff --git a/translated_images/shield.1b9412b7ca6610ab21f8836483f4e1ec7835b7fe61617f2cead3ff3317ddd56f.bg.png b/translated_images/shield.1b9412b7ca6610ab21f8836483f4e1ec7835b7fe61617f2cead3ff3317ddd56f.bg.png
new file mode 100644
index 00000000..b962a2f1
Binary files /dev/null and b/translated_images/shield.1b9412b7ca6610ab21f8836483f4e1ec7835b7fe61617f2cead3ff3317ddd56f.bg.png differ
diff --git a/translated_images/shield.1b9412b7ca6610ab21f8836483f4e1ec7835b7fe61617f2cead3ff3317ddd56f.ro.png b/translated_images/shield.1b9412b7ca6610ab21f8836483f4e1ec7835b7fe61617f2cead3ff3317ddd56f.ro.png
new file mode 100644
index 00000000..b962a2f1
Binary files /dev/null and b/translated_images/shield.1b9412b7ca6610ab21f8836483f4e1ec7835b7fe61617f2cead3ff3317ddd56f.ro.png differ
diff --git a/translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.bg.png b/translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.bg.png
new file mode 100644
index 00000000..8de5f95f
Binary files /dev/null and b/translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.bg.png differ
diff --git a/translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.ro.png b/translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.ro.png
new file mode 100644
index 00000000..fc4a412a
Binary files /dev/null and b/translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.ro.png differ
diff --git a/translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.bg.png b/translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.bg.png
new file mode 100644
index 00000000..523d41b1
Binary files /dev/null and b/translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.bg.png differ
diff --git a/translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.ro.png b/translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.ro.png
new file mode 100644
index 00000000..3fecf0e6
Binary files /dev/null and b/translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.ro.png differ
diff --git a/translated_images/speedLine.5bcabb93f48b5ae1fe081a6b8832ed314636560b7bb228889bfbeb75a0322490.bg.png b/translated_images/speedLine.5bcabb93f48b5ae1fe081a6b8832ed314636560b7bb228889bfbeb75a0322490.bg.png
new file mode 100644
index 00000000..03018e7f
Binary files /dev/null and b/translated_images/speedLine.5bcabb93f48b5ae1fe081a6b8832ed314636560b7bb228889bfbeb75a0322490.bg.png differ
diff --git a/translated_images/speedLine.5bcabb93f48b5ae1fe081a6b8832ed314636560b7bb228889bfbeb75a0322490.ro.png b/translated_images/speedLine.5bcabb93f48b5ae1fe081a6b8832ed314636560b7bb228889bfbeb75a0322490.ro.png
new file mode 100644
index 00000000..03018e7f
Binary files /dev/null and b/translated_images/speedLine.5bcabb93f48b5ae1fe081a6b8832ed314636560b7bb228889bfbeb75a0322490.ro.png differ
diff --git a/translated_images/spritesheet.bec82852290b14ee8f814b4173f8d823658151a2402c2be8f15b17159290d1ab.bg.png b/translated_images/spritesheet.bec82852290b14ee8f814b4173f8d823658151a2402c2be8f15b17159290d1ab.bg.png
new file mode 100644
index 00000000..c7f6f709
Binary files /dev/null and b/translated_images/spritesheet.bec82852290b14ee8f814b4173f8d823658151a2402c2be8f15b17159290d1ab.bg.png differ
diff --git a/translated_images/spritesheet.bec82852290b14ee8f814b4173f8d823658151a2402c2be8f15b17159290d1ab.ro.png b/translated_images/spritesheet.bec82852290b14ee8f814b4173f8d823658151a2402c2be8f15b17159290d1ab.ro.png
new file mode 100644
index 00000000..c7f6f709
Binary files /dev/null and b/translated_images/spritesheet.bec82852290b14ee8f814b4173f8d823658151a2402c2be8f15b17159290d1ab.ro.png differ
diff --git a/translated_images/starBackground.a897b8acb1b0587dbb2cdbf8beeaa388269510bb3ac3b4165f0141dc893045a2.bg.png b/translated_images/starBackground.a897b8acb1b0587dbb2cdbf8beeaa388269510bb3ac3b4165f0141dc893045a2.bg.png
new file mode 100644
index 00000000..7344ae88
Binary files /dev/null and b/translated_images/starBackground.a897b8acb1b0587dbb2cdbf8beeaa388269510bb3ac3b4165f0141dc893045a2.bg.png differ
diff --git a/translated_images/starBackground.a897b8acb1b0587dbb2cdbf8beeaa388269510bb3ac3b4165f0141dc893045a2.ro.png b/translated_images/starBackground.a897b8acb1b0587dbb2cdbf8beeaa388269510bb3ac3b4165f0141dc893045a2.ro.png
new file mode 100644
index 00000000..7344ae88
Binary files /dev/null and b/translated_images/starBackground.a897b8acb1b0587dbb2cdbf8beeaa388269510bb3ac3b4165f0141dc893045a2.ro.png differ
diff --git a/translated_images/starBig.72e9c6d0d18f363d485fd26a32c346d269d465f6a87bc0ca5e94ecd34fcd7362.bg.png b/translated_images/starBig.72e9c6d0d18f363d485fd26a32c346d269d465f6a87bc0ca5e94ecd34fcd7362.bg.png
new file mode 100644
index 00000000..e38c77b7
Binary files /dev/null and b/translated_images/starBig.72e9c6d0d18f363d485fd26a32c346d269d465f6a87bc0ca5e94ecd34fcd7362.bg.png differ
diff --git a/translated_images/starBig.72e9c6d0d18f363d485fd26a32c346d269d465f6a87bc0ca5e94ecd34fcd7362.ro.png b/translated_images/starBig.72e9c6d0d18f363d485fd26a32c346d269d465f6a87bc0ca5e94ecd34fcd7362.ro.png
new file mode 100644
index 00000000..e38c77b7
Binary files /dev/null and b/translated_images/starBig.72e9c6d0d18f363d485fd26a32c346d269d465f6a87bc0ca5e94ecd34fcd7362.ro.png differ
diff --git a/translated_images/starSmall.ed78b961dbcd0898e8b9b721cbaaa8d54a0a1165a52a13f19650064add273eec.bg.png b/translated_images/starSmall.ed78b961dbcd0898e8b9b721cbaaa8d54a0a1165a52a13f19650064add273eec.bg.png
new file mode 100644
index 00000000..56bcfd58
Binary files /dev/null and b/translated_images/starSmall.ed78b961dbcd0898e8b9b721cbaaa8d54a0a1165a52a13f19650064add273eec.bg.png differ
diff --git a/translated_images/starSmall.ed78b961dbcd0898e8b9b721cbaaa8d54a0a1165a52a13f19650064add273eec.ro.png b/translated_images/starSmall.ed78b961dbcd0898e8b9b721cbaaa8d54a0a1165a52a13f19650064add273eec.ro.png
new file mode 100644
index 00000000..56bcfd58
Binary files /dev/null and b/translated_images/starSmall.ed78b961dbcd0898e8b9b721cbaaa8d54a0a1165a52a13f19650064add273eec.ro.png differ
diff --git a/translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.bg.png b/translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.bg.png
new file mode 100644
index 00000000..7f77d498
Binary files /dev/null and b/translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.bg.png differ
diff --git a/translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.ro.png b/translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.ro.png
new file mode 100644
index 00000000..d58b49e4
Binary files /dev/null and b/translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.ro.png differ
diff --git a/translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.bg.png b/translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.bg.png
new file mode 100644
index 00000000..e2f97c41
Binary files /dev/null and b/translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.bg.png differ
diff --git a/translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.ro.png b/translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.ro.png
new file mode 100644
index 00000000..bb649e99
Binary files /dev/null and b/translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.ro.png differ
diff --git a/translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.bg.png b/translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.bg.png
new file mode 100644
index 00000000..1881d6ef
Binary files /dev/null and b/translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.bg.png differ
diff --git a/translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.ro.png b/translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.ro.png
new file mode 100644
index 00000000..6c632223
Binary files /dev/null and b/translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.ro.png differ
diff --git a/translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.bg.png b/translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.bg.png
new file mode 100644
index 00000000..b9d23947
Binary files /dev/null and b/translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.bg.png differ
diff --git a/translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.ro.png b/translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.ro.png
new file mode 100644
index 00000000..db0550b3
Binary files /dev/null and b/translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.ro.png differ
diff --git a/translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.bg.png b/translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.bg.png
new file mode 100644
index 00000000..0044acf3
Binary files /dev/null and b/translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.bg.png differ
diff --git a/translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.ro.png b/translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.ro.png
new file mode 100644
index 00000000..34224f99
Binary files /dev/null and b/translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.ro.png differ
diff --git a/translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.bg.png b/translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.bg.png
new file mode 100644
index 00000000..0a14bd5d
Binary files /dev/null and b/translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.bg.png differ
diff --git a/translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.ro.png b/translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.ro.png
new file mode 100644
index 00000000..7da3017f
Binary files /dev/null and b/translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.ro.png differ
diff --git a/translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.bg.png b/translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.bg.png
new file mode 100644
index 00000000..8f3437b7
Binary files /dev/null and b/translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.bg.png differ
diff --git a/translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.ro.png b/translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.ro.png
new file mode 100644
index 00000000..1742fe05
Binary files /dev/null and b/translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.ro.png differ
diff --git a/translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.bg.png b/translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.bg.png
new file mode 100644
index 00000000..4b835da8
Binary files /dev/null and b/translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.bg.png differ
diff --git a/translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.ro.png b/translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.ro.png
new file mode 100644
index 00000000..a9c6dfa6
Binary files /dev/null and b/translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.ro.png differ
diff --git a/translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.bg.png b/translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.bg.png
new file mode 100644
index 00000000..751460ba
Binary files /dev/null and b/translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.bg.png differ
diff --git a/translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.ro.png b/translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.ro.png
new file mode 100644
index 00000000..5b46eb16
Binary files /dev/null and b/translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.ro.png differ
diff --git a/translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.bg.png b/translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.bg.png
new file mode 100644
index 00000000..256c5056
Binary files /dev/null and b/translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.bg.png differ
diff --git a/translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.ro.png b/translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.ro.png
new file mode 100644
index 00000000..9018ad21
Binary files /dev/null and b/translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.ro.png differ
diff --git a/translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.bg.png b/translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.bg.png
new file mode 100644
index 00000000..e4396e37
Binary files /dev/null and b/translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.bg.png differ
diff --git a/translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.ro.png b/translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.ro.png
new file mode 100644
index 00000000..a7b9dcad
Binary files /dev/null and b/translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.ro.png differ
diff --git a/translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.bg.png b/translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.bg.png
new file mode 100644
index 00000000..c6a0a28a
Binary files /dev/null and b/translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.bg.png differ
diff --git a/translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.ro.png b/translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.ro.png
new file mode 100644
index 00000000..ac209ef1
Binary files /dev/null and b/translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.ro.png differ
diff --git a/translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.bg.png b/translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.bg.png
new file mode 100644
index 00000000..2402962a
Binary files /dev/null and b/translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.bg.png differ
diff --git a/translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.ro.png b/translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.ro.png
new file mode 100644
index 00000000..e0610068
Binary files /dev/null and b/translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.ro.png differ
diff --git a/translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.bg.png b/translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.bg.png
new file mode 100644
index 00000000..8c1d3040
Binary files /dev/null and b/translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.bg.png differ
diff --git a/translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.ro.png b/translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.ro.png
new file mode 100644
index 00000000..1f77255e
Binary files /dev/null and b/translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.ro.png differ
diff --git a/translated_images/working-tree-pb.6cd43e5076f23ba3d017f7662394bd87f975e194a068556905e4cc99da9cbfdc.bg.png b/translated_images/working-tree-pb.6cd43e5076f23ba3d017f7662394bd87f975e194a068556905e4cc99da9cbfdc.bg.png
new file mode 100644
index 00000000..48aff4cd
Binary files /dev/null and b/translated_images/working-tree-pb.6cd43e5076f23ba3d017f7662394bd87f975e194a068556905e4cc99da9cbfdc.bg.png differ
diff --git a/translated_images/working-tree-pb.6cd43e5076f23ba3d017f7662394bd87f975e194a068556905e4cc99da9cbfdc.ro.png b/translated_images/working-tree-pb.6cd43e5076f23ba3d017f7662394bd87f975e194a068556905e4cc99da9cbfdc.ro.png
new file mode 100644
index 00000000..df072e3f
Binary files /dev/null and b/translated_images/working-tree-pb.6cd43e5076f23ba3d017f7662394bd87f975e194a068556905e4cc99da9cbfdc.ro.png differ
diff --git a/translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.bg.png b/translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.bg.png
new file mode 100644
index 00000000..bc61bc71
Binary files /dev/null and b/translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.bg.png differ
diff --git a/translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.ro.png b/translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.ro.png
new file mode 100644
index 00000000..9dc91dd2
Binary files /dev/null and b/translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.ro.png differ
diff --git a/translations/bg/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/bg/1-getting-started-lessons/1-intro-to-programming-languages/README.md
new file mode 100644
index 00000000..2f1d760d
--- /dev/null
+++ b/translations/bg/1-getting-started-lessons/1-intro-to-programming-languages/README.md
@@ -0,0 +1,217 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "c63675cfaf1d223b37bb9fecbfe7c252",
+  "translation_date": "2025-08-28T08:24:47+00:00",
+  "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md",
+  "language_code": "bg"
+}
+-->
+# Въведение в програмните езици и инструменти за разработка
+
+Този урок обхваща основите на програмните езици. Темите, разгледани тук, се отнасят за повечето съвременни програмни езици. В секцията „Инструменти за разработка“ ще научите за полезен софтуер, който помага на разработчиците.
+
+![Intro Programming](../../../../translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.bg.png)
+> Скетч от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Тест преди лекцията
+[Тест преди лекцията](https://forms.office.com/r/dru4TE0U9n?origin=lprLink)
+
+## Въведение
+
+В този урок ще разгледаме:
+
+- Какво е програмиране?
+- Видове програмни езици
+- Основни елементи на програмата
+- Полезен софтуер и инструменти за професионалния разработчик
+
+> Можете да преминете този урок на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon)!
+
+## Какво е програмиране?
+
+Програмирането (известно още като кодиране) е процесът на писане на инструкции за устройство, като компютър или мобилно устройство. Пишем тези инструкции с помощта на програмен език, който след това се интерпретира от устройството. Тези набори от инструкции могат да бъдат наричани с различни имена, но *програма*, *компютърна програма*, *приложение (app)* и *изпълним файл* са някои от популярните термини.
+
+*Програма* може да бъде всичко, което е написано с код: уебсайтове, игри и приложения за телефони са програми. Въпреки че е възможно да се създаде програма без писане на код, основната логика се интерпретира от устройството и тази логика най-вероятно е написана с код. Програма, която *работи* или *изпълнява* код, изпълнява инструкции. Устройството, с което четете този урок, изпълнява програма, за да го покаже на екрана ви.
+
+✅ Направете малко проучване: кой се смята за първия програмист в света?
+
+## Програмни езици
+
+Програмните езици позволяват на разработчиците да пишат инструкции за устройство. Устройствата могат да разбират само двоичен код (1 и 0), а за *повечето* разработчици това не е много ефективен начин за комуникация. Програмните езици са средство за комуникация между хората и компютрите.
+
+Програмните езици се предлагат в различни формати и могат да служат за различни цели. Например, JavaScript се използва основно за уеб приложения, докато Bash се използва основно за операционни системи.
+
+*Ниските нива на езиците* обикновено изискват по-малко стъпки от *високите нива на езиците*, за да интерпретират инструкциите. Въпреки това, високите нива на езиците са популярни заради тяхната четимост и поддръжка. JavaScript се счита за език от високо ниво.
+
+Следният код илюстрира разликата между език от високо ниво (JavaScript) и език от ниско ниво (ARM assembly code).
+
+```javascript
+let number = 10
+let n1 = 0, n2 = 1, nextTerm;
+
+for (let i = 1; i <= number; i++) {
+    console.log(n1);
+    nextTerm = n1 + n2;
+    n1 = n2;
+    n2 = nextTerm;
+}
+```
+
+```c
+ area ascen,code,readonly
+ entry
+ code32
+ adr r0,thumb+1
+ bx r0
+ code16
+thumb
+ mov r0,#00
+ sub r0,r0,#01
+ mov r1,#01
+ mov r4,#10
+ ldr r2,=0x40000000
+back add r0,r1
+ str r0,[r2]
+ add r2,#04
+ mov r3,r0
+ mov r0,r1
+ mov r1,r3
+ sub r4,#01
+ cmp r4,#00
+ bne back
+ end
+```
+
+Повярвайте или не, *и двата правят едно и също*: отпечатват последователност на Фибоначи до 10.
+
+✅ Последователността на Фибоначи е [дефинирана](https://en.wikipedia.org/wiki/Fibonacci_number) като набор от числа, при които всяко число е сумата от двете предходни, започвайки от 0 и 1. Първите 10 числа в последователността на Фибоначи са 0, 1, 1, 2, 3, 5, 8, 13, 21 и 34.
+
+## Елементи на програмата
+
+Една инструкция в програмата се нарича *израз* и обикновено има символ или разстояние, което маркира къде инструкцията приключва или *се прекратява*. Начинът, по който програмата се прекратява, варира за всеки език.
+
+Изразите в програмата могат да разчитат на данни, предоставени от потребител или друг източник, за да изпълнят инструкции. Данните могат да променят поведението на програмата, затова програмните езици предлагат начин за временно съхранение на данни, за да могат да бъдат използвани по-късно. Това се нарича *променливи*. Променливите са изрази, които инструктират устройството да запази данни в паметта си. Променливите в програмите са подобни на променливите в алгебрата, където имат уникално име и стойността им може да се променя с времето.
+
+Има вероятност някои изрази да не бъдат изпълнени от устройството. Това обикновено е по дизайн, когато е написано от разработчика, или случайно, когато възникне неочаквана грешка. Този тип контрол върху приложението го прави по-устойчиво и лесно за поддръжка. Обикновено тези промени в контрола се случват, когато са изпълнени определени условия. Често използван израз в съвременното програмиране за контрол на изпълнението на програмата е `if..else`.
+
+✅ Ще научите повече за този тип израз в следващите уроци.
+
+## Инструменти за разработка
+
+[![Tools of the Trade](https://img.youtube.com/vi/69WJeXGBdxg/0.jpg)](https://youtube.com/watch?v=69WJeXGBdxg "Tools of the Trade")
+
+> 🎥 Кликнете върху изображението по-горе за видео за инструментите
+
+В тази секция ще научите за някои софтуери, които може да ви бъдат много полезни, когато започнете професионалния си път като разработчик.
+
+**Среда за разработка** е уникален набор от инструменти и функции, които разработчикът използва често при писане на софтуер. Някои от тези инструменти са персонализирани според специфичните нужди на разработчика и могат да се променят с времето, ако разработчикът промени приоритетите си в работата, личните проекти или когато използва различен програмен език. Средите за разработка са толкова уникални, колкото и разработчиците, които ги използват.
+
+### Редактори
+
+Един от най-важните инструменти за разработка на софтуер е редакторът. Редакторите са мястото, където пишете кода си и понякога го изпълнявате.
+
+Разработчиците разчитат на редакторите по няколко допълнителни причини:
+
+- *Дебъгинг* помага за откриване на грешки, като преминава през кода, ред по ред. Някои редактори имат възможности за дебъгинг; те могат да бъдат персонализирани и добавени за специфични програмни езици.
+- *Оцветяване на синтаксиса* добавя цветове и форматиране на текста в кода, което го прави по-лесен за четене. Повечето редактори позволяват персонализирано оцветяване на синтаксиса.
+- *Разширения и интеграции* са специализирани инструменти за разработчици, създадени от разработчици. Тези инструменти не са включени в основния редактор. Например, много разработчици документират кода си, за да обяснят как работи. Те могат да инсталират разширение за проверка на правописа, за да откриват грешки в документацията. Повечето разширения са предназначени за използване в конкретен редактор, а повечето редактори имат начин за търсене на налични разширения.
+- *Персонализация* позволява на разработчиците да създадат уникална среда за разработка, която да отговаря на техните нужди. Повечето редактори са изключително персонализируеми и могат също така да позволят на разработчиците да създават собствени разширения.
+
+#### Популярни редактори и разширения за уеб разработка
+
+- [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)
+  - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)
+  - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare)
+  - [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
+- [Atom](https://atom.io/)
+  - [spell-check](https://atom.io/packages/spell-check)
+  - [teletype](https://atom.io/packages/teletype)
+  - [atom-beautify](https://atom.io/packages/atom-beautify)
+  
+- [Sublimetext](https://www.sublimetext.com/)
+  - [emmet](https://emmet.io/)
+  - [SublimeLinter](http://www.sublimelinter.com/en/stable/)
+
+### Браузъри
+
+Друг важен инструмент е браузърът. Уеб разработчиците разчитат на браузъра, за да видят как техният код работи в уеб пространството. Той също така се използва за показване на визуалните елементи на уеб страница, написани в редактора, като HTML.
+
+Много браузъри идват с *инструменти за разработчици* (DevTools), които съдържат набор от полезни функции и информация, за да помогнат на разработчиците да събират и улавят важна информация за своето приложение. Например: Ако уеб страница има грешки, понякога е полезно да знаете кога са възникнали. DevTools в браузъра могат да бъдат конфигурирани да улавят тази информация.
+
+#### Популярни браузъри и DevTools
+
+- [Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)
+- [Chrome](https://developers.google.com/web/tools/chrome-devtools/)
+- [Firefox](https://developer.mozilla.org/docs/Tools)
+
+### Инструменти за команден ред
+
+Някои разработчици предпочитат по-малко графичен изглед за ежедневните си задачи и разчитат на командния ред, за да го постигнат. Писането на код изисква значително количество въвеждане, и някои разработчици предпочитат да не прекъсват потока си на клавиатурата. Те използват клавишни комбинации, за да превключват между прозорци на работния плот, да работят върху различни файлове и да използват инструменти. Повечето задачи могат да бъдат изпълнени с мишка, но едно от предимствата на командния ред е, че много неща могат да бъдат направени с инструменти за команден ред, без да се налага превключване между мишката и клавиатурата. Друго предимство на командния ред е, че той е конфигурируем и можете да запазите персонализирана конфигурация, да я промените по-късно и да я импортирате на други машини за разработка. Тъй като средите за разработка са толкова уникални за всеки разработчик, някои ще избягват използването на командния ред, други ще разчитат изцяло на него, а трети предпочитат комбинация от двете.
+
+### Популярни опции за команден ред
+
+Опциите за команден ред ще се различават в зависимост от операционната система, която използвате.
+
+*💻 = предварително инсталиран на операционната система.*
+
+#### Windows
+
+- [Powershell](https://docs.microsoft.com/powershell/scripting/overview?view=powershell-7/?WT.mc_id=academic-77807-sagibbon) 💻
+- [Command Line](https://docs.microsoft.com/windows-server/administration/windows-commands/windows-commands/?WT.mc_id=academic-77807-sagibbon) (известен още като CMD) 💻
+- [Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)
+- [mintty](https://mintty.github.io/)
+  
+#### MacOS
+
+- [Terminal](https://support.apple.com/guide/terminal/open-or-quit-terminal-apd5265185d-f365-44cb-8b09-71a064a42125/mac) 💻
+- [iTerm](https://iterm2.com/)
+- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-macos?view=powershell-7/?WT.mc_id=academic-77807-sagibbon)
+
+#### Linux
+
+- [Bash](https://www.gnu.org/software/bash/manual/html_node/index.html) 💻
+- [KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)
+- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-linux?view=powershell-7/?WT.mc_id=academic-77807-sagibbon)
+
+#### Популярни инструменти за команден ред
+
+- [Git](https://git-scm.com/) (💻 на повечето операционни системи)
+- [NPM](https://www.npmjs.com/)
+- [Yarn](https://classic.yarnpkg.com/en/docs/cli/)
+
+### Документация
+
+Когато разработчик иска да научи нещо ново, най-вероятно ще се обърне към документацията, за да разбере как да го използва. Разработчиците често разчитат на документацията, за да ги насочи как правилно да използват инструменти и езици, както и за да придобият по-дълбоки знания за тях.
+
+#### Популярна документация за уеб разработка
+
+- [Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web), от Mozilla, издателите на браузъра [Firefox](https://www.mozilla.org/firefox/)
+- [Frontend Masters](https://frontendmasters.com/learn/)
+- [Web.dev](https://web.dev), от Google, издателите на [Chrome](https://www.google.com/chrome/)
+- [Документация на Microsoft за разработчици](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers), за [Microsoft Edge](https://www.microsoft.com/edge)
+- [W3 Schools](https://www.w3schools.com/where_to_start.asp)
+
+✅ Направете проучване: Сега, когато знаете основите на средата на уеб разработчика, сравнете я със средата на уеб дизайнера.
+
+---
+
+## 🚀 Предизвикателство
+
+Сравнете някои програмни езици. Какви са уникалните характеристики на JavaScript спрямо Java? А какво ще кажете за COBOL спрямо Go?
+
+## Тест след лекцията
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/2)
+
+## Преглед и самостоятелно обучение
+
+Проучете различните езици, достъпни за програмиста. Опитайте да напишете един ред код на един език, а след това го пренапишете на два други. Какво научихте?
+
+## Задание
+
+[Четене на документация](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/1-getting-started-lessons/1-intro-to-programming-languages/assignment.md b/translations/bg/1-getting-started-lessons/1-intro-to-programming-languages/assignment.md
new file mode 100644
index 00000000..4cfa44f3
--- /dev/null
+++ b/translations/bg/1-getting-started-lessons/1-intro-to-programming-languages/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "1ce4deaec80130d3a0a3c906568459fc",
+  "translation_date": "2025-08-28T08:25:41+00:00",
+  "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Четене на документация
+
+## Инструкции
+
+Има много инструменти, които един уеб разработчик може да използва, описани в [MDN документацията за клиентски инструменти](https://developer.mozilla.org/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview). Изберете 3 инструмента, които не са обхванати в урока, обяснете защо един уеб разработчик би ги използвал, и потърсете инструмент, който попада в тази категория, като споделите неговата документация. Не използвайте същите примери за инструменти от MDN документацията.
+
+## Критерии за оценка
+
+Отлично | Задоволително | Нуждае се от подобрение
+--- | --- | --- |
+|Обяснено е защо уеб разработчик би използвал инструмента| Обяснено е как, но не защо разработчик би използвал инструмента| Не е споменато нито как, нито защо разработчик би използвал инструмента |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/1-getting-started-lessons/2-github-basics/README.md b/translations/bg/1-getting-started-lessons/2-github-basics/README.md
new file mode 100644
index 00000000..99e1c4b6
--- /dev/null
+++ b/translations/bg/1-getting-started-lessons/2-github-basics/README.md
@@ -0,0 +1,338 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "05666cecb8983a72cf0ce1d18932b5b7",
+  "translation_date": "2025-08-28T08:30:19+00:00",
+  "source_file": "1-getting-started-lessons/2-github-basics/README.md",
+  "language_code": "bg"
+}
+-->
+# Въведение в GitHub
+
+Този урок обхваща основите на GitHub, платформа за хостване и управление на промените в кода ви.
+
+![Въведение в GitHub](../../../../translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.bg.png)
+> Скетч от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Предварителен тест
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/3)
+
+## Въведение
+
+В този урок ще разгледаме:
+
+- проследяване на работата, която вършите на вашия компютър
+- работа по проекти с други хора
+- как да допринасяте за софтуер с отворен код
+
+### Предварителни изисквания
+
+Преди да започнете, трябва да проверите дали Git е инсталиран. В терминала напишете: 
+`git --version`
+
+Ако Git не е инсталиран, [изтеглете Git](https://git-scm.com/downloads). След това настройте локалния си Git профил в терминала:
+* `git config --global user.name "вашето-име"`
+* `git config --global user.email "вашият-имейл"`
+
+За да проверите дали Git вече е конфигуриран, можете да напишете:
+`git config --list`
+
+Ще ви е необходим и акаунт в GitHub, редактор за код (като Visual Studio Code) и трябва да отворите терминала си (или командния ред).
+
+Отидете на [github.com](https://github.com/) и създайте акаунт, ако все още нямате такъв, или влезте и попълнете профила си. 
+
+✅ GitHub не е единственото хранилище за код в света; има и други, но GitHub е най-известното.
+
+### Подготовка
+
+Ще ви трябва папка с проект за код на вашия локален компютър (лаптоп или PC) и публично хранилище в GitHub, което ще служи като пример за това как да допринасяте за проектите на други хора.  
+
+---
+
+## Управление на кода
+
+Да кажем, че имате локална папка с проект за код и искате да започнете да проследявате напредъка си с помощта на git - системата за контрол на версиите. Някои хора сравняват използването на git с писане на любовно писмо до бъдещото си аз. Четейки съобщенията за комит дни, седмици или месеци по-късно, ще можете да си припомните защо сте взели дадено решение или да "върнете" промяна - стига да пишете добри "съобщения за комит".
+
+### Задача: Създайте хранилище и комитнете код  
+
+> Вижте видеото
+> 
+> [![Видео за основите на Git и GitHub](https://img.youtube.com/vi/9R31OUPpxU4/0.jpg)](https://www.youtube.com/watch?v=9R31OUPpxU4)
+
+
+1. **Създайте хранилище в GitHub**. На GitHub.com, в раздела за хранилища или от навигационната лента горе вдясно, намерете бутона **new repo**.
+
+   1. Дайте име на вашето хранилище (папка).
+   1. Изберете **create repository**.
+
+1. **Навигирайте до работната си папка**. В терминала си преминете към папката (известна още като директория), която искате да започнете да проследявате. Напишете:
+
+   ```bash
+   cd [name of your folder]
+   ```
+
+1. **Инициализирайте git хранилище**. В проекта си напишете:
+
+   ```bash
+   git init
+   ```
+
+1. **Проверете статуса**. За да проверите статуса на вашето хранилище, напишете:
+
+   ```bash
+   git status
+   ```
+
+   Резултатът може да изглежда така:
+
+   ```output
+   Changes not staged for commit:
+   (use "git add <file>..." to update what will be committed)
+   (use "git checkout -- <file>..." to discard changes in working directory)
+
+        modified:   file.txt
+        modified:   file2.txt
+   ```
+
+   Обикновено командата `git status` ви казва неща като кои файлове са готови за _записване_ в хранилището или имат промени, които може да искате да запазите.
+
+1. **Добавете всички файлове за проследяване**
+   Това се нарича също "стейджване" на файлове/ добавяне на файлове към зоната за стейджинг.
+
+   ```bash
+   git add .
+   ```
+
+   Аргументът `git add` плюс `.` показва, че всички ваши файлове и промени са готови за проследяване. 
+
+1. **Добавете избрани файлове за проследяване**
+
+   ```bash
+   git add [file or folder name]
+   ```
+
+   Това ни помага да добавим само избрани файлове към зоната за стейджинг, когато не искаме да комитнем всички файлове наведнъж.
+
+1. **Премахнете всички файлове от стейджинг**
+
+   ```bash
+   git reset
+   ```
+
+   Тази команда ни помага да премахнем всички файлове от зоната за стейджинг наведнъж.
+
+1. **Премахнете конкретен файл от стейджинг**
+
+   ```bash
+   git reset [file or folder name]
+   ```
+
+   Тази команда ни помага да премахнем само конкретен файл от зоната за стейджинг, който не искаме да включим в следващия комит.
+
+1. **Запазване на работата ви**. На този етап сте добавили файловете към така наречената _зона за стейджинг_. Място, където Git проследява вашите файлове. За да направите промяната постоянна, трябва да _комитнете_ файловете. За да направите това, създайте _комит_ с командата `git commit`. _Комит_ представлява точка за запазване в историята на вашето хранилище. Напишете следното, за да създадете _комит_:
+
+   ```bash
+   git commit -m "first commit"
+   ```
+
+   Това комитва всички ваши файлове, добавяйки съобщението "first commit". За бъдещи съобщения за комит ще искате да бъдете по-описателни, за да предадете какъв тип промяна сте направили.
+
+1. **Свържете локалното си Git хранилище с GitHub**. Git хранилище е полезно на вашия компютър, но в даден момент ще искате да имате резервно копие на вашите файлове някъде и също така да поканите други хора да работят с вас върху вашето хранилище. Едно такова страхотно място за това е GitHub. Помнете, че вече създадохме хранилище в GitHub, така че единственото, което трябва да направим, е да свържем локалното Git хранилище с GitHub. Командата `git remote add` ще направи точно това. Напишете следната команда:
+
+   > Забележка: преди да напишете командата, отидете на страницата на вашето GitHub хранилище, за да намерите URL адреса на хранилището. Ще го използвате в командата по-долу. Заменете ```https://github.com/username/repository_name.git``` с вашия GitHub URL.
+
+   ```bash
+   git remote add origin https://github.com/username/repository_name.git
+   ```
+
+   Това създава _remote_, или връзка, наречена "origin", сочеща към GitHub хранилището, което създадохте по-рано.
+
+1. **Изпратете локалните файлове в GitHub**. Досега сте създали _връзка_ между локалното хранилище и GitHub хранилището. Нека изпратим тези файлове в GitHub с командата `git push`, както следва: 
+   
+   > Забележка: името на вашия branch може да е различно по подразбиране от ```main```.
+
+   ```bash
+   git push -u origin main
+   ```
+
+   Това изпраща вашите комити в "main" branch в GitHub.
+
+2. **Добавяне на още промени**. Ако искате да продължите да правите промени и да ги изпращате в GitHub, ще трябва да използвате следните три команди:
+
+   ```bash
+   git add .
+   git commit -m "type your commit message here"
+   git push
+   ```
+
+   > Съвет: Може също да искате да използвате файл `.gitignore`, за да предотвратите появата на файлове, които не искате да проследявате, в GitHub - например файл с бележки, който съхранявате в същата папка, но няма място в публично хранилище. Можете да намерите шаблони за `.gitignore` файлове на [.gitignore templates](https://github.com/github/gitignore).
+
+#### Съобщения за комит
+
+Добро заглавие на съобщение за Git комит завършва следното изречение:
+Ако бъде приложено, този комит ще <вашето заглавие тук>
+
+За заглавието използвайте императивно, сегашно време: "променя" вместо "променено" или "промени". 
+Както в заглавието, така и в тялото (по избор) използвайте императивно, сегашно време. Тялото трябва да включва мотивацията за промяната и да я сравни с предишното поведение. Обяснявате `защо`, а не `как`.
+
+✅ Отделете няколко минути, за да разгледате GitHub. Можете ли да намерите наистина добро съобщение за комит? Можете ли да намерите наистина минимално? Каква информация смятате, че е най-важна и полезна за предаване в съобщение за комит?
+
+### Задача: Сътрудничество
+
+Основната причина за качването на неща в GitHub беше да се направи възможно сътрудничеството с други разработчици.
+
+## Работа по проекти с други хора
+
+> Вижте видеото
+>
+> [![Видео за основите на Git и GitHub](https://img.youtube.com/vi/bFCM-PC3cu8/0.jpg)](https://www.youtube.com/watch?v=bFCM-PC3cu8)
+
+Във вашето хранилище навигирайте до `Insights > Community`, за да видите как вашият проект се сравнява с препоръчаните стандарти за общността.
+
+   Ето някои неща, които могат да подобрят вашето GitHub хранилище:
+   - **Описание**. Добавихте ли описание за вашия проект?
+   - **README**. Добавихте ли README? GitHub предоставя насоки за писане на [README](https://docs.github.com/articles/about-readmes/?WT.mc_id=academic-77807-sagibbon).
+   - **Насоки за допринасяне**. Има ли вашият проект [насоки за допринасяне](https://docs.github.com/articles/setting-guidelines-for-repository-contributors/?WT.mc_id=academic-77807-sagibbon)? 
+   - **Кодекс на поведение**. [Кодекс на поведение](https://docs.github.com/articles/adding-a-code-of-conduct-to-your-project/). 
+   - **Лиценз**. Може би най-важното, [лиценз](https://docs.github.com/articles/adding-a-license-to-a-repository/)?
+
+
+Всички тези ресурси ще бъдат от полза за въвеждането на нови членове на екипа. Това са обикновено нещата, които новите сътрудници разглеждат, преди дори да погледнат вашия код, за да разберат дали вашият проект е правилното място, където да инвестират времето си.
+
+✅ README файловете, въпреки че отнемат време за подготовка, често се пренебрегват от заети поддържащи. Можете ли да намерите пример за особено описателен README? Забележка: има някои [инструменти за създаване на добри README файлове](https://www.makeareadme.com/), които може да искате да опитате.
+
+### Задача: Слейте код
+
+Документите за допринасяне помагат на хората да допринасят за проекта. Те обясняват какви типове допринасяния търсите и как работи процесът. Сътрудниците ще трябва да преминат през серия от стъпки, за да могат да допринесат за вашето хранилище в GitHub:
+
+
+1. **Форкване на вашето хранилище**. Вероятно ще искате хората да _форкнат_ вашия проект. Форкването означава създаване на копие на вашето хранилище в техния GitHub профил.
+1. **Клониране**. Оттам те ще клонират проекта на своя локален компютър. 
+1. **Създаване на branch**. Ще искате да ги помолите да създадат _branch_ за своята работа. 
+1. **Фокусиране на промяната върху една област**. Помолете сътрудниците да концентрират своите допринасяния върху едно нещо наведнъж - така шансовете да можете да _слеете_ тяхната работа са по-големи. Представете си, че те пишат поправка на бъг, добавят нова функция и актуализират няколко теста - какво ако искате или можете да приложите само 2 от 3, или 1 от 3 промени?
+
+✅ Представете си ситуация, в която branch-овете са особено критични за писането и доставянето на добър код. Какви случаи на употреба можете да си представите?
+
+> Забележка: бъдете промяната, която искате да видите в света, и създавайте branch-ове за вашата собствена работа също. Всички комити, които правите, ще бъдат направени в branch-а, на който сте "чекнати". Използвайте `git status`, за да видите кой branch е това.
+
+Нека преминем през работния процес на сътрудник. Приемете, че сътрудникът вече е _форкнал_ и _клонирал_ хранилището, така че има готово Git хранилище за работа на своя локален компютър:
+
+1. **Създаване на branch**. Използвайте командата `git branch`, за да създадете branch, който ще съдържа промените, които искат да допринесат:
+
+   ```bash
+   git branch [branch-name]
+   ```
+
+1. **Превключване към работния branch**. Превключете към посочения branch и актуализирайте работната директория с `git switch`:
+
+   ```bash
+   git switch [branch-name]
+   ```
+
+1. **Работа**. На този етап искате да добавите вашите промени. Не забравяйте да кажете на Git за тях със следните команди:
+
+   ```bash
+   git add .
+   git commit -m "my changes"
+   ```
+
+   Уверете се, че давате на вашия комит добро име, за ваше удобство, както и за поддържащия на хранилището, на което помагате.
+
+1. **Сливане на вашата работа с `main` branch**. В даден момент сте готови с работата си и искате да я слеете с тази на `main` branch. Междувременно `main` branch може да се е променил, така че се уверете, че първо го актуализирате до последната версия със следните команди:
+
+   ```bash
+   git switch main
+   git pull
+   ```
+
+   На този етап искате да се уверите, че всички _конфликти_, ситуации, в които Git не може лесно да _комбинира_ промените, се случват във вашия работен branch. Затова изпълнете следните команди:
+
+   ```bash
+   git switch [branch_name]
+   git merge main
+   ```
+
+   Това ще доведе всички промени от `main` във вашия branch и се надяваме, че можете просто да продължите. Ако не, VS Code ще ви покаже къде Git е _объркан_ и просто променяте засегнатите файлове, за да посочите кое съдържание е най-точно.
+
+1. **Изпращане на вашата работа в GitHub**. Изпращането на вашата работа в GitHub означава две неща. Пушване на вашия branch към вашето хранилище и след това отваряне на PR (Pull Request).
+
+   ```bash
+   git push --set-upstream origin [branch-name]
+   ```
+
+   Горната команда създава branch във вашето форкнато хранилище.
+
+1. **Отваряне на PR**. След това искате да отворите PR. Това става, като навигирате до форкнатото хранилище в GitHub. Ще видите индикация в GitHub, където се пита дали искате да създадете нов PR, кликвате върху това и сте отведени до интерфейс, където можете да промените заглавието на съобщението за комит, да му дадете по-подходящо описание. Сега поддържащият на хранилището, което сте форкнали, ще види този PR и _да се надяваме_ ще оцени и _слее_ вашия PR. Вече сте сътрудник, ура :)
+
+1. **Почистване**. Счита се за добра практика да _почистите_ след успешно сливане на PR. Искате да почистите както локалния си branch, така и branch-а, който сте пушнали в GitHub. Първо, нека го из
+Уверете се, че отидете на страницата на GitHub за форкнатото хранилище и премахнете отдалечения клон, който току-що сте качили.
+
+`Pull request` изглежда като странен термин, защото всъщност искате да качите вашите промени в проекта. Но поддръжникът (собственикът на проекта) или основният екип трябва да разгледат вашите промени, преди да ги обединят с "главния" клон на проекта, така че всъщност искате решение за промяна от поддръжника.
+
+Pull request е мястото, където се сравняват и обсъждат разликите, въведени в даден клон, с ревюта, коментари, интегрирани тестове и други. Един добър pull request следва приблизително същите правила като съобщение за commit. Можете да добавите препратка към проблем в тракера за проблеми, например когато вашата работа решава даден проблем. Това се прави с `#`, последвано от номера на проблема. Например `#97`.
+
+🤞Стискайте палци всички проверки да преминат успешно и собствениците на проекта да обединят вашите промени в проекта🤞
+
+Актуализирайте текущия локален работен клон с всички нови commit-и от съответния отдалечен клон в GitHub:
+
+`git pull`
+
+## Как да допринесете за отворен код
+
+Първо, нека намерим хранилище (или **repo**) в GitHub, което ви интересува и към което искате да допринесете с промяна. Ще искате да копирате съдържанието му на вашата машина.
+
+✅ Добър начин да намерите хранилища, подходящи за начинаещи, е да [търсите по етикета 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
+
+![Копиране на хранилище локално](../../../../translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.bg.png)
+
+Има няколко начина за копиране на код. Един от тях е да "клонирате" съдържанието на хранилището, използвайки HTTPS, SSH или GitHub CLI (Command Line Interface).
+
+Отворете вашия терминал и клонирайте хранилището по следния начин:
+`git clone https://github.com/ProjectURL`
+
+За да работите по проекта, преминете към правилната папка:
+`cd ProjectURL`
+
+Можете също така да отворите целия проект, използвайки [Codespaces](https://github.com/features/codespaces), вградения редактор на код / облачна среда за разработка на GitHub, или [GitHub Desktop](https://desktop.github.com/).
+
+Накрая, можете да изтеглите кода в компресиран файл.
+
+### Няколко интересни неща за GitHub
+
+Можете да добавите звезда, да наблюдавате и/или да "форкнете" всяко публично хранилище в GitHub. Можете да намерите вашите хранилища със звезда в падащото меню в горния десен ъгъл. Това е като да запазите отметка, но за код.
+
+Проектите имат тракер за проблеми, най-често в раздела "Issues" в GitHub, освен ако не е посочено друго, където хората обсъждат проблеми, свързани с проекта. А разделът Pull Requests е мястото, където хората обсъждат и преглеждат промени, които са в процес на работа.
+
+Проектите може също да имат дискусии във форуми, пощенски списъци или чат канали като Slack, Discord или IRC.
+
+✅ Разгледайте новото си хранилище в GitHub и опитайте няколко неща, като редактиране на настройки, добавяне на информация към вашето хранилище и създаване на проект (като Канбан дъска). Има много неща, които можете да направите!
+
+---
+
+## 🚀 Предизвикателство
+
+Работете в екип с приятел, за да работите върху кода на другия. Създайте проект съвместно, форкнете код, създайте клонове и обединете промените.
+
+## Тест след лекцията
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/4)
+
+## Преглед и самостоятелно обучение
+
+Прочетете повече за [допринасянето към софтуер с отворен код](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution).
+
+[Git cheatsheet](https://training.github.com/downloads/github-git-cheat-sheet/).
+
+Практикувайте, практикувайте, практикувайте. GitHub предлага страхотни учебни пътеки чрез [skills.github.com](https://skills.github.com):
+
+- [Първата седмица в GitHub](https://skills.github.com/#first-week-on-github)
+
+Ще намерите и по-напреднали курсове.
+
+## Задача
+
+Завършете [курса "Първата седмица в GitHub"](https://skills.github.com/#first-week-on-github)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/1-getting-started-lessons/3-accessibility/README.md b/translations/bg/1-getting-started-lessons/3-accessibility/README.md
new file mode 100644
index 00000000..2cf6a5e4
--- /dev/null
+++ b/translations/bg/1-getting-started-lessons/3-accessibility/README.md
@@ -0,0 +1,177 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e4cd5b1faed4adab5acf720f82798003",
+  "translation_date": "2025-08-28T08:27:52+00:00",
+  "source_file": "1-getting-started-lessons/3-accessibility/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на достъпни уеб страници
+
+![Всичко за достъпността](../../../../translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.bg.png)  
+> Скетч от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Предварителен тест  
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/5)
+
+> Силата на уеб е в неговата универсалност. Достъпът за всеки, независимо от уврежданията, е съществен аспект.  
+>
+> \- Сър Тимъти Бърнърс-Лий, директор на W3C и изобретател на Световната мрежа
+
+Този цитат перфектно подчертава важността на създаването на достъпни уебсайтове. Приложение, което не може да бъде достъпно за всички, по дефиниция е изключващо. Като уеб разработчици, винаги трябва да имаме предвид достъпността. Ако се фокусираме върху това от самото начало, ще сме на правилния път да гарантираме, че всеки може да достъпи страниците, които създаваме. В този урок ще научите за инструментите, които могат да ви помогнат да гарантирате, че вашите уеб ресурси са достъпни, и как да изграждате с мисъл за достъпността.
+
+> Можете да вземете този урок на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/accessibility/?WT.mc_id=academic-77807-sagibbon)!
+
+## Инструменти за използване
+
+### Четци на екрана
+
+Един от най-известните инструменти за достъпност са четците на екрана.
+
+[Четците на екрана](https://en.wikipedia.org/wiki/Screen_reader) са често използвани клиенти от хора с увредено зрение. Докато отделяме време, за да гарантираме, че браузърът правилно предава информацията, която искаме да споделим, трябва също така да гарантираме, че четецът на екрана прави същото.
+
+В най-основния си вид, четецът на екрана ще чете страницата отгоре надолу на глас. Ако страницата ви е изцяло текстова, четецът ще предаде информацията по подобен начин на браузъра. Разбира се, уеб страниците рядко са само текст; те съдържат връзки, графики, цветове и други визуални компоненти. Трябва да се внимава, за да се гарантира, че тази информация се чете правилно от четеца на екрана.
+
+Всеки уеб разработчик трябва да се запознае с четец на екрана. Както беше подчертано по-горе, това е клиентът, който вашите потребители ще използват. По същия начин, по който сте запознати с начина, по който работи браузърът, трябва да научите как работи четецът на екрана. За щастие, четци на екрана са вградени в повечето операционни системи.
+
+Някои браузъри също имат вградени инструменти и разширения, които могат да четат текст на глас или дори да предоставят някои основни навигационни функции, като [тези инструменти за достъпност в браузъра Edge](https://support.microsoft.com/help/4000734/microsoft-edge-accessibility-features). Те също са важни инструменти за достъпност, но функционират много различно от четците на екрана и не трябва да се бъркат с инструменти за тестване на четци на екрана.
+
+✅ Опитайте четец на екрана и браузър за четене на текст. В Windows [Narrator](https://support.microsoft.com/windows/complete-guide-to-narrator-e4397a0d-ef4f-b386-d8ae-c172f109bdb1/?WT.mc_id=academic-77807-sagibbon) е включен по подразбиране, а [JAWS](https://webaim.org/articles/jaws/) и [NVDA](https://www.nvaccess.org/about-nvda/) могат също да бъдат инсталирани. В macOS и iOS [VoiceOver](https://support.apple.com/guide/voiceover/welcome/10) е инсталиран по подразбиране.
+
+### Увеличение
+
+Друг инструмент, който често се използва от хора с увредено зрение, е увеличението. Най-основният тип увеличение е статично увеличение, контролирано чрез `Control + плюс (+)` или чрез намаляване на резолюцията на екрана. Този тип увеличение кара цялата страница да се преоразмери, така че използването на [отзивчив дизайн](https://developer.mozilla.org/docs/Learn/CSS/CSS_layout/Responsive_Design) е важно за предоставяне на добро потребителско изживяване при увеличени нива.
+
+Друг тип увеличение разчита на специализиран софтуер за увеличаване на една област от екрана и панорамно движение, подобно на използването на истинска лупа. В Windows [Magnifier](https://support.microsoft.com/windows/use-magnifier-to-make-things-on-the-screen-easier-to-see-414948ba-8b1c-d3bd-8615-0e5e32204198) е вграден, а [ZoomText](https://www.freedomscientific.com/training/zoomtext/getting-started/) е софтуер за увеличаване от трета страна с повече функции и по-голяма потребителска база. И macOS, и iOS имат вграден софтуер за увеличаване, наречен [Zoom](https://www.apple.com/accessibility/mac/vision/).
+
+### Проверка на контраста
+
+Цветовете на уебсайтовете трябва да бъдат внимателно избрани, за да отговорят на нуждите на потребители с цветна слепота или хора, които имат затруднения с виждането на цветове с нисък контраст.
+
+✅ Тествайте уебсайт, който харесвате, за използване на цветове с разширение за браузър като [WCAG проверка на цветовия контраст](https://microsoftedge.microsoft.com/addons/detail/wcag-color-contrast-check/idahaggnlnekelhgplklhfpchbfdmkjp?hl=en-US&WT.mc_id=academic-77807-sagibbon). Какво научавате?
+
+### Lighthouse
+
+В панела с инструменти за разработчици на вашия браузър ще намерите инструмента Lighthouse. Този инструмент е важен за получаване на първоначален поглед върху достъпността (както и други анализи) на уебсайт. Въпреки че е важно да не разчитате изключително на Lighthouse, 100% резултат е много полезен като базова линия.
+
+✅ Намерете Lighthouse в панела с инструменти за разработчици на вашия браузър и направете анализ на който и да е сайт. Какво откривате?
+
+## Дизайн с мисъл за достъпността
+
+Достъпността е сравнително голяма тема. За да ви помогнем, има множество налични ресурси.
+
+- [Accessible U - Университетът на Минесота](https://accessibility.umn.edu/your-role/web-developers)
+
+Докато няма да можем да обхванем всеки аспект на създаването на достъпни сайтове, по-долу са някои от основните принципи, които ще искате да приложите. Дизайнът на достъпна страница от самото начало е **винаги** по-лесен, отколкото връщането към съществуваща страница, за да я направите достъпна.
+
+## Добри принципи за визуално представяне
+
+### Палитри с безопасни цветове
+
+Хората виждат света по различни начини, включително цветовете. Когато избирате цветова схема за вашия сайт, трябва да се уверите, че тя е достъпна за всички. Един страхотен [инструмент за генериране на цветови палитри е Color Safe](http://colorsafe.co/).
+
+✅ Идентифицирайте уебсайт, който е много проблематичен в използването на цветове. Защо?
+
+### Използвайте правилния HTML
+
+С CSS и JavaScript е възможно да направите всеки елемент да изглежда като всякакъв тип контрол. `<span>` може да се използва за създаване на `<button>`, а `<b>` може да стане хипервръзка. Въпреки че това може да се счита за по-лесно за стилизиране, то не предава нищо на четец на екрана. Използвайте подходящия HTML, когато създавате контроли на страница. Ако искате хипервръзка, използвайте `<a>`. Използването на правилния HTML за правилния контрол се нарича използване на семантичен HTML.
+
+✅ Отидете на който и да е уебсайт и вижте дали дизайнерите и разработчиците използват HTML правилно. Можете ли да намерите бутон, който трябва да бъде връзка? Подсказка: щракнете с десния бутон и изберете 'View Page Source' в браузъра си, за да видите основния код.
+
+### Създайте описателна йерархия на заглавията
+
+Потребителите на четци на екрана [разчитат силно на заглавията](https://webaim.org/projects/screenreadersurvey8/#finding), за да намират информация и да навигират през страница. Писането на описателно съдържание на заглавия и използването на семантични тагове за заглавия са важни за създаването на лесно навигируем сайт за потребителите на четци на екрана.
+
+### Използвайте добри визуални подсказки
+
+CSS предлага пълен контрол върху външния вид на всеки елемент на страница. Можете да създадете текстови полета без контур или хипервръзки без подчертаване. За съжаление, премахването на тези подсказки може да направи по-трудно за някой, който разчита на тях, да разпознае типа контрол.
+
+## Важността на текста на връзките
+
+Хипервръзките са основни за навигацията в уеб. Затова е важно четецът на екрана да може правилно да чете връзките, за да позволи на всички потребители да навигират вашия сайт.
+
+### Четци на екрана и връзки
+
+Както бихте очаквали, четците на екрана четат текста на връзките по същия начин, както биха прочели всеки друг текст на страницата. С това предвид, текстът, показан по-долу, може да изглежда напълно приемлив.
+
+> Малкият пингвин, понякога известен като феен пингвин, е най-малкият пингвин в света. [Щракнете тук](https://en.wikipedia.org/wiki/Little_penguin) за повече информация.
+
+> Малкият пингвин, понякога известен като феен пингвин, е най-малкият пингвин в света. Посетете https://en.wikipedia.org/wiki/Little_penguin за повече информация.
+
+> **NOTE** Както ще прочетете, никога не трябва да създавате връзки, които изглеждат като горните примери.
+
+Запомнете, четците на екрана са различен интерфейс от браузърите с различен набор от функции.
+
+### Проблемът с използването на URL
+
+Четците на екрана четат текста. Ако URL се появи в текста, четецът на екрана ще прочете URL. Като цяло, URL не предава значима информация и може да звучи досадно. Може би сте изпитали това, ако телефонът ви някога е прочел на глас текстово съобщение с URL.
+
+### Проблемът с "щракнете тук"
+
+Четците на екрана също имат способността да четат само хипервръзките на страница, подобно на начина, по който човек с добро зрение би сканирал страница за връзки. Ако текстът на връзката винаги е "щракнете тук", потребителят ще чуе само "щракнете тук, щракнете тук, щракнете тук, щракнете тук, щракнете тук, ..." Всички връзки стават неразличими една от друга.
+
+### Добър текст на връзките
+
+Добър текст на връзките накратко описва какво има от другата страна на връзката. В горния пример за малките пингвини, връзката е към страницата в Wikipedia за вида. Фразата *малки пингвини* би била перфектен текст за връзка, тъй като ясно показва какво ще научи някой, ако щракне върху връзката - малки пингвини.
+
+> [Малкият пингвин](https://en.wikipedia.org/wiki/Little_penguin), понякога известен като феен пингвин, е най-малкият пингвин в света.
+
+✅ Сърфирайте в интернет за няколко минути, за да намерите страници, които използват неясни стратегии за връзки. Сравнете ги с други, по-добре свързани сайтове. Какво научавате?
+
+#### Бележки за търсачките
+
+Като допълнителен бонус за гарантиране, че вашият сайт е достъпен за всички, ще помогнете на търсачките да навигират вашия сайт. Търсачките използват текста на връзките, за да научат темите на страниците. Така че използването на добър текст на връзките помага на всички!
+
+### ARIA
+
+Представете си следната страница:
+
+| Продукт      | Описание           | Поръчка      |
+| ------------ | ------------------ | ------------ |
+| Джаджа       | [Описание](../../../../1-getting-started-lessons/3-accessibility/')    | [Поръчка](../../../../1-getting-started-lessons/3-accessibility/') |
+| Супер джаджа | [Описание](../../../../1-getting-started-lessons/3-accessibility/')    | [Поръчка](../../../../1-getting-started-lessons/3-accessibility/') |
+
+В този пример дублирането на текста за описание и поръчка има смисъл за някой, който използва браузър. Въпреки това, някой, който използва четец на екрана, би чул само думите *описание* и *поръчка* повторени без контекст.
+
+За да поддържате тези типове сценарии, HTML поддържа набор от атрибути, известни като [Достъпни богати интернет приложения (ARIA)](https://developer.mozilla.org/docs/Web/Accessibility/ARIA). Тези атрибути ви позволяват да предоставите допълнителна информация на четците на екрана.
+
+> **NOTE**: Както много аспекти на HTML, поддръжката от браузъри и четци на екрана може да варира. Въпреки това, повечето основни клиенти поддържат ARIA атрибути.
+
+Можете да използвате `aria-label`, за да опишете връзката, когато форматът на страницата не ви позволява. Описанието за джаджа може да бъде зададено като
+
+``` html
+<a href="#" aria-label="Widget description">description</a>
+```
+
+✅ Като цяло, използването на семантичен маркъп, както е описано по-горе, превъзхожда използването на ARIA, но понякога няма семантичен еквивалент за различни HTML елементи. Добър пример е дърво. Няма HTML еквивалент за дърво, така че идентифицирате общия `<div>` за този елемент с подходяща роля и ARIA стойности. [Документацията на MDN за ARIA](https://developer.mozilla.org/docs/Web/Accessibility/ARIA) съдържа повече полезна информация.
+
+```html
+<h2 id="tree-label">File Viewer</h2>
+<div role="tree" aria-labelledby="tree-label">
+  <div role="treeitem" aria-expanded="false" tabindex="0">Uploads</div>
+</div>
+```
+
+## Изображения
+
+Очевидно е, че четците на екрана не могат автоматично да прочетат какво има в изображение. Гарантирането, че изображенията са достъпни, не изисква много работа - това е целта на атрибута `alt`. Всички значими изображения трябва да имат `alt`, за да опишат какво представляват.  
+Изображения, които са чисто декоративни, трябва да имат атрибута `alt`, зададен на празен низ: `alt=""`. Това предотвратява ненужното обявяване на декоративното изображение от четците на екрана.
+
+✅ Както можете да очаквате, търсачките също не могат да разберат какво има в изображение. Те също използват alt текст. Така че отново, гарантирането, че вашата страница е достъпна, предоставя допълнителни бонуси!
+
+## Клавиатурата
+
+Някои потребители не могат да използват мишка или тракпад, вместо това разчитат на взаимодействия с клавиатурата, за да преминават от един елемент към следващия. Важно е вашият уебсайт да представя съдържанието си в логичен ред, така че потребителят на клавиатурата да може да достъпи всеки интерактивен елемент, докато се движи надолу по документа. Ако изграждате вашите уеб страници със семанти
+Много правителства имат закони, свързани с изискванията за достъпност. Проучете законите за достъпност във вашата страна. Какво е обхванато и какво не е? Пример за това е [този правителствен уебсайт](https://accessibility.blog.gov.uk/).
+
+## Задача
+
+[Анализирайте недостъпен уебсайт](assignment.md)
+
+Кредити: [Turtle Ipsum](https://github.com/Instrument/semantic-html-sample) от Instrument
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/1-getting-started-lessons/3-accessibility/assignment.md b/translations/bg/1-getting-started-lessons/3-accessibility/assignment.md
new file mode 100644
index 00000000..8a350662
--- /dev/null
+++ b/translations/bg/1-getting-started-lessons/3-accessibility/assignment.md
@@ -0,0 +1,29 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "a258597a194e77d4fd469b3cd976b29e",
+  "translation_date": "2025-08-28T08:29:00+00:00",
+  "source_file": "1-getting-started-lessons/3-accessibility/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Анализ на недостъпен сайт
+
+## Инструкции
+
+Идентифицирайте уебсайт, който смятате, че НЕ е достъпен, и създайте план за действие за подобряване на неговата достъпност. 
+Вашата първа задача е да идентифицирате този сайт, да опишете начините, по които смятате, че е недостъпен, без да използвате аналитични инструменти, и след това да го подложите на анализ с Lighthouse. Заснемете pdf с резултатите от този анализ и съставете подробен план с минимум десет точки, които показват как сайтът може да бъде подобрен.
+
+## Таблица за тестване на достъпността на сайта
+
+| Критерии | Примерен | Адекватен | Нуждае се от подобрение |
+|----------|----------|-----------|-------------------------|
+|          | липсват <10% от изискванията | липсват 20% от изискванията | липсват 50% от изискванията |
+
+----
+Доклад на студента: включва параграфи за това колко недостъпен е сайтът, докладът от Lighthouse, заснет в pdf, списък с десет точки за подобрение, с подробности как да се подобри.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/1-getting-started-lessons/README.md b/translations/bg/1-getting-started-lessons/README.md
new file mode 100644
index 00000000..a3673c25
--- /dev/null
+++ b/translations/bg/1-getting-started-lessons/README.md
@@ -0,0 +1,31 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "04683f4cfa46004179b0404b89a3065c",
+  "translation_date": "2025-08-28T08:23:57+00:00",
+  "source_file": "1-getting-started-lessons/README.md",
+  "language_code": "bg"
+}
+-->
+# Начало с уеб разработка
+
+В тази част от учебната програма ще се запознаете с концепции, които не са свързани с конкретни проекти, но са важни за това да станете професионален разработчик.
+
+### Теми
+
+1. [Въведение в програмните езици и инструментите на занаята](1-intro-to-programming-languages/README.md)
+2. [Въведение в GitHub](2-github-basics/README.md)
+3. [Основи на достъпността](3-accessibility/README.md)
+
+### Благодарности
+
+"Въведение в програмните езици и инструментите на занаята" е написано с ♥️ от [Jasmine Greenaway](https://twitter.com/paladique)
+
+"Въведение в GitHub" е написано с ♥️ от [Floor Drees](https://twitter.com/floordrees)
+
+"Основи на достъпността" е написано с ♥️ от [Christopher Harrison](https://twitter.com/geektrainer)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/1-data-types/README.md b/translations/bg/2-js-basics/1-data-types/README.md
new file mode 100644
index 00000000..f502237d
--- /dev/null
+++ b/translations/bg/2-js-basics/1-data-types/README.md
@@ -0,0 +1,215 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "fc6aef8ecfdd5b0ad2afa6e6ba52bfde",
+  "translation_date": "2025-08-28T08:07:10+00:00",
+  "source_file": "2-js-basics/1-data-types/README.md",
+  "language_code": "bg"
+}
+-->
+# Основи на JavaScript: Типове данни
+
+![Основи на JavaScript - Типове данни](../../../../translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.bg.png)
+> Скица от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Тест преди лекцията
+[Тест преди лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/7)
+
+Тази лекция обхваща основите на JavaScript, езикът, който осигурява интерактивност в уеб.
+
+> Можете да преминете тази лекция на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-variables/?WT.mc_id=academic-77807-sagibbon)!
+
+[![Променливи](https://img.youtube.com/vi/JNIXfGiDWM8/0.jpg)](https://youtube.com/watch?v=JNIXfGiDWM8 "Променливи в JavaScript")
+
+[![Типове данни в JavaScript](https://img.youtube.com/vi/AWfA95eLdq8/0.jpg)](https://youtube.com/watch?v=AWfA95eLdq8 "Типове данни в JavaScript")
+
+> 🎥 Кликнете върху изображенията по-горе за видеа относно променливи и типове данни
+
+Нека започнем с променливите и типовете данни, които ги запълват!
+
+## Променливи
+
+Променливите съхраняват стойности, които могат да се използват и променят в кода ви.
+
+Създаването и **декларирането** на променлива има следния синтаксис **[ключова дума] [име]**. Състои се от две части:
+
+- **Ключова дума**. Ключовите думи могат да бъдат `let` или `var`.  
+
+✅ Ключовата дума `let` е въведена в ES6 и дава на променливата така наречения _блоков обхват_. Препоръчително е да използвате `let` вместо `var`. Ще разгледаме блоковите обхвати по-подробно в следващите части.
+- **Името на променливата**, това е име, което избирате сами.
+
+### Задача - работа с променливи
+
+1. **Декларирайте променлива**. Нека декларираме променлива, използвайки ключовата дума `let`:
+
+    ```javascript
+    let myVariable;
+    ```
+
+   `myVariable` вече е декларирана с помощта на ключовата дума `let`. В момента няма стойност.
+
+1. **Присвояване на стойност**. Съхранете стойност в променлива с оператора `=`, последван от очакваната стойност.
+
+    ```javascript
+    myVariable = 123;
+    ```
+
+   > Забележка: използването на `=` в този урок означава, че използваме "оператор за присвояване", който задава стойност на променлива. Не обозначава равенство.
+
+   `myVariable` вече е *инициализирана* със стойност 123.
+
+1. **Рефакториране**. Заменете кода си със следното изявление.
+
+    ```javascript
+    let myVariable = 123;
+    ```
+
+    Горният пример се нарича _явна инициализация_, когато променлива се декларира и ѝ се присвоява стойност едновременно.
+
+1. **Промяна на стойността на променливата**. Променете стойността на променливата по следния начин:
+
+   ```javascript
+   myVariable = 321;
+   ```
+
+   След като променливата е декларирана, можете да промените стойността ѝ по всяко време в кода си с оператора `=` и новата стойност.
+
+   ✅ Опитайте! Можете да пишете JavaScript директно в браузъра си. Отворете прозорец на браузъра и отидете на Developer Tools. В конзолата ще намерите подканващ ред; напишете `let myVariable = 123`, натиснете Enter, след това напишете `myVariable`. Какво се случва? Забележете, че ще научите повече за тези концепции в следващите уроци.
+
+## Константи
+
+Декларирането и инициализацията на константа следва същите концепции като променлива, с изключение на ключовата дума `const`. Константите обикновено се декларират с главни букви.
+
+```javascript
+const MY_VARIABLE = 123;
+```
+
+Константите са подобни на променливите, с две изключения:
+
+- **Трябва да имат стойност**. Константите трябва да бъдат инициализирани, в противен случай ще възникне грешка при изпълнение на кода.
+- **Референцията не може да бъде променена**. Референцията на константа не може да бъде променена след инициализация, в противен случай ще възникне грешка при изпълнение на кода. Нека разгледаме два примера:
+   - **Проста стойност**. Следното НЕ е позволено:
+   
+      ```javascript
+      const PI = 3;
+      PI = 4; // not allowed
+      ```
+ 
+   - **Референцията на обект е защитена**. Следното НЕ е позволено.
+   
+      ```javascript
+      const obj = { a: 3 };
+      obj = { b: 5 } // not allowed
+      ```
+
+    - **Стойността на обект не е защитена**. Следното Е позволено:
+    
+      ```javascript
+      const obj = { a: 3 };
+      obj.a = 5;  // allowed
+      ```
+
+      В горния пример променяте стойността на обекта, но не и самата референция, което го прави позволено.
+
+   > Забележка: `const` означава, че референцията е защитена от повторно присвояване. Стойността обаче не е _непроменяема_ и може да се промени, особено ако е сложна структура като обект.
+
+## Типове данни
+
+Променливите могат да съхраняват различни типове стойности, като числа и текст. Тези различни типове стойности са известни като **типове данни**. Типовете данни са важна част от разработката на софтуер, защото помагат на разработчиците да вземат решения как да пишат кода и как да работи софтуерът. Освен това, някои типове данни имат уникални характеристики, които помагат за трансформиране или извличане на допълнителна информация от стойност.
+
+✅ Типовете данни също се наричат примитиви на JavaScript, тъй като са най-ниското ниво типове данни, предоставени от езика. Съществуват 7 примитивни типа данни: string, number, bigint, boolean, undefined, null и symbol. Отделете минута, за да си представите какво представлява всеки от тези примитиви. Какво е `zebra`? А `0`? `true`?
+
+### Числа
+
+В предишния раздел стойността на `myVariable` беше от тип данни число.
+
+`let myVariable = 123;`
+
+Променливите могат да съхраняват всякакви числа, включително десетични или отрицателни числа. Числата също могат да се използват с аритметични оператори, разгледани в [следващия раздел](../../../../2-js-basics/1-data-types).
+
+### Аритметични оператори
+
+Съществуват няколко типа оператори за извършване на аритметични функции, като някои от тях са изброени тук:
+
+| Символ | Описание                                                                 | Пример                           |
+| ------ | ----------------------------------------------------------------------- | -------------------------------- |
+| `+`    | **Събиране**: Изчислява сумата на две числа                             | `1 + 2 //очакван отговор е 3`    |
+| `-`    | **Изваждане**: Изчислява разликата между две числа                       | `1 - 2 //очакван отговор е -1`   |
+| `*`    | **Умножение**: Изчислява произведението на две числа                    | `1 * 2 //очакван отговор е 2`    |
+| `/`    | **Деление**: Изчислява частното на две числа                            | `1 / 2 //очакван отговор е 0.5`  |
+| `%`    | **Остатък**: Изчислява остатъка от делението на две числа               | `1 % 2 //очакван отговор е 1`    |
+
+✅ Опитайте! Опитайте аритметична операция в конзолата на браузъра си. Изненадват ли ви резултатите?
+
+### Стрингове
+
+Стринговете са набори от символи, които се намират между единични или двойни кавички.
+
+- `'Това е стринг'`
+- `"Това също е стринг"`
+- `let myString = 'Това е стринг стойност, съхранена в променлива';`
+
+Не забравяйте да използвате кавички, когато пишете стринг, в противен случай JavaScript ще приеме, че това е име на променлива.
+
+### Форматиране на стрингове
+
+Стринговете са текстови и понякога ще изискват форматиране.
+
+За да **конкатенирате** два или повече стринга, или да ги обедините, използвайте оператора `+`.
+
+```javascript
+let myString1 = "Hello";
+let myString2 = "World";
+
+myString1 + myString2 + "!"; //HelloWorld!
+myString1 + " " + myString2 + "!"; //Hello World!
+myString1 + ", " + myString2 + "!"; //Hello, World!
+
+```
+
+✅ Защо `1 + 1 = 2` в JavaScript, но `'1' + '1' = 11?` Помислете. А какво ще кажете за `'1' + 1`?
+
+**Шаблонни литерали** са друг начин за форматиране на стрингове, но вместо кавички се използва обратна кавичка. Всичко, което не е обикновен текст, трябва да бъде поставено в плейсхолдъри `${ }`. Това включва всякакви променливи, които може да са стрингове.
+
+```javascript
+let myString1 = "Hello";
+let myString2 = "World";
+
+`${myString1} ${myString2}!` //Hello World!
+`${myString1}, ${myString2}!` //Hello, World!
+```
+
+Можете да постигнете целите си за форматиране с който и да е от двата метода, но шаблонните литерали ще уважават всички интервали и нови редове.
+
+✅ Кога бихте използвали шаблонен литерал вместо обикновен стринг?
+
+### Булеви стойности
+
+Булевите стойности могат да бъдат само две: `true` или `false`. Булевите стойности могат да помогнат за вземане на решения кои редове от кода да се изпълнят, когато са изпълнени определени условия. В много случаи [операторите](../../../../2-js-basics/1-data-types) помагат за задаване на стойността на булева променлива и често ще забелязвате и пишете променливи, които се инициализират или чиито стойности се актуализират с оператор.
+
+- `let myTrueBool = true`
+- `let myFalseBool = false`
+
+✅ Променлива може да се счита за 'истинна', ако се оценява като булева `true`. Интересното е, че в JavaScript [всички стойности са истинни, освен ако не са дефинирани като лъжливи](https://developer.mozilla.org/docs/Glossary/Truthy).
+
+---
+
+## 🚀 Предизвикателство
+
+JavaScript е известен със своите изненадващи начини за обработка на типове данни понякога. Направете малко проучване за тези 'изненади'. Например: чувствителността към главни и малки букви може да ви изненада! Опитайте това в конзолата си: `let age = 1; let Age = 2; age == Age` (резултатът е `false` -- защо?). Какви други изненади можете да откриете?
+
+## Тест след лекцията
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/8)
+
+## Преглед и самостоятелно обучение
+
+Разгледайте [този списък с упражнения по JavaScript](https://css-tricks.com/snippets/javascript/) и опитайте едно от тях. Какво научихте?
+
+## Задание
+
+[Практика с типове данни](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/1-data-types/assignment.md b/translations/bg/2-js-basics/1-data-types/assignment.md
new file mode 100644
index 00000000..eb9f4c86
--- /dev/null
+++ b/translations/bg/2-js-basics/1-data-types/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3869244ceda606c4969d8cdd82679867",
+  "translation_date": "2025-08-28T08:08:33+00:00",
+  "source_file": "2-js-basics/1-data-types/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Практика с типове данни
+
+## Инструкции
+
+Представете си, че създавате количка за пазаруване. Напишете документация за типовете данни, които ще са ви необходими, за да завършите вашето пазаруване. Как стигнахте до избора си?
+
+## Критерии за оценка
+
+Критерии | Отлично | Задоволително | Нуждае се от подобрение
+--- | --- | --- | --- |
+||Шест типа данни са изброени и подробно разгледани, като е документирано тяхното използване|Четири типа данни са разгледани|Два типа данни са разгледани|
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/2-functions-methods/README.md b/translations/bg/2-js-basics/2-functions-methods/README.md
new file mode 100644
index 00000000..17065d38
--- /dev/null
+++ b/translations/bg/2-js-basics/2-functions-methods/README.md
@@ -0,0 +1,210 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b4612bbb9ace984f374fcc80e3e035ad",
+  "translation_date": "2025-08-28T08:03:43+00:00",
+  "source_file": "2-js-basics/2-functions-methods/README.md",
+  "language_code": "bg"
+}
+-->
+# Основи на JavaScript: Методи и функции
+
+![Основи на JavaScript - Функции](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.bg.png)
+> Скетч от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Предварителен тест
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/9)
+
+Когато мислим за писане на код, винаги трябва да се стремим кодът ни да бъде четим. Макар това да звучи противоречиво, кодът се чете много повече пъти, отколкото се пише. Един от основните инструменти в арсенала на разработчика за създаване на поддържаем код е **функцията**.
+
+[![Методи и функции](https://img.youtube.com/vi/XgKsD6Zwvlc/0.jpg)](https://youtube.com/watch?v=XgKsD6Zwvlc "Методи и функции")
+
+> 🎥 Кликнете върху изображението по-горе за видео за методи и функции.
+
+> Можете да вземете този урок на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-functions/?WT.mc_id=academic-77807-sagibbon)!
+
+## Функции
+
+В основата си функцията е блок от код, който можем да изпълним при поискване. Това е идеално за ситуации, в които трябва да извършим една и съща задача многократно; вместо да дублираме логиката на различни места (което би затруднило актуализацията, когато дойде време), можем да я централизиране на едно място и да я извикваме, когато е необходимо - дори можете да извиквате функции от други функции!
+
+Също толкова важно е възможността да дадем име на функцията. Макар това да изглежда тривиално, името предоставя бърз начин за документиране на част от кода. Можете да го сравните с етикет на бутон. Ако кликна върху бутон с надпис "Отмени таймера", знам, че той ще спре часовника.
+
+## Създаване и извикване на функция
+
+Синтаксисът за функция изглежда по следния начин:
+
+```javascript
+function nameOfFunction() { // function definition
+ // function definition/body
+}
+```
+
+Ако искам да създам функция за показване на поздрав, тя може да изглежда така:
+
+```javascript
+function displayGreeting() {
+  console.log('Hello, world!');
+}
+```
+
+Когато искаме да извикаме (или изпълним) нашата функция, използваме името на функцията, последвано от `()`. Струва си да отбележим, че функцията ни може да бъде дефинирана преди или след като решим да я извикаме; компилаторът на JavaScript ще я намери вместо нас.
+
+```javascript
+// calling our function
+displayGreeting();
+```
+
+> **NOTE:** Съществува специален тип функция, известен като **метод**, който вече сте използвали! Всъщност, видяхме това в нашия пример по-горе, когато използвахме `console.log`. Това, което прави метода различен от функцията, е, че методът е прикрепен към обект (`console` в нашия пример), докато функцията е свободно плаваща. Ще чуете много разработчици да използват тези термини взаимозаменяемо.
+
+### Най-добри практики за функции
+
+Има няколко добри практики, които трябва да имате предвид при създаването на функции:
+
+- Както винаги, използвайте описателни имена, за да знаете какво ще прави функцията
+- Използвайте **camelCasing**, за да комбинирате думи
+- Дръжте функциите си фокусирани върху конкретна задача
+
+## Предаване на информация на функция
+
+За да направите функцията по-универсална, често ще искате да предавате информация на нея. Ако разгледаме нашия пример `displayGreeting` по-горе, той ще показва само **Hello, world!**. Не е най-полезната функция, която бихме могли да създадем. Ако искаме да я направим малко по-гъвкава, например да позволим на някого да посочи името на човека, който да поздравим, можем да добавим **параметър**. Параметърът (понякога наричан и **аргумент**) е допълнителна информация, изпратена на функцията.
+
+Параметрите се изброяват в частта за дефиниция в скоби и са разделени със запетаи, както следва:
+
+```javascript
+function name(param, param2, param3) {
+
+}
+```
+
+Можем да актуализираме нашия `displayGreeting`, за да приема име и да го показва.
+
+```javascript
+function displayGreeting(name) {
+  const message = `Hello, ${name}!`;
+  console.log(message);
+}
+```
+
+Когато искаме да извикаме нашата функция и да предадем параметъра, го посочваме в скобите.
+
+```javascript
+displayGreeting('Christopher');
+// displays "Hello, Christopher!" when run
+```
+
+## Стойности по подразбиране
+
+Можем да направим функцията си още по-гъвкава, като добавим повече параметри. Но какво, ако не искаме да изискваме всяка стойност да бъде посочена? В съответствие с нашия пример за поздрав, можем да оставим името като задължително (трябва да знаем кого поздравяваме), но искаме да позволим поздравът да бъде персонализиран, ако желаем. Ако някой не иска да го персонализира, предоставяме стойност по подразбиране. За да зададем стойност по подразбиране на параметър, го задаваме по същия начин, както задаваме стойност на променлива - `parameterName = 'defaultValue'`. За да видите пълен пример:
+
+```javascript
+function displayGreeting(name, salutation='Hello') {
+  console.log(`${salutation}, ${name}`);
+}
+```
+
+Когато извикваме функцията, можем да решим дали искаме да зададем стойност за `salutation`.
+
+```javascript
+displayGreeting('Christopher');
+// displays "Hello, Christopher"
+
+displayGreeting('Christopher', 'Hi');
+// displays "Hi, Christopher"
+```
+
+## Връщане на стойности
+
+Досега функцията, която създадохме, винаги ще извежда резултата в [конзолата](https://developer.mozilla.org/docs/Web/API/console). Понякога това може да е точно това, което търсим, особено когато създаваме функции, които ще извикват други услуги. Но какво, ако искам да създам помощна функция за извършване на изчисление и да върна стойността обратно, за да мога да я използвам другаде?
+
+Можем да направим това, като използваме **връщана стойност**. Връщаната стойност се връща от функцията и може да бъде съхранена в променлива, точно както бихме могли да съхраним буквална стойност като низ или число.
+
+Ако функцията връща нещо, тогава се използва ключовата дума `return`. Ключовата дума `return` очаква стойност или референция на това, което се връща, както следва:
+
+```javascript
+return myVariable;
+```  
+
+Можем да създадем функция за създаване на поздравително съобщение и да върнем стойността обратно на извикващия.
+
+```javascript
+function createGreetingMessage(name) {
+  const message = `Hello, ${name}`;
+  return message;
+}
+```
+
+Когато извикваме тази функция, ще съхраним стойността в променлива. Това е много подобно на начина, по който бихме задали променлива на статична стойност (като `const name = 'Christopher'`).
+
+```javascript
+const greetingMessage = createGreetingMessage('Christopher');
+```
+
+## Функции като параметри за функции
+
+С напредването на вашата програмистка кариера ще срещнете функции, които приемат функции като параметри. Този интересен трик често се използва, когато не знаем кога нещо ще се случи или завърши, но знаем, че трябва да извършим операция в отговор.
+
+Като пример, разгледайте [setTimeout](https://developer.mozilla.org/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout), който започва таймер и ще изпълни код, когато завърши. Трябва да му кажем какъв код искаме да изпълни. Звучи като идеална работа за функция!
+
+Ако изпълните кода по-долу, след 3 секунди ще видите съобщението **3 секунди изминаха**.
+
+```javascript
+function displayDone() {
+  console.log('3 seconds has elapsed');
+}
+// timer value is in milliseconds
+setTimeout(displayDone, 3000);
+```
+
+### Анонимни функции
+
+Нека разгледаме още веднъж това, което създадохме. Създаваме функция с име, която ще бъде използвана само веднъж. С усложняването на нашето приложение можем да видим как създаваме много функции, които ще бъдат извикани само веднъж. Това не е идеално. Оказва се, че не винаги трябва да предоставяме име!
+
+Когато предаваме функция като параметър, можем да пропуснем създаването ѝ предварително и вместо това да я изградим като част от параметъра. Използваме същата ключова дума `function`, но вместо това я изграждаме като параметър.
+
+Нека пренапишем кода по-горе, за да използваме анонимна функция:
+
+```javascript
+setTimeout(function() {
+  console.log('3 seconds has elapsed');
+}, 3000);
+```
+
+Ако изпълните новия ни код, ще забележите, че получаваме същите резултати. Създадохме функция, но не трябваше да ѝ даваме име!
+
+### Функции със стрелки
+
+Един от съкратените начини, често срещан в много програмни езици (включително JavaScript), е възможността да използваме така наречената **стрелка** или **дебела стрелка** функция. Тя използва специален индикатор `=>`, който изглежда като стрелка - оттук и името! С използването на `=>` можем да пропуснем ключовата дума `function`.
+
+Нека пренапишем кода още веднъж, за да използваме функция със стрелка:
+
+```javascript
+setTimeout(() => {
+  console.log('3 seconds has elapsed');
+}, 3000);
+```
+
+### Кога да използваме всяка стратегия
+
+Вече видяхте, че имаме три начина да предадем функция като параметър и може би се чудите кога да използвате всеки от тях. Ако знаете, че ще използвате функцията повече от веднъж, създайте я по нормалния начин. Ако ще я използвате само за едно място, обикновено е най-добре да използвате анонимна функция. Дали ще използвате функция със стрелка или по-традиционния синтаксис с `function` зависи от вас, но ще забележите, че повечето съвременни разработчици предпочитат `=>`.
+
+---
+
+## 🚀 Предизвикателство
+
+Можете ли да обясните с едно изречение разликата между функции и методи? Опитайте!
+
+## Тест след лекцията
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/10)
+
+## Преглед и самостоятелно обучение
+
+Струва си [да прочетете малко повече за функциите със стрелки](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Functions/Arrow_functions), тъй като те все повече се използват в кодовите бази. Практикувайте писането на функция, а след това я пренапишете с този синтаксис.
+
+## Задание
+
+[Забавление с функции](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/2-functions-methods/assignment.md b/translations/bg/2-js-basics/2-functions-methods/assignment.md
new file mode 100644
index 00000000..460270a0
--- /dev/null
+++ b/translations/bg/2-js-basics/2-functions-methods/assignment.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8973f96157680a13e9446e4bb540ee57",
+  "translation_date": "2025-08-28T08:04:37+00:00",
+  "source_file": "2-js-basics/2-functions-methods/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Забавление с функции
+
+## Инструкции
+
+Създайте различни функции, както такива, които връщат стойност, така и такива, които не връщат нищо.
+
+Опитайте се да създадете функция, която комбинира параметри и параметри с предварително зададени стойности.
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                                               | Задоволително                                                  | Нуждае се от подобрение |
+| -------- | ------------------------------------------------------------------------------------- | ------------------------------------------------------------- | ----------------------- |
+|          | Решението включва две или повече добре работещи функции с разнообразни параметри      | Решението включва една работеща функция с няколко параметъра  | Решението съдържа грешки |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/3-making-decisions/README.md b/translations/bg/2-js-basics/3-making-decisions/README.md
new file mode 100644
index 00000000..c145a7f3
--- /dev/null
+++ b/translations/bg/2-js-basics/3-making-decisions/README.md
@@ -0,0 +1,232 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "888609c48329c280ca2477d2df40f2e5",
+  "translation_date": "2025-08-28T08:05:21+00:00",
+  "source_file": "2-js-basics/3-making-decisions/README.md",
+  "language_code": "bg"
+}
+-->
+# Основи на JavaScript: Вземане на решения
+
+![Основи на JavaScript - Вземане на решения](../../../../translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.bg.png)
+
+> Скица от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Тест преди лекцията
+
+[Тест преди лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/11)
+
+Вземането на решения и контролирането на реда, в който се изпълнява кодът ви, прави вашия код по-гъвкав и надежден. Тази секция обхваща синтаксиса за контролиране на потока от данни в JavaScript и неговото значение, когато се използва с булеви типове данни.
+
+[![Вземане на решения](https://img.youtube.com/vi/SxTp8j-fMMY/0.jpg)](https://youtube.com/watch?v=SxTp8j-fMMY "Вземане на решения")
+
+> 🎥 Кликнете върху изображението по-горе за видео относно вземането на решения.
+
+> Можете да преминете този урок на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-if-else/?WT.mc_id=academic-77807-sagibbon)!
+
+## Кратко припомняне за булевите стойности
+
+Булевите стойности могат да имат само две стойности: `true` или `false`. Те помагат при вземането на решения кои редове от кода да се изпълнят, когато са изпълнени определени условия.
+
+Задайте булева стойност като `true` или `false` по следния начин:
+
+`let myTrueBool = true`  
+`let myFalseBool = false`
+
+✅ Булевите стойности са наречени на английския математик, философ и логик Джордж Бул (1815–1864).
+
+## Оператори за сравнение и булеви стойности
+
+Операторите се използват за оценка на условия чрез сравнения, които създават булева стойност. Ето списък с често използвани оператори:
+
+| Символ | Описание                                                                                                                                                   | Пример             |
+| ------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
+| `<`    | **По-малко от**: Сравнява две стойности и връща булева стойност `true`, ако стойността отляво е по-малка от тази отдясно                                    | `5 < 6 // true`    |
+| `<=`   | **По-малко или равно на**: Сравнява две стойности и връща булева стойност `true`, ако стойността отляво е по-малка или равна на тази отдясно                | `5 <= 6 // true`   |
+| `>`    | **По-голямо от**: Сравнява две стойности и връща булева стойност `true`, ако стойността отляво е по-голяма от тази отдясно                                  | `5 > 6 // false`   |
+| `>=`   | **По-голямо или равно на**: Сравнява две стойности и връща булева стойност `true`, ако стойността отляво е по-голяма или равна на тази отдясно              | `5 >= 6 // false`  |
+| `===`  | **Строго равенство**: Сравнява две стойности и връща булева стойност `true`, ако стойностите отляво и отдясно са равни И са от един и същ тип данни         | `5 === 6 // false` |
+| `!==`  | **Неравенство**: Сравнява две стойности и връща противоположната булева стойност на това, което би върнал операторът за строго равенство                   | `5 !== 6 // true`  |
+
+✅ Проверете знанията си, като напишете няколко сравнения в конзолата на браузъра си. Изненадва ли ви някой от върнатите резултати?
+
+## If израз
+
+Изразът `if` ще изпълни кода между своите блокове, ако условието е вярно.
+
+```javascript
+if (condition) {
+  //Condition is true. Code in this block will run.
+}
+```
+
+Логическите оператори често се използват за формиране на условието.
+
+```javascript
+let currentMoney;
+let laptopPrice;
+
+if (currentMoney >= laptopPrice) {
+  //Condition is true. Code in this block will run.
+  console.log("Getting a new laptop!");
+}
+```
+
+## If..Else израз
+
+Изразът `else` ще изпълни кода между своите блокове, когато условието е невярно. Той е опционален с израза `if`.
+
+```javascript
+let currentMoney;
+let laptopPrice;
+
+if (currentMoney >= laptopPrice) {
+  //Condition is true. Code in this block will run.
+  console.log("Getting a new laptop!");
+} else {
+  //Condition is false. Code in this block will run.
+  console.log("Can't afford a new laptop, yet!");
+}
+```
+
+✅ Тествайте разбирането си за този код и следващия, като го изпълните в конзолата на браузъра. Променете стойностите на променливите `currentMoney` и `laptopPrice`, за да промените върнатия резултат от `console.log()`.
+
+## Switch израз
+
+Изразът `switch` се използва за изпълнение на различни действия въз основа на различни условия. Използвайте `switch`, за да изберете един от много блокове код за изпълнение.
+
+```javascript
+switch (expression) {
+  case x:
+    // code block
+    break;
+  case y:
+    // code block
+    break;
+  default:
+  // code block
+}
+```
+
+```javascript
+// program using switch statement
+let a = 2;
+
+switch (a) {
+  case 1:
+    a = "one";
+    break;
+  case 2:
+    a = "two";
+    break;
+  default:
+    a = "not found";
+    break;
+}
+console.log(`The value is ${a}`);
+```
+
+✅ Тествайте разбирането си за този код и следващия, като го изпълните в конзолата на браузъра. Променете стойностите на променливата `a`, за да промените върнатия резултат от `console.log()`.
+
+## Логически оператори и булеви стойности
+
+Решенията може да изискват повече от едно сравнение и могат да бъдат свързани с логически оператори, за да се получи булева стойност.
+
+| Символ | Описание                                                                                     | Пример                                                                 |
+| ------ | ------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
+| `&&`   | **Логическо И**: Сравнява две булеви израза. Връща `true` **само** ако и двете страни са верни | `(5 > 6) && (5 < 6 ) // Едната страна е невярна, другата е вярна. Връща false` |
+| `\|\|` | **Логическо ИЛИ**: Сравнява две булеви израза. Връща `true`, ако поне едната страна е вярна   | `(5 > 6) \|\| (5 < 6) // Едната страна е невярна, другата е вярна. Връща true` |
+| `!`    | **Логическо НЕ**: Връща противоположната стойност на булев израз                             | `!(5 > 6) // 5 не е по-голямо от 6, но "!" ще върне true`             |
+
+## Условия и решения с логически оператори
+
+Логическите оператори могат да се използват за формиране на условия в изрази `if..else`.
+
+```javascript
+let currentMoney;
+let laptopPrice;
+let laptopDiscountPrice = laptopPrice - laptopPrice * 0.2; //Laptop price at 20 percent off
+
+if (currentMoney >= laptopPrice || currentMoney >= laptopDiscountPrice) {
+  //Condition is true. Code in this block will run.
+  console.log("Getting a new laptop!");
+} else {
+  //Condition is true. Code in this block will run.
+  console.log("Can't afford a new laptop, yet!");
+}
+```
+
+### Оператор за отрицание
+
+Досега видяхте как можете да използвате израз `if...else`, за да създадете условна логика. Всичко, което влиза в `if`, трябва да се оценява като вярно/невярно. Чрез използването на оператора `!` можете да _отрицаете_ израза. Това би изглеждало така:
+
+```javascript
+if (!condition) {
+  // runs if condition is false
+} else {
+  // runs if condition is true
+}
+```
+
+### Тернарни изрази
+
+`if...else` не е единственият начин за изразяване на логика за вземане на решения. Можете също да използвате нещо, наречено тернарен оператор. Синтаксисът му изглежда така:
+
+```javascript
+let variable = condition ? <return this if true> : <return this if false>
+```
+
+По-долу е даден по-осезаем пример:
+
+```javascript
+let firstNumber = 20;
+let secondNumber = 10;
+let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber;
+```
+
+✅ Отделете минута, за да прочетете този код няколко пъти. Разбирате ли как работят тези оператори?
+
+Горният код гласи:
+
+- ако `firstNumber` е по-голямо от `secondNumber`
+- тогава присвойте `firstNumber` на `biggestNumber`
+- иначе присвойте `secondNumber`.
+
+Тернарният израз е просто компактен начин за написване на следния код:
+
+```javascript
+let biggestNumber;
+if (firstNumber > secondNumber) {
+  biggestNumber = firstNumber;
+} else {
+  biggestNumber = secondNumber;
+}
+```
+
+---
+
+## 🚀 Предизвикателство
+
+Създайте програма, която първо е написана с логически оператори, а след това я пренапишете, използвайки тернарен израз. Кой синтаксис предпочитате?
+
+---
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/12)
+
+## Преглед и самостоятелно обучение
+
+Прочетете повече за многото оператори, достъпни за потребителя, [в MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators).
+
+Разгледайте чудесния [справочник за оператори](https://joshwcomeau.com/operator-lookup/) на Джош Комо!
+
+## Задание
+
+[Оператори](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/3-making-decisions/assignment.md b/translations/bg/2-js-basics/3-making-decisions/assignment.md
new file mode 100644
index 00000000..faf92657
--- /dev/null
+++ b/translations/bg/2-js-basics/3-making-decisions/assignment.md
@@ -0,0 +1,54 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "bf62b82567e6f9bdf4abda9ae0ccb64a",
+  "translation_date": "2025-08-28T08:06:03+00:00",
+  "source_file": "2-js-basics/3-making-decisions/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Оператори
+
+## Инструкции
+
+Експериментирайте с оператори. Ето едно предложение за програма, която можете да реализирате:
+
+Имате набор от ученици от две различни оценителни системи.
+
+### Първа оценителна система
+
+Едната оценителна система е дефинирана с оценки от 1 до 5, като 3 и нагоре означава, че сте издържали курса.
+
+### Втора оценителна система
+
+Другата оценителна система включва следните оценки: `A, A-, B, B-, C, C-`, където `A` е най-високата оценка, а `C` е най-ниската оценка за успешно преминаване.
+
+### Задачата
+
+Като използвате следния масив `allStudents`, който представлява всички ученици и техните оценки, създайте нов масив `studentsWhoPass`, съдържащ всички ученици, които са издържали.
+
+> TIP, използвайте for-цикъл, if...else и оператори за сравнение:
+
+```javascript
+let allStudents = [
+  'A',
+  'B-',
+  1,
+  4,
+  5,
+  2
+]
+
+let studentsWhoPass = [];
+```
+
+## Критерии за оценка
+
+| Критерий | Отлично                       | Задоволително                | Нуждае се от подобрение         |
+| -------- | ----------------------------- | ---------------------------- | ------------------------------- |
+|          | Представено е пълно решение   | Представено е частично решение | Представено е решение с грешки |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/4-arrays-loops/README.md b/translations/bg/2-js-basics/4-arrays-loops/README.md
new file mode 100644
index 00000000..68757402
--- /dev/null
+++ b/translations/bg/2-js-basics/4-arrays-loops/README.md
@@ -0,0 +1,147 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3f7f87871312cf6cc12662da7d973182",
+  "translation_date": "2025-08-28T08:09:12+00:00",
+  "source_file": "2-js-basics/4-arrays-loops/README.md",
+  "language_code": "bg"
+}
+-->
+# Основи на JavaScript: Масиви и Цикли
+
+![Основи на JavaScript - Масиви](../../../../translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.bg.png)
+> Скетч от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Предварителен тест
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/13)
+
+Този урок обхваща основите на JavaScript, езикът, който осигурява интерактивност в уеб. В този урок ще научите за масиви и цикли, които се използват за манипулиране на данни.
+
+[![Масиви](https://img.youtube.com/vi/1U4qTyq02Xw/0.jpg)](https://youtube.com/watch?v=1U4qTyq02Xw "Масиви")
+
+[![Цикли](https://img.youtube.com/vi/Eeh7pxtTZ3k/0.jpg)](https://www.youtube.com/watch?v=Eeh7pxtTZ3k "Цикли")
+
+> 🎥 Кликнете върху изображенията по-горе за видеа относно масиви и цикли.
+
+> Можете да преминете този урок на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-arrays/?WT.mc_id=academic-77807-sagibbon)!
+
+## Масиви
+
+Работата с данни е често срещана задача за всеки език, и тя става много по-лесна, когато данните са организирани в структурен формат, като масиви. С масиви данните се съхраняват в структура, подобна на списък. Едно от основните предимства на масивите е, че можете да съхранявате различни типове данни в един масив.
+
+✅ Масивите са навсякъде около нас! Можете ли да измислите пример от реалния живот за масив, като например масив от слънчеви панели?
+
+Синтаксисът за масив е чифт квадратни скоби.
+
+```javascript
+let myArray = [];
+```
+
+Това е празен масив, но масивите могат да бъдат декларирани вече попълнени с данни. Множеството стойности в масив се разделят със запетая.
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+```
+
+Стойностите в масива получават уникална стойност, наречена **индекс**, цяло число, което се определя въз основа на разстоянието му от началото на масива. В горния пример стринговата стойност "Chocolate" има индекс 0, а индексът на "Rocky Road" е 4. Използвайте индекса с квадратни скоби, за да извлечете, промените или добавите стойности в масива.
+
+✅ Изненадва ли ви, че масивите започват от индекс нула? В някои програмни езици индексите започват от 1. Има интересна история за това, която можете да [прочетете в Wikipedia](https://en.wikipedia.org/wiki/Zero-based_numbering).
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+iceCreamFlavors[2]; //"Vanilla"
+```
+
+Можете да използвате индекса, за да промените стойност, като това:
+
+```javascript
+iceCreamFlavors[4] = "Butter Pecan"; //Changed "Rocky Road" to "Butter Pecan"
+```
+
+И можете да добавите нова стойност на даден индекс, като това:
+
+```javascript
+iceCreamFlavors[5] = "Cookie Dough"; //Added "Cookie Dough"
+```
+
+✅ По-често срещан начин за добавяне на стойности в масив е чрез оператори като array.push().
+
+За да разберете колко елемента има в масива, използвайте свойството `length`.
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+iceCreamFlavors.length; //5
+```
+
+✅ Опитайте сами! Използвайте конзолата на браузъра си, за да създадете и манипулирате масив по ваш избор.
+
+## Цикли
+
+Циклите ни позволяват да изпълняваме повтарящи се или **итеративни** задачи и могат да спестят много време и код. Всяка итерация може да се различава по своите променливи, стойности и условия. В JavaScript има различни видове цикли, които имат малки разлики, но по същество правят едно и също: обхождат данни.
+
+### For цикъл
+
+Цикълът `for` изисква 3 части, за да се изпълни:
+- `counter` Променлива, която обикновено се инициализира с число, което брои итерациите
+- `condition` Израз, който използва оператори за сравнение, за да спре цикъла, когато стане `false`
+- `iteration-expression` Изпълнява се в края на всяка итерация, обикновено се използва за промяна на стойността на брояча
+  
+```javascript
+// Counting up to 10
+for (let i = 0; i < 10; i++) {
+  console.log(i);
+}
+```
+
+✅ Стартирайте този код в конзолата на браузъра. Какво се случва, когато направите малки промени в брояча, условието или израза за итерация? Можете ли да го накарате да работи назад, създавайки обратно броене?
+
+### While цикъл
+
+За разлика от синтаксиса на цикъла `for`, цикълът `while` изисква само условие, което ще спре цикъла, когато условието стане `false`. Условията в циклите обикновено зависят от други стойности като броячи и трябва да се управляват по време на цикъла. Началните стойности за броячите трябва да се създадат извън цикъла, а всички изрази за изпълнение на условието, включително промяната на брояча, трябва да се поддържат вътре в цикъла.
+
+```javascript
+//Counting up to 10
+let i = 0;
+while (i < 10) {
+ console.log(i);
+ i++;
+}
+```
+
+✅ Защо бихте избрали for цикъл вместо while цикъл? 17 хиляди потребители имаха същия въпрос в StackOverflow, а някои от мненията [може да ви бъдат интересни](https://stackoverflow.com/questions/39969145/while-loops-vs-for-loops-in-javascript).
+
+## Цикли и масиви
+
+Масивите често се използват с цикли, защото повечето условия изискват дължината на масива, за да спрат цикъла, а индексът може също да бъде стойността на брояча.
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+
+for (let i = 0; i < iceCreamFlavors.length; i++) {
+  console.log(iceCreamFlavors[i]);
+} //Ends when all flavors are printed
+```
+
+✅ Експериментирайте с обхождане на масив по ваш избор в конзолата на браузъра.
+
+---
+
+## 🚀 Предизвикателство
+
+Има и други начини за обхождане на масиви освен for и while цикли. Съществуват [forEach](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach), [for-of](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/for...of) и [map](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array/map). Пренапишете вашия цикъл за масив, използвайки една от тези техники.
+
+## Финален тест
+[Финален тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/14)
+
+## Преглед и самостоятелно обучение
+
+Масивите в JavaScript имат много методи, които са изключително полезни за манипулиране на данни. [Прочетете за тези методи](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array) и изпробвайте някои от тях (като push, pop, slice и splice) върху масив, който сте създали.
+
+## Задача
+
+[Обход на масив](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/4-arrays-loops/assignment.md b/translations/bg/2-js-basics/4-arrays-loops/assignment.md
new file mode 100644
index 00000000..86af1873
--- /dev/null
+++ b/translations/bg/2-js-basics/4-arrays-loops/assignment.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8b2381170bd0fd2870f5889bb8620f02",
+  "translation_date": "2025-08-28T08:09:48+00:00",
+  "source_file": "2-js-basics/4-arrays-loops/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Обхождане на масив
+
+## Инструкции
+
+Създайте програма, която изброява всяко трето число между 1-20 и го отпечатва в конзолата.
+
+> TIP: използвайте for-цикъл и модифицирайте израза за итерация
+
+## Критерии за оценка
+
+| Критерии | Отлично                                | Задоволително           | Нуждае се от подобрение        |
+| -------- | -------------------------------------- | ----------------------- | ------------------------------ |
+|          | Програмата работи правилно и е коментирана | Програмата не е коментирана | Програмата е непълна или има грешки |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/2-js-basics/README.md b/translations/bg/2-js-basics/README.md
new file mode 100644
index 00000000..efa2542c
--- /dev/null
+++ b/translations/bg/2-js-basics/README.md
@@ -0,0 +1,28 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "cc9e70a2f096c67389c8acff1521fc27",
+  "translation_date": "2025-08-28T08:02:52+00:00",
+  "source_file": "2-js-basics/README.md",
+  "language_code": "bg"
+}
+-->
+# Въведение в JavaScript
+
+JavaScript е езикът на уеба. В тези четири урока ще научите основите му.
+
+### Теми
+
+1. [Променливи и типове данни](1-data-types/README.md)
+2. [Функции и методи](2-functions-methods/README.md)
+3. [Вземане на решения с JavaScript](3-making-decisions/README.md)
+4. [Масиви и цикли](4-arrays-loops/README.md)
+
+### Автори
+
+Тези уроци са написани с ♥️ от [Jasmine Greenaway](https://twitter.com/paladique), [Christopher Harrison](https://twitter.com/geektrainer) и [Chris Noring](https://twitter.com/chris_noring)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/1-intro-to-html/README.md b/translations/bg/3-terrarium/1-intro-to-html/README.md
new file mode 100644
index 00000000..1b4de2db
--- /dev/null
+++ b/translations/bg/3-terrarium/1-intro-to-html/README.md
@@ -0,0 +1,249 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "46a0639e719b9cf1dfd062aa24cad639",
+  "translation_date": "2025-08-28T08:12:14+00:00",
+  "source_file": "3-terrarium/1-intro-to-html/README.md",
+  "language_code": "bg"
+}
+-->
+# Проект Терариум Част 1: Въведение в HTML
+
+![Въведение в HTML](../../../../translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.bg.png)
+> Скица от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Тест преди лекцията
+
+[Тест преди лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/15)
+
+> Вижте видеото
+
+> 
+> [![Видео за основите на Git и GitHub](https://img.youtube.com/vi/1TvxJKBzhyQ/0.jpg)](https://www.youtube.com/watch?v=1TvxJKBzhyQ)
+
+### Въведение
+
+HTML, или HyperText Markup Language, е „скелетът“ на уеба. Ако CSS „облича“ вашия HTML, а JavaScript го „съживява“, то HTML е тялото на вашето уеб приложение. Синтаксисът на HTML дори отразява тази идея, тъй като включва тагове като "head", "body" и "footer".
+
+В този урок ще използваме HTML, за да изградим „скелета“ на интерфейса на нашия виртуален терариум. Той ще има заглавие и три колони: дясна и лява колона, където ще се намират плъзгащите се растения, и централна зона, която ще представлява самия стъклен терариум. До края на този урок ще можете да видите растенията в колоните, но интерфейсът ще изглежда малко странно; не се притеснявайте, в следващата секция ще добавим CSS стилове, за да направим интерфейса по-привлекателен.
+
+### Задача
+
+На вашия компютър създайте папка с име 'terrarium' и вътре в нея файл с име 'index.html'. Можете да направите това във Visual Studio Code, след като създадете папката 'terrarium', като отворите нов прозорец на VS Code, кликнете върху 'open folder' и навигирате до новата папка. Кликнете върху малкия бутон 'file' в панела Explorer и създайте новия файл:
+
+![explorer във VS Code](../../../../translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.bg.png)
+
+Или
+
+Използвайте тези команди в git bash:
+* `mkdir terrarium`
+* `cd terrarium`
+* `touch index.html`
+* `code index.html` или `nano index.html`
+
+> Файловете index.html указват на браузъра, че това е основният файл в папката; URL адреси като `https://anysite.com/test` може да са изградени с папка, наречена `test`, която съдържа `index.html`; `index.html` не е задължително да се показва в URL адреса.
+
+---
+
+## DocType и html тагове
+
+Първият ред на HTML файл е неговият doctype. Малко е изненадващо, че трябва да имате този ред най-отгоре на файла, но той указва на по-старите браузъри, че страницата трябва да се рендерира в стандартен режим, следвайки текущата HTML спецификация.
+
+> Съвет: във VS Code можете да задържите курсора върху таг и да получите информация за неговото използване от MDN Reference guides.
+
+Вторият ред трябва да бъде отварящият `<html>` таг, следван веднага от затварящия таг `</html>`. Тези тагове са основните елементи на вашия интерфейс.
+
+### Задача
+
+Добавете тези редове в началото на вашия файл `index.html`:
+
+```HTML
+<!DOCTYPE html>
+<html></html>
+```
+
+✅ Има няколко различни режима, които могат да бъдат определени чрез задаване на DocType с низ за заявка: [Quirks Mode и Standards Mode](https://developer.mozilla.org/docs/Web/HTML/Quirks_Mode_and_Standards_Mode). Тези режими се използваха за поддръжка на много стари браузъри, които вече не се използват често (като Netscape Navigator 4 и Internet Explorer 5). Можете да се придържате към стандартната декларация за doctype.
+
+---
+
+## 'head' на документа
+
+Зоната 'head' на HTML документа включва важна информация за вашата уеб страница, известна също като [метаданни](https://developer.mozilla.org/docs/Web/HTML/Element/meta). В нашия случай казваме на уеб сървъра, към който тази страница ще бъде изпратена за рендериране, следните четири неща:
+
+-   заглавието на страницата
+-   метаданни на страницата, включително:
+    -   'character set', който указва какво кодиране на символите се използва на страницата
+    -   информация за браузъра, включително `x-ua-compatible`, който указва, че се поддържа браузърът IE=edge
+    -   информация за това как трябва да се държи viewport при зареждане. Задаването на viewport с начален мащаб 1 контролира нивото на увеличение при първоначалното зареждане на страницата.
+
+### Задача
+
+Добавете блок 'head' към вашия документ между отварящия и затварящия `<html>` таг.
+
+```html
+<head>
+	<title>Welcome to my Virtual Terrarium</title>
+	<meta charset="utf-8" />
+	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+	<meta name="viewport" content="width=device-width, initial-scale=1" />
+</head>
+```
+
+✅ Какво би се случило, ако зададете meta таг за viewport като този: `<meta name="viewport" content="width=600">`? Прочетете повече за [viewport](https://developer.mozilla.org/docs/Web/HTML/Viewport_meta_tag).
+
+---
+
+## 'body' на документа
+
+### HTML тагове
+
+В HTML добавяте тагове към вашия .html файл, за да създадете елементи на уеб страницата. Всеки таг обикновено има отварящ и затварящ таг, като този: `<p>hello</p>`, за да обозначи параграф. Създайте тялото на вашия интерфейс, като добавите комплект `<body>` тагове вътре в двойката `<html>` тагове; вашият код сега изглежда така:
+
+### Задача
+
+```html
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Welcome to my Virtual Terrarium</title>
+		<meta charset="utf-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+	</head>
+	<body></body>
+</html>
+```
+
+Сега можете да започнете да изграждате вашата страница. Обикновено използвате `<div>` тагове, за да създадете отделни елементи на страницата. Ще създадем серия от `<div>` елементи, които ще съдържат изображения.
+
+### Изображения
+
+Един HTML таг, който не се нуждае от затварящ таг, е `<img>`, защото той има елемент `src`, който съдържа цялата информация, необходима на страницата, за да рендерира елемента.
+
+Създайте папка във вашето приложение, наречена `images`, и в нея добавете всички изображения от [папката с изходен код](../../../../3-terrarium/solution/images); (има 14 изображения на растения).
+
+### Задача
+
+Добавете тези изображения на растения в две колони между `<body></body>` таговете:
+
+```html
+<div id="page">
+	<div id="left-container" class="container">
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant1" src="./images/plant1.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant2" src="./images/plant2.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant3" src="./images/plant3.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant4" src="./images/plant4.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant5" src="./images/plant5.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant6" src="./images/plant6.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant7" src="./images/plant7.png" />
+		</div>
+	</div>
+	<div id="right-container" class="container">
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant8" src="./images/plant8.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant9" src="./images/plant9.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant10" src="./images/plant10.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant11" src="./images/plant11.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant12" src="./images/plant12.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant13" src="./images/plant13.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant14" src="./images/plant14.png" />
+		</div>
+	</div>
+</div>
+```
+
+> Забележка: Spans срещу Divs. Divs се считат за 'блокови' елементи, а Spans са 'вградени'. Какво би се случило, ако преобразувате тези divs в spans?
+
+С този код растенията вече се показват на екрана. Изглежда доста зле, защото все още не са стилизирани с CSS, но ще направим това в следващия урок.
+
+Всяко изображение има alt текст, който ще се появи, дори ако не можете да видите или рендерирате изображение. Това е важен атрибут за включване за достъпност. Научете повече за достъпността в бъдещи уроци; засега запомнете, че атрибутът alt предоставя алтернативна информация за изображение, ако потребителят по някаква причина не може да го види (поради бавна връзка, грешка в атрибута src или ако потребителят използва екранен четец).
+
+✅ Забелязахте ли, че всяко изображение има един и същ alt таг? Добра практика ли е това? Защо или защо не? Можете ли да подобрите този код?
+
+---
+
+## Семантичен код
+
+По принцип е за предпочитане да използвате смислени 'семантики', когато пишете HTML. Какво означава това? Това означава, че използвате HTML тагове, за да представите типа данни или взаимодействие, за които са предназначени. Например, основният заглавен текст на страница трябва да използва `<h1>` таг.
+
+Добавете следния ред точно под отварящия `<body>` таг:
+
+```html
+<h1>My Terrarium</h1>
+```
+
+Използването на семантичен код, като например заглавия `<h1>` и неупорядъчени списъци `<ul>`, помага на екранните четци да навигират през страницата. По принцип бутоните трябва да бъдат написани като `<button>`, а списъците като `<li>`. Въпреки че е _възможно_ да използвате специално стилизирани `<span>` елементи с обработчици на кликвания, за да имитирате бутони, е по-добре за потребителите с увреждания да използват технологии, които определят къде на страницата се намира бутонът и да взаимодействат с него, ако елементът се появява като бутон. Поради тази причина се опитвайте да използвате семантичен код, колкото е възможно повече.
+
+✅ Разгледайте екранен четец и [как той взаимодейства с уеб страница](https://www.youtube.com/watch?v=OUDV1gqs9GA). Можете ли да видите защо несемантичният код може да разочарова потребителя?
+
+## Терариумът
+
+Последната част от този интерфейс включва създаване на код, който ще бъде стилизиран, за да създаде терариум.
+
+### Задача:
+
+Добавете този код над последния `</div>` таг:
+
+```html
+<div id="terrarium">
+	<div class="jar-top"></div>
+	<div class="jar-walls">
+		<div class="jar-glossy-long"></div>
+		<div class="jar-glossy-short"></div>
+	</div>
+	<div class="dirt"></div>
+	<div class="jar-bottom"></div>
+</div>
+```
+
+✅ Въпреки че добавихте този код към екрана, не виждате абсолютно нищо да се рендерира. Защо?
+
+---
+
+## 🚀Предизвикателство
+
+Има някои стари 'по-стари' тагове в HTML, които все още са забавни за използване, въпреки че не трябва да използвате остарели тагове като [тези тагове](https://developer.mozilla.org/docs/Web/HTML/Element#Obsolete_and_deprecated_elements) във вашия код. Все пак, можете ли да използвате стария `<marquee>` таг, за да накарате заглавието h1 да се движи хоризонтално? (ако го направите, не забравяйте да го премахнете след това)
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/16)
+
+## Преглед и самостоятелно обучение
+
+HTML е „изпитаната и вярна“ система за изграждане, която е помогнала за изграждането на уеба в това, което е днес. Научете малко за неговата история, като изучите някои стари и нови тагове. Можете ли да разберете защо някои тагове са били остарели, а други добавени? Какви тагове може да бъдат въведени в бъдеще?
+
+Научете повече за изграждането на сайтове за уеб и мобилни устройства в [Microsoft Learn](https://docs.microsoft.com/learn/modules/build-simple-website/?WT.mc_id=academic-77807-sagibbon).
+
+## Задание
+
+[Практикувайте HTML: Създайте макет на блог](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/1-intro-to-html/assignment.md b/translations/bg/3-terrarium/1-intro-to-html/assignment.md
new file mode 100644
index 00000000..d58f5c92
--- /dev/null
+++ b/translations/bg/3-terrarium/1-intro-to-html/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "970776c81401c9aacb34f365edac6b53",
+  "translation_date": "2025-08-28T08:13:09+00:00",
+  "source_file": "3-terrarium/1-intro-to-html/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Практикувайте вашия HTML: Създайте макет на блог
+
+## Инструкции
+
+Представете си, че проектирате или преработвате вашия личен уебсайт. Създайте графичен макет на сайта си и след това запишете HTML кода, който бихте използвали, за да изградите различните елементи на сайта. Можете да направите това на хартия и да го сканирате, или да използвате софтуер по ваш избор, но се уверете, че HTML кодът е написан ръчно.
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                                           | Задоволително                                                                  | Нуждае се от подобрение                                                          |
+| -------- | --------------------------------------------------------------------------------- | ------------------------------------------------------------------------------ | -------------------------------------------------------------------------------- |
+|          | Макетът на блога е представен визуално с поне 10 елемента на маркиране           | Макетът на блога е представен визуално с около 5 елемента на маркиране         | Макетът на блога е представен визуално с най-много 3 елемента на маркиране       |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/2-intro-to-css/README.md b/translations/bg/3-terrarium/2-intro-to-css/README.md
new file mode 100644
index 00000000..8bf50755
--- /dev/null
+++ b/translations/bg/3-terrarium/2-intro-to-css/README.md
@@ -0,0 +1,284 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e375c2aeb94e2407f2667633d39580bd",
+  "translation_date": "2025-08-28T08:14:28+00:00",
+  "source_file": "3-terrarium/2-intro-to-css/README.md",
+  "language_code": "bg"
+}
+-->
+# Проект Терариум Част 2: Въведение в CSS
+
+![Въведение в CSS](../../../../translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.bg.png)
+> Скица от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/17)
+
+### Въведение
+
+CSS, или Cascading Style Sheets, решава важен проблем в уеб разработката: как да направите вашия уебсайт да изглежда добре. Стилизирайки вашите приложения, ги правите по-удобни за използване и по-привлекателни; също така можете да използвате CSS за създаване на Responsive Web Design (RWD) - което позволява вашите приложения да изглеждат добре, независимо от размера на екрана, на който се показват. CSS не е само за външния вид на приложението; спецификацията му включва анимации и трансформации, които могат да осигурят сложни взаимодействия за вашите приложения. CSS Работната група помага за поддържането на актуалните CSS спецификации; можете да следите тяхната работа на [сайта на World Wide Web Consortium](https://www.w3.org/Style/CSS/members).
+
+> Забележка: CSS е език, който се развива, както всичко в уеб пространството, и не всички браузъри поддържат по-новите части от спецификацията. Винаги проверявайте вашите реализации, като се консултирате с [CanIUse.com](https://caniuse.com).
+
+В този урок ще добавим стилове към нашия онлайн терариум и ще научим повече за няколко CSS концепции: каскадност, наследяване, използване на селектори, позициониране и използване на CSS за изграждане на оформления. В процеса ще подредим терариума и ще създадем самия терариум.
+
+### Предпоставки
+
+Трябва да имате HTML за вашия терариум, който е готов за стилизиране.
+
+> Вижте видеото
+
+> 
+> [![Видео за основите на Git и GitHub](https://img.youtube.com/vi/6yIdOIV9p1I/0.jpg)](https://www.youtube.com/watch?v=6yIdOIV9p1I)
+
+### Задача
+
+В папката на вашия терариум създайте нов файл, наречен `style.css`. Импортирайте този файл в секцията `<head>`:
+
+```html
+<link rel="stylesheet" href="./style.css" />
+```
+
+---
+
+## Каскадност
+
+Cascading Style Sheets включват идеята, че стиловете "каскадират", така че прилагането на стил се ръководи от неговия приоритет. Стиловете, зададени от автора на уебсайта, имат приоритет пред тези, зададени от браузъра. Стиловете, зададени "inline", имат приоритет пред тези, зададени във външен стилов файл.
+
+### Задача
+
+Добавете inline стил "color: red" към вашия `<h1>` таг:
+
+```HTML
+<h1 style="color: red">My Terrarium</h1>
+```
+
+След това добавете следния код към вашия `style.css` файл:
+
+```CSS
+h1 {
+ color: blue;
+}
+```
+
+✅ Кой цвят се показва във вашето уеб приложение? Защо? Можете ли да намерите начин да презапишете стиловете? Кога бихте искали да направите това и защо не?
+
+---
+
+## Наследяване
+
+Стиловете се наследяват от стил на предшественик към наследник, така че вложените елементи наследяват стиловете на своите родители.
+
+### Задача
+
+Задайте шрифта на тялото на определен шрифт и проверете дали вложен елемент наследява този шрифт:
+
+```CSS
+body {
+	font-family: helvetica, arial, sans-serif;
+}
+```
+
+Отворете конзолата на браузъра в раздела 'Elements' и наблюдавайте шрифта на H1. Той наследява шрифта от тялото, както е посочено в браузъра:
+
+![наследен шрифт](../../../../translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.bg.png)
+
+✅ Можете ли да направите вложен стил да наследи различно свойство?
+
+---
+
+## CSS Селектори
+
+### Тагове
+
+Досега вашият `style.css` файл има само няколко стилизирани тага и приложението изглежда доста странно:
+
+```CSS
+body {
+	font-family: helvetica, arial, sans-serif;
+}
+
+h1 {
+	color: #3a241d;
+	text-align: center;
+}
+```
+
+Този начин на стилизиране на таг ви дава контрол върху уникални елементи, но трябва да контролирате стиловете на много растения във вашия терариум. За да направите това, трябва да използвате CSS селектори.
+
+### Id-та
+
+Добавете стил за подреждане на левия и десния контейнер. Тъй като има само един ляв контейнер и само един десен контейнер, те получават id-та в маркировката. За да ги стилизирате, използвайте `#`:
+
+```CSS
+#left-container {
+	background-color: #eee;
+	width: 15%;
+	left: 0px;
+	top: 0px;
+	position: absolute;
+	height: 100%;
+	padding: 10px;
+}
+
+#right-container {
+	background-color: #eee;
+	width: 15%;
+	right: 0px;
+	top: 0px;
+	position: absolute;
+	height: 100%;
+	padding: 10px;
+}
+```
+
+Тук сте позиционирали тези контейнери с абсолютна позиция в крайната лява и дясна част на екрана и сте използвали проценти за тяхната ширина, така че да могат да се мащабират за малки мобилни екрани.
+
+✅ Този код е доста повтарящ се, следователно не е "DRY" (Don't Repeat Yourself); можете ли да намерите по-добър начин за стилизиране на тези id-та, може би с id и клас? Ще трябва да промените маркировката и да рефакторирате CSS:
+
+```html
+<div id="left-container" class="container"></div>
+```
+
+### Класове
+
+В горния пример сте стилизирали два уникални елемента на екрана. Ако искате стиловете да се прилагат към много елементи на екрана, можете да използвате CSS класове. Направете това, за да подредите растенията в левия и десния контейнер.
+
+Обърнете внимание, че всяко растение в HTML маркировката има комбинация от id-та и класове. Id-тата тук се използват от JavaScript, който ще добавите по-късно, за да манипулирате разположението на растенията в терариума. Класовете обаче дават на всички растения определен стил.
+
+```html
+<div class="plant-holder">
+	<img class="plant" alt="plant" id="plant1" src="./images/plant1.png" />
+</div>
+```
+
+Добавете следното към вашия `style.css` файл:
+
+```CSS
+.plant-holder {
+	position: relative;
+	height: 13%;
+	left: -10px;
+}
+
+.plant {
+	position: absolute;
+	max-width: 150%;
+	max-height: 150%;
+	z-index: 2;
+}
+```
+
+Забележително в този фрагмент е смесването на относително и абсолютно позициониране, което ще разгледаме в следващия раздел. Обърнете внимание на начина, по който височините се обработват чрез проценти:
+
+Задавате височината на държача на растенията на 13%, което е добро число, за да се уверите, че всички растения се показват във всеки вертикален контейнер без нужда от превъртане.
+
+Премествате държача на растенията наляво, за да позволите растенията да бъдат по-центрирани в техния контейнер. Изображенията имат голямо количество прозрачен фон, за да бъдат по-лесни за влачене, така че трябва да бъдат изместени наляво, за да се поберат по-добре на екрана.
+
+След това самото растение получава максимална ширина от 150%. Това му позволява да се мащабира надолу, когато браузърът се мащабира надолу. Опитайте да промените размера на браузъра си; растенията остават в контейнерите си, но се мащабират, за да се поберат.
+
+Също така е забележимо използването на z-index, който контролира относителната височина на елемент (така че растенията да стоят върху контейнера и да изглеждат сякаш са вътре в терариума).
+
+✅ Защо ви трябват както държач за растения, така и CSS селектор за растения?
+
+## CSS Позициониране
+
+Смесването на свойства за позициониране (има статично, относително, фиксирано, абсолютно и лепкаво позициониране) може да бъде малко сложно, но когато се направи правилно, ви дава добър контрол върху елементите на вашите страници.
+
+Абсолютно позиционираните елементи се позиционират спрямо най-близките си позиционирани предшественици, а ако няма такива, се позиционират спрямо тялото на документа.
+
+Относително позиционираните елементи се позиционират въз основа на указанията на CSS за коригиране на тяхното разположение спрямо първоначалната им позиция.
+
+В нашия пример, `plant-holder` е елемент с относително позициониране, който е позициониран в контейнер с абсолютно позициониране. Полученото поведение е, че страничните контейнери са фиксирани вляво и вдясно, а `plant-holder` е вложен, като се настройва в рамките на страничните контейнери, осигурявайки място за растенията да бъдат подредени във вертикален ред.
+
+> Самото `plant` също има абсолютно позициониране, необходимо за това да бъде влачено, както ще откриете в следващия урок.
+
+✅ Експериментирайте с превключване на типовете позициониране на страничните контейнери и `plant-holder`. Какво се случва?
+
+## CSS Оформления
+
+Сега ще използвате наученото, за да изградите самия терариум, изцяло с помощта на CSS!
+
+Първо, стилизирайте децата на `.terrarium` div като заоблен правоъгълник с помощта на CSS:
+
+```CSS
+.jar-walls {
+	height: 80%;
+	width: 60%;
+	background: #d1e1df;
+	border-radius: 1rem;
+	position: absolute;
+	bottom: 0.5%;
+	left: 20%;
+	opacity: 0.5;
+	z-index: 1;
+}
+
+.jar-top {
+	width: 50%;
+	height: 5%;
+	background: #d1e1df;
+	position: absolute;
+	bottom: 80.5%;
+	left: 25%;
+	opacity: 0.7;
+	z-index: 1;
+}
+
+.jar-bottom {
+	width: 50%;
+	height: 1%;
+	background: #d1e1df;
+	position: absolute;
+	bottom: 0%;
+	left: 25%;
+	opacity: 0.7;
+}
+
+.dirt {
+	width: 60%;
+	height: 5%;
+	background: #3a241d;
+	position: absolute;
+	border-radius: 0 0 1rem 1rem;
+	bottom: 1%;
+	left: 20%;
+	opacity: 0.7;
+	z-index: -1;
+}
+```
+
+Обърнете внимание на използването на проценти тук. Ако намалите размера на браузъра си, можете да видите как бурканът също се мащабира. Също така обърнете внимание на процентите за ширините и височините на елементите на буркана и как всеки елемент е абсолютно позициониран в центъра, фиксиран към дъното на изгледа.
+
+Също така използваме `rem` за border-radius, дължина, свързана с шрифта. Прочетете повече за този тип относително измерване в [CSS спецификацията](https://www.w3.org/TR/css-values-3/#font-relative-lengths).
+
+✅ Опитайте да промените цветовете и прозрачността на буркана спрямо тези на почвата. Какво се случва? Защо?
+
+---
+
+## 🚀Предизвикателство
+
+Добавете "блясък" към долната лява част на буркана, за да изглежда по-стъклен. Ще стилизирате `.jar-glossy-long` и `.jar-glossy-short`, за да изглеждат като отразен блясък. Ето как би изглеждало:
+
+![завършен терариум](../../../../translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.bg.png)
+
+За да завършите теста след лекцията, преминете през този модул в Learn: [Стилизирайте вашето HTML приложение с CSS](https://docs.microsoft.com/learn/modules/build-simple-website/4-css-basics/?WT.mc_id=academic-77807-sagibbon)
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/18)
+
+## Преглед и самостоятелно обучение
+
+CSS изглежда измамно лесен, но има много предизвикателства при опитите да стилизирате приложение перфектно за всички браузъри и всички размери на екрана. CSS-Grid и Flexbox са инструменти, разработени, за да направят задачата малко по-структурирана и по-надеждна. Научете за тези инструменти, като играете [Flexbox Froggy](https://flexboxfroggy.com/) и [Grid Garden](https://codepip.com/games/grid-garden/).
+
+## Задание
+
+[CSS Рефакториране](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/2-intro-to-css/assignment.md b/translations/bg/3-terrarium/2-intro-to-css/assignment.md
new file mode 100644
index 00000000..04a69cac
--- /dev/null
+++ b/translations/bg/3-terrarium/2-intro-to-css/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9d4d75af51aaccfe9af778f792c62919",
+  "translation_date": "2025-08-28T08:15:38+00:00",
+  "source_file": "3-terrarium/2-intro-to-css/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Рефакториране на CSS
+
+## Инструкции
+
+Престилизирайте терариума, използвайки Flexbox или CSS Grid, и направете скрийншоти, за да покажете, че сте го тествали на няколко браузъра. Може да се наложи да промените маркировката, затова създайте нова версия на приложението с изкуството на място за вашия рефактор. Не се притеснявайте за правенето на елементите плъзгаеми; засега само рефакторирайте HTML и CSS.
+
+## Критерии за оценка
+
+| Критерий | Отлично                                                          | Задоволително                | Нуждае се от подобрение              |
+| -------- | ---------------------------------------------------------------- | ---------------------------- | ------------------------------------ |
+|          | Представете напълно престилизиран терариум, използвайки Flexbox или CSS Grid | Престилизирайте някои от елементите | Не успявате да престилизирате терариума изобщо |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/3-intro-to-DOM-and-closures/README.md b/translations/bg/3-terrarium/3-intro-to-DOM-and-closures/README.md
new file mode 100644
index 00000000..7bc82275
--- /dev/null
+++ b/translations/bg/3-terrarium/3-intro-to-DOM-and-closures/README.md
@@ -0,0 +1,230 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "30f8903a1f290e3d438dc2c70fe60259",
+  "translation_date": "2025-08-28T08:16:29+00:00",
+  "source_file": "3-terrarium/3-intro-to-DOM-and-closures/README.md",
+  "language_code": "bg"
+}
+-->
+# Проект Терариум Част 3: Манипулация на DOM и Затваряне
+
+![DOM и затваряне](../../../../translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.bg.png)
+> Скица от [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/19)
+
+### Въведение
+
+Манипулирането на DOM, или "Document Object Model", е ключов аспект на уеб разработката. Според [MDN](https://developer.mozilla.org/docs/Web/API/Document_Object_Model/Introduction), "Document Object Model (DOM) е представяне на данните за обектите, които съставляват структурата и съдържанието на документ в уеб." Предизвикателствата около манипулацията на DOM често са причина за използването на JavaScript рамки вместо чист JavaScript за управление на DOM, но ние ще се справим сами!
+
+Освен това, този урок ще въведе идеята за [затваряне в JavaScript](https://developer.mozilla.org/docs/Web/JavaScript/Closures), което можете да си представите като функция, затворена от друга функция, така че вътрешната функция има достъп до обхвата на външната функция.
+
+> Затварянията в JavaScript са обширна и сложна тема. Този урок разглежда най-основната идея, че в кода на този терариум ще намерите затваряне: вътрешна функция и външна функция, конструирани така, че вътрешната функция да има достъп до обхвата на външната функция. За много повече информация за това как работи, моля, посетете [подробната документация](https://developer.mozilla.org/docs/Web/JavaScript/Closures).
+
+Ще използваме затваряне, за да манипулираме DOM.
+
+Представете си DOM като дърво, което представлява всички начини, по които документ на уеб страница може да бъде манипулиран. Различни API (Application Program Interfaces) са написани, за да позволят на програмистите, използвайки избрания от тях език за програмиране, да достъпват DOM и да го редактират, променят, пренареждат и управляват.
+
+![Представяне на DOM дърво](../../../../translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.bg.png)
+
+> Представяне на DOM и HTML маркировката, която го реферира. От [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites)
+
+В този урок ще завършим нашия интерактивен проект за терариум, като създадем JavaScript, който ще позволи на потребителя да манипулира растенията на страницата.
+
+### Предпоставки
+
+Трябва да имате HTML и CSS за вашия терариум готови. До края на този урок ще можете да местите растенията в и извън терариума чрез влачене.
+
+### Задача
+
+В папката на вашия терариум създайте нов файл, наречен `script.js`. Импортирайте този файл в секцията `<head>`:
+
+```html
+	<script src="./script.js" defer></script>
+```
+
+> Забележка: използвайте `defer`, когато импортирате външен JavaScript файл в HTML файла, за да позволите на JavaScript да се изпълни само след като HTML файлът е напълно зареден. Можете също да използвате атрибута `async`, който позволява скриптът да се изпълнява, докато HTML файлът се парсира, но в нашия случай е важно HTML елементите да са напълно налични за влачене, преди да позволим изпълнението на скрипта за влачене.
+---
+
+## Елементите на DOM
+
+Първото нещо, което трябва да направите, е да създадете референции към елементите, които искате да манипулирате в DOM. В нашия случай това са 14-те растения, които в момента чакат в страничните ленти.
+
+### Задача
+
+```html
+dragElement(document.getElementById('plant1'));
+dragElement(document.getElementById('plant2'));
+dragElement(document.getElementById('plant3'));
+dragElement(document.getElementById('plant4'));
+dragElement(document.getElementById('plant5'));
+dragElement(document.getElementById('plant6'));
+dragElement(document.getElementById('plant7'));
+dragElement(document.getElementById('plant8'));
+dragElement(document.getElementById('plant9'));
+dragElement(document.getElementById('plant10'));
+dragElement(document.getElementById('plant11'));
+dragElement(document.getElementById('plant12'));
+dragElement(document.getElementById('plant13'));
+dragElement(document.getElementById('plant14'));
+```
+
+Какво се случва тук? Реферирате документа и търсите в неговия DOM, за да намерите елемент с определен Id. Спомнете си от първия урок за HTML, че дадохте индивидуални Id-та на всяко изображение на растение (`id="plant1"`)? Сега ще използвате този труд. След като идентифицирате всеки елемент, го предавате на функция, наречена `dragElement`, която ще изградите след малко. Така елементът в HTML вече е активиран за влачене, или скоро ще бъде.
+
+✅ Защо реферираме елементи по Id? Защо не по техния CSS клас? Можете да се върнете към предишния урок за CSS, за да отговорите на този въпрос.
+
+---
+
+## Затварянето
+
+Сега сте готови да създадете затварянето `dragElement`, което е външна функция, която затваря вътрешна функция или функции (в нашия случай ще имаме три).
+
+Затварянията са полезни, когато една или повече функции трябва да имат достъп до обхвата на външна функция. Ето пример:
+
+```javascript
+function displayCandy(){
+	let candy = ['jellybeans'];
+	function addCandy(candyType) {
+		candy.push(candyType)
+	}
+	addCandy('gumdrops');
+}
+displayCandy();
+console.log(candy)
+```
+
+В този пример функцията `displayCandy` обгражда функция, която добавя нов тип бонбон към масив, който вече съществува във функцията. Ако изпълните този код, масивът `candy` ще бъде недефиниран, тъй като е локална променлива (локална за затварянето).
+
+✅ Как можете да направите масива `candy` достъпен? Опитайте да го преместите извън затварянето. Така масивът става глобален, вместо да остава достъпен само за локалния обхват на затварянето.
+
+### Задача
+
+Под декларациите на елементите в `script.js` създайте функция:
+
+```javascript
+function dragElement(terrariumElement) {
+	//set 4 positions for positioning on the screen
+	let pos1 = 0,
+		pos2 = 0,
+		pos3 = 0,
+		pos4 = 0;
+	terrariumElement.onpointerdown = pointerDrag;
+}
+```
+
+`dragElement` получава своя обект `terrariumElement` от декларациите в началото на скрипта. След това задавате някои локални позиции на `0` за обекта, предаден на функцията. Това са локалните променливи, които ще бъдат манипулирани за всеки елемент, докато добавяте функционалност за влачене и пускане в затварянето към всеки елемент. Терариумът ще бъде попълнен от тези влачени елементи, така че приложението трябва да следи къде са поставени.
+
+Освен това, елементът `terrariumElement`, който се предава на тази функция, получава събитие `pointerdown`, което е част от [web APIs](https://developer.mozilla.org/docs/Web/API), предназначени да помагат при управлението на DOM. `onpointerdown` се активира, когато бутон е натиснат, или в нашия случай, когато докоснете влачим елемент. Този обработчик на събития работи както на [уеб, така и на мобилни браузъри](https://caniuse.com/?search=onpointerdown), с някои изключения.
+
+✅ [Обработчикът на събития `onclick`](https://developer.mozilla.org/docs/Web/API/GlobalEventHandlers/onclick) има много по-голяма поддръжка между браузърите; защо не го използвате тук? Помислете за точния тип взаимодействие с екрана, което се опитвате да създадете тук.
+
+---
+
+## Функцията Pointerdrag
+
+Елементът `terrariumElement` е готов да бъде влачен; когато събитието `onpointerdown` се активира, функцията `pointerDrag` се извиква. Добавете тази функция точно под този ред: `terrariumElement.onpointerdown = pointerDrag;`:
+
+### Задача 
+
+```javascript
+function pointerDrag(e) {
+	e.preventDefault();
+	console.log(e);
+	pos3 = e.clientX;
+	pos4 = e.clientY;
+}
+```
+
+Няколко неща се случват. Първо, предотвратявате стандартните събития, които обикновено се случват при pointerdown, като използвате `e.preventDefault();`. Така имате повече контрол върху поведението на интерфейса.
+
+> Върнете се към този ред, когато сте изградили напълно файла със скрипта, и опитайте без `e.preventDefault()` - какво се случва?
+
+Второ, отворете `index.html` в прозорец на браузъра и инспектирайте интерфейса. Когато кликнете върху растение, можете да видите как събитието 'e' се улавя. Разгледайте събитието, за да видите колко информация се събира от едно pointerdown събитие!  
+
+След това, обърнете внимание как локалните променливи `pos3` и `pos4` се задават на e.clientX. Можете да намерите стойностите на `e` в панела за инспекция. Тези стойности улавят x и y координатите на растението в момента, в който го кликнете или докоснете. Ще ви е необходим прецизен контрол върху поведението на растенията, докато ги кликвате и влачите, така че следите техните координати.
+
+✅ Става ли по-ясно защо цялото приложение е изградено с едно голямо затваряне? Ако не беше, как бихте поддържали обхват за всяко от 14-те влачими растения?
+
+Завършете началната функция, като добавите още две манипулации на събитията за указател под `pos4 = e.clientY`:
+
+```html
+document.onpointermove = elementDrag;
+document.onpointerup = stopElementDrag;
+```
+Сега указвате, че искате растението да бъде влачено заедно с указателя, докато го местите, и жестът на влачене да спре, когато деселектирате растението. `onpointermove` и `onpointerup` са част от същия API като `onpointerdown`. Интерфейсът ще хвърля грешки сега, тъй като все още не сте дефинирали функциите `elementDrag` и `stopElementDrag`, така че ги изградете следващи.
+
+## Функциите elementDrag и stopElementDrag
+
+Ще завършите вашето затваряне, като добавите още две вътрешни функции, които ще управляват какво се случва, когато влачите растение и спирате да го влачите. Поведението, което искате, е да можете да влачите всяко растение по всяко време и да го поставяте навсякъде на екрана. Този интерфейс е доста непретенциозен (например няма зона за пускане), за да ви позволи да проектирате вашия терариум точно както искате, като добавяте, премахвате и премествате растения.
+
+### Задача
+
+Добавете функцията `elementDrag` точно след затварящата фигурна скоба на `pointerDrag`:
+
+```javascript
+function elementDrag(e) {
+	pos1 = pos3 - e.clientX;
+	pos2 = pos4 - e.clientY;
+	pos3 = e.clientX;
+	pos4 = e.clientY;
+	console.log(pos1, pos2, pos3, pos4);
+	terrariumElement.style.top = terrariumElement.offsetTop - pos2 + 'px';
+	terrariumElement.style.left = terrariumElement.offsetLeft - pos1 + 'px';
+}
+```
+В тази функция правите много редакции на началните позиции 1-4, които зададохте като локални променливи във външната функция. Какво се случва тук?
+
+Докато влачите, преназначавате `pos1`, като го правите равен на `pos3` (което зададохте по-рано като `e.clientX`) минус текущата стойност на `e.clientX`. Правите подобна операция за `pos2`. След това, нулирате `pos3` и `pos4` на новите X и Y координати на елемента. Можете да наблюдавате тези промени в конзолата, докато влачите. След това манипулирате CSS стила на растението, за да зададете новата му позиция въз основа на новите позиции на `pos1` и `pos2`, като изчислявате горните и левите X и Y координати на растението, сравнявайки неговото отместване с тези нови позиции.
+
+> `offsetTop` и `offsetLeft` са CSS свойства, които задават позицията на елемент въз основа на тази на неговия родител; неговият родител може да бъде всеки елемент, който не е позициониран като `static`. 
+
+Цялото това преизчисляване на позиционирането ви позволява да настроите поведението на терариума и неговите растения.
+
+### Задача 
+
+Последната задача за завършване на интерфейса е да добавите функцията `stopElementDrag` след затварящата фигурна скоба на `elementDrag`:
+
+```javascript
+function stopElementDrag() {
+	document.onpointerup = null;
+	document.onpointermove = null;
+}
+```
+
+Тази малка функция нулира събитията `onpointerup` и `onpointermove`, така че можете или да рестартирате прогреса на вашето растение, като започнете да го влачите отново, или да започнете да влачите ново растение.
+
+✅ Какво се случва, ако не зададете тези събития на null?
+
+Сега сте завършили вашия проект!
+
+🥇Поздравления! Завършихте вашия красив терариум. ![завършен терариум](../../../../translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.bg.png)
+
+---
+
+## 🚀Предизвикателство
+
+Добавете нов обработчик на събития към вашето затваряне, за да направите нещо повече с растенията; например, двойно кликване върху растение, за да го преместите на преден план. Бъдете креативни!
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/20)
+
+## Преглед и самостоятелно обучение
+
+Докато влаченето на елементи по екрана изглежда тривиално, има много начини да го направите и много капани, в зависимост от ефекта, който търсите. Всъщност има цял [API за влачене и пускане](https://developer.mozilla.org/docs/Web/API/HTML_Drag_and_Drop_API), който можете да опитате. Не го използвахме в този модул, защото ефектът, който искахме, беше малко по-различен, но опитайте този API във ваш собствен проект и вижте какво можете да постигнете.
+
+Намерете повече информация за събитията за указатели в [документите на W3C](https://www.w3.org/TR/pointerevents1/) и в [MDN web docs](https://developer.mozilla.org/docs/Web/API/Pointer_events).
+
+Винаги проверявайте възможностите на браузърите, използвайки [CanIUse.com](https://caniuse.com/).
+
+## Задание
+
+[Работете малко повече с DOM](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/3-intro-to-DOM-and-closures/assignment.md b/translations/bg/3-terrarium/3-intro-to-DOM-and-closures/assignment.md
new file mode 100644
index 00000000..5b0b40d1
--- /dev/null
+++ b/translations/bg/3-terrarium/3-intro-to-DOM-and-closures/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "22fb6c3cb570c47f1ac65048393941fa",
+  "translation_date": "2025-08-28T08:17:23+00:00",
+  "source_file": "3-terrarium/3-intro-to-DOM-and-closures/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Работете още малко с DOM
+
+## Инструкции
+
+Проучете DOM още малко, като 'осиновите' DOM елемент. Посетете [списъка с DOM интерфейси](https://developer.mozilla.org/docs/Web/API/Document_Object_Model) на MDN и изберете един. Намерете пример за неговото използване на уебсайт в интернет и напишете обяснение как се използва.
+
+## Оценяване
+
+| Критерии | Отлично                                      | Задоволително                                   | Нуждае се от подобрение |
+| -------- | -------------------------------------------- | ------------------------------------------------ | ----------------------- |
+|          | Представено е описание в параграф с пример   | Представено е описание в параграф без пример     | Не е представено описание |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/README.md b/translations/bg/3-terrarium/README.md
new file mode 100644
index 00000000..ff9244bc
--- /dev/null
+++ b/translations/bg/3-terrarium/README.md
@@ -0,0 +1,45 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "7965cd2bc5dc92ad888dc4c6ab2ab70a",
+  "translation_date": "2025-08-28T08:11:24+00:00",
+  "source_file": "3-terrarium/README.md",
+  "language_code": "bg"
+}
+-->
+# Моето терариумче: Проект за изучаване на HTML, CSS и манипулация на DOM с JavaScript 🌵🌱
+
+Малка медитация с плъзгане и пускане на код. С малко HTML, JS и CSS ще можете да създадете уеб интерфейс, да го стилизирате и дори да добавите множество интеракции по ваш избор.
+
+![моето терариумче](../../../translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.bg.png)
+
+# Уроци
+
+1. [Въведение в HTML](./1-intro-to-html/README.md)
+2. [Въведение в CSS](./2-intro-to-css/README.md)
+3. [Въведение в DOM и затваряния в JS](./3-intro-to-DOM-and-closures/README.md)
+
+## Кредити
+
+Написано с ♥️ от [Jen Looper](https://www.twitter.com/jenlooper)
+
+Терариумът, създаден чрез CSS, е вдъхновен от стъкления буркан на Jakub Mandra [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
+
+Илюстрациите са ръчно нарисувани от [Jen Looper](http://jenlooper.com) с помощта на Procreate.
+
+## Публикувайте вашето терариумче
+
+Можете да публикувате вашето терариумче в интернет, използвайки Azure Static Web Apps.
+
+1. Направете fork на това хранилище
+
+2. Натиснете този бутон
+
+[![Deploy to Azure button](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
+
+3. Следвайте стъпките в съветника за създаване на вашето приложение. Уверете се, че сте задали корена на приложението да бъде или `/solution`, или коренът на вашата кодова база. В това приложение няма API, така че не се притеснявайте да добавяте такова. Във вашето fork-нато хранилище ще бъде създадена папка за GitHub, която ще помогне на услугите за изграждане на Azure Static Web Apps да изградят и публикуват вашето приложение на нов URL адрес.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/3-terrarium/solution/README.md b/translations/bg/3-terrarium/solution/README.md
new file mode 100644
index 00000000..b43fb459
--- /dev/null
+++ b/translations/bg/3-terrarium/solution/README.md
@@ -0,0 +1,39 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "6329fbe8bd936068debd78cca6f09c0a",
+  "translation_date": "2025-08-28T08:13:28+00:00",
+  "source_file": "3-terrarium/solution/README.md",
+  "language_code": "bg"
+}
+-->
+# Моето терариумче: Проект за изучаване на HTML, CSS и манипулация на DOM с JavaScript 🌵🌱
+
+Малка медитация с влачене и пускане на код. С малко HTML, JS и CSS можете да създадете уеб интерфейс, да го стилизирате и да добавите интеракция.
+
+![моето терариумче](../../../../translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.bg.png)
+
+## Кредити
+
+Написано с ♥️ от [Jen Looper](https://www.twitter.com/jenlooper)
+
+Терариумът, създаден чрез CSS, е вдъхновен от стъкления буркан на Jakub Mandra [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
+
+Илюстрациите са ръчно нарисувани от [Jen Looper](http://jenlooper.com) с помощта на Procreate.
+
+## Публикувайте вашето терариумче
+
+Можете да публикувате вашето терариумче в интернет, използвайки Azure Static Web Apps.
+
+1. Направете fork на това хранилище
+
+2. Натиснете този бутон
+
+[![Бутон за публикуване в Azure](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
+
+3. Следвайте инструкциите в съветника за създаване на вашето приложение. Уверете се, че сте задали корена на приложението да бъде `/solution` или корена на вашата кодова база. В това приложение няма API, така че не се притеснявайте да добавяте такъв. Във вашето fork-нато хранилище ще бъде създадена папка .github, която ще помогне на услугата за изграждане на Azure Static Web Apps да изгради и публикува вашето приложение на нов URL адрес.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/4-typing-game/README.md b/translations/bg/4-typing-game/README.md
new file mode 100644
index 00000000..7ec45e14
--- /dev/null
+++ b/translations/bg/4-typing-game/README.md
@@ -0,0 +1,44 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "957547b822c40042e07d591c4fbfde4f",
+  "translation_date": "2025-08-28T08:21:02+00:00",
+  "source_file": "4-typing-game/README.md",
+  "language_code": "bg"
+}
+-->
+# Програмиране, базирано на събития - Създаване на игра за писане
+
+## Въведение
+
+Писането е едно от най-недооценените умения на разработчика. Способността бързо да прехвърляте мислите си от главата към редактора позволява на креативността да тече свободно. Един от най-добрите начини да се учите е чрез игра!
+
+> И така, нека създадем игра за писане!
+
+Ще използвате уменията си по JavaScript, HTML и CSS, които сте изградили досега, за да създадете игра за писане. Играта ще представи на играча случайна цитата (използваме цитати от [Шерлок Холмс](https://en.wikipedia.org/wiki/Sherlock_Holmes)) и ще измери колко време му отнема да я напише точно. Ще използвате уменията си по JavaScript, HTML и CSS, които сте изградили досега, за да създадете игра за писане.
+
+![демо](../../../4-typing-game/images/demo.gif)
+
+## Предпоставки
+
+Този урок предполага, че сте запознати със следните концепции:
+
+- Създаване на текстови полета за въвеждане и бутони
+- CSS и задаване на стилове чрез класове
+- Основи на JavaScript
+  - Създаване на масив
+  - Създаване на случайно число
+  - Получаване на текущото време
+
+## Урок
+
+[Създаване на игра за писане чрез програмиране, базирано на събития](./typing-game/README.md)
+
+## Кредити
+
+Написано с ♥️ от [Кристофър Харисън](http://www.twitter.com/geektrainer)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/4-typing-game/solution/README.md b/translations/bg/4-typing-game/solution/README.md
new file mode 100644
index 00000000..4f1df6c0
--- /dev/null
+++ b/translations/bg/4-typing-game/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T08:23:44+00:00",
+  "source_file": "4-typing-game/solution/README.md",
+  "language_code": "bg"
+}
+-->
+Това е заместител, оставен празен нарочно
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/4-typing-game/typing-game/README.md b/translations/bg/4-typing-game/typing-game/README.md
new file mode 100644
index 00000000..b3686757
--- /dev/null
+++ b/translations/bg/4-typing-game/typing-game/README.md
@@ -0,0 +1,353 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e982871b8388c59c22a41b73b5fca70f",
+  "translation_date": "2025-08-28T08:22:07+00:00",
+  "source_file": "4-typing-game/typing-game/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на игра с използване на събития
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/21)
+
+## Програмиране, базирано на събития
+
+Когато създаваме приложение за браузър, предоставяме графичен потребителски интерфейс (GUI), който потребителят използва за взаимодействие с това, което сме изградили. Най-често срещаният начин за взаимодействие с браузъра е чрез кликване и писане в различни елементи. Предизвикателството, пред което сме изправени като разработчици, е, че не знаем кога потребителят ще извърши тези действия!
+
+[Програмирането, базирано на събития](https://en.wikipedia.org/wiki/Event-driven_programming) е подходът, който трябва да използваме, за да създадем нашия GUI. Ако разгледаме малко по-подробно този термин, ще видим, че основната дума тук е **събитие**. [Събитие](https://www.merriam-webster.com/dictionary/event), според Merriam-Webster, се определя като "нещо, което се случва". Това описва нашата ситуация перфектно. Знаем, че нещо ще се случи, за което искаме да изпълним код в отговор, но не знаем кога точно ще се случи.
+
+Начинът, по който маркираме секция от код, която искаме да изпълним, е чрез създаване на функция. Когато мислим за [процедурно програмиране](https://en.wikipedia.org/wiki/Procedural_programming), функциите се извикват в определен ред. Същото важи и за програмирането, базирано на събития. Разликата е в **как** се извикват функциите.
+
+За да обработваме събития (като кликване на бутон, писане и т.н.), регистрираме **слушатели на събития**. Слушателят на събитие е функция, която "слуша" за настъпването на събитие и се изпълнява в отговор. Слушателите на събития могат да актуализират потребителския интерфейс, да правят заявки към сървъра или да извършват други действия в отговор на действията на потребителя. Добавяме слушател на събитие чрез [addEventListener](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener) и предоставяме функция за изпълнение.
+
+> **NOTE:** Струва си да се отбележи, че има множество начини за създаване на слушатели на събития. Можете да използвате анонимни функции или да създавате именувани функции. Можете да използвате различни преки пътища, като задаване на свойството `click` или използване на `addEventListener`. В нашето упражнение ще се фокусираме върху `addEventListener` и анонимни функции, тъй като това вероятно е най-често използваната техника от уеб разработчиците. Освен това е най-гъвкавата, тъй като `addEventListener` работи за всички събития, а името на събитието може да бъде предоставено като параметър.
+
+### Често срещани събития
+
+Има [десетки събития](https://developer.mozilla.org/docs/Web/Events), които можете да слушате, когато създавате приложение. Всъщност почти всяко действие на потребителя на страницата предизвиква събитие, което ви дава голяма свобода да осигурите желаното изживяване. За щастие, обикновено ще ви трябват само няколко събития. Ето някои от най-често срещаните (включително двете, които ще използваме при създаването на нашата игра):
+
+- [click](https://developer.mozilla.org/docs/Web/API/Element/click_event): Потребителят е кликнал върху нещо, обикновено бутон или хипервръзка
+- [contextmenu](https://developer.mozilla.org/docs/Web/API/Element/contextmenu_event): Потребителят е кликнал с десния бутон на мишката
+- [select](https://developer.mozilla.org/docs/Web/API/Element/select_event): Потребителят е маркирал текст
+- [input](https://developer.mozilla.org/docs/Web/API/Element/input_event): Потребителят е въвел текст
+
+## Създаване на играта
+
+Ще създадем игра, за да изследваме как работят събитията в JavaScript. Нашата игра ще тества уменията на играча за писане, което е едно от най-недооценените умения, които всички разработчици трябва да притежават. Всички трябва да практикуваме писането си! Общият поток на играта ще изглежда така:
+
+- Играчът кликва върху бутон за старт и му се показва цитат за писане
+- Играчът пише цитата възможно най-бързо в текстово поле
+  - С всяка завършена дума следващата се маркира
+  - Ако играчът направи грешка, текстовото поле се оцветява в червено
+  - Когато играчът завърши цитата, се показва съобщение за успех с изминалото време
+
+Нека изградим нашата игра и научим за събитията!
+
+### Структура на файловете
+
+Ще ни трябват общо три файла: **index.html**, **script.js** и **style.css**. Нека започнем с тях, за да улесним работата си.
+
+- Създайте нова папка за вашата работа, като отворите конзола или терминал и изпълните следната команда:
+
+```bash
+# Linux or macOS
+mkdir typing-game && cd typing-game
+
+# Windows
+md typing-game && cd typing-game
+```
+
+- Отворете Visual Studio Code
+
+```bash
+code .
+```
+
+- Добавете три файла в папката във Visual Studio Code със следните имена:
+  - index.html
+  - script.js
+  - style.css
+
+## Създаване на потребителския интерфейс
+
+Ако разгледаме изискванията, знаем, че ще ни трябват няколко елемента на нашата HTML страница. Това е като рецепта, където ни трябват някои съставки:
+
+- Място за показване на цитата, който потребителят трябва да напише
+- Място за показване на съобщения, като съобщение за успех
+- Текстово поле за писане
+- Бутон за старт
+
+Всеки от тези елементи ще се нуждае от ID, за да можем да работим с тях в нашия JavaScript. Ще добавим и препратки към CSS и JavaScript файловете, които ще създадем.
+
+Създайте нов файл с име **index.html**. Добавете следния HTML:
+
+```html
+<!-- inside index.html -->
+<html>
+<head>
+  <title>Typing game</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <h1>Typing game!</h1>
+  <p>Practice your typing skills with a quote from Sherlock Holmes. Click **start** to begin!</p>
+  <p id="quote"></p> <!-- This will display our quote -->
+  <p id="message"></p> <!-- This will display any status messages -->
+  <div>
+    <input type="text" aria-label="current word" id="typed-value" /> <!-- The textbox for typing -->
+    <button type="button" id="start">Start</button> <!-- To start the game -->
+  </div>
+  <script src="script.js"></script>
+</body>
+</html>
+```
+
+### Стартиране на приложението
+
+Винаги е най-добре да разработвате итеративно, за да видите как изглеждат нещата. Нека стартираме нашето приложение. Има чудесно разширение за Visual Studio Code, наречено [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon), което ще хоства вашето приложение локално и ще обновява браузъра всеки път, когато запазите.
+
+- Инсталирайте [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon), като следвате линка и кликнете върху **Install**
+  - Браузърът ще ви подкани да отворите Visual Studio Code, а след това Visual Studio Code ще ви подкани да извършите инсталацията
+  - Рестартирайте Visual Studio Code, ако бъдете подканени
+- След като инсталирате, във Visual Studio Code натиснете Ctrl-Shift-P (или Cmd-Shift-P), за да отворите командния палет
+- Напишете **Live Server: Open with Live Server**
+  - Live Server ще започне да хоства вашето приложение
+- Отворете браузър и навигирайте до **https://localhost:5500**
+- Вече трябва да виждате страницата, която създадохте!
+
+Нека добавим малко функционалност.
+
+## Добавяне на CSS
+
+С нашия HTML създаден, нека добавим CSS за основно стилизиране. Трябва да маркираме думата, която играчът трябва да напише, и да оцветим текстовото поле, ако това, което е написано, е грешно. Ще направим това с два класа.
+
+Създайте нов файл с име **style.css** и добавете следния синтаксис.
+
+```css
+/* inside style.css */
+.highlight {
+  background-color: yellow;
+}
+
+.error {
+  background-color: lightcoral;
+  border: red;
+}
+```
+
+✅ Когато става въпрос за CSS, можете да оформите страницата си както пожелаете. Отделете малко време, за да направите страницата по-привлекателна:
+
+- Изберете различен шрифт
+- Оцветете заглавията
+- Променете размера на елементите
+
+## JavaScript
+
+С нашия потребителски интерфейс създаден, е време да насочим вниманието си към JavaScript, който ще предостави логиката. Ще го разделим на няколко стъпки:
+
+- [Създаване на константите](../../../../4-typing-game/typing-game)
+- [Слушател на събитие за старт на играта](../../../../4-typing-game/typing-game)
+- [Слушател на събитие за писане](../../../../4-typing-game/typing-game)
+
+Но първо, създайте нов файл с име **script.js**.
+
+### Добавяне на константите
+
+Ще ни трябват няколко елемента, за да улесним програмирането. Отново, подобно на рецепта, ето какво ще ни трябва:
+
+- Масив със списък на всички цитати
+- Празен масив за съхранение на всички думи от текущия цитат
+- Пространство за съхранение на индекса на думата, която играчът пише в момента
+- Времето, когато играчът е кликнал старт
+
+Също така ще искаме препратки към елементите на потребителския интерфейс:
+
+- Текстовото поле (**typed-value**)
+- Показване на цитата (**quote**)
+- Съобщението (**message**)
+
+```javascript
+// inside script.js
+// all of our quotes
+const quotes = [
+    'When you have eliminated the impossible, whatever remains, however improbable, must be the truth.',
+    'There is nothing more deceptive than an obvious fact.',
+    'I ought to know by this time that when a fact appears to be opposed to a long train of deductions it invariably proves to be capable of bearing some other interpretation.',
+    'I never make exceptions. An exception disproves the rule.',
+    'What one man can invent another can discover.',
+    'Nothing clears up a case so much as stating it to another person.',
+    'Education never ends, Watson. It is a series of lessons, with the greatest for the last.',
+];
+// store the list of words and the index of the word the player is currently typing
+let words = [];
+let wordIndex = 0;
+// the starting time
+let startTime = Date.now();
+// page elements
+const quoteElement = document.getElementById('quote');
+const messageElement = document.getElementById('message');
+const typedValueElement = document.getElementById('typed-value');
+```
+
+✅ Добавете още цитати към вашата игра
+
+> **NOTE:** Можем да извличаме елементите, когато пожелаем в кода, като използваме `document.getElementById`. Поради факта, че ще се позоваваме на тези елементи редовно, ще избегнем грешки с низови литерали, като използваме константи. Фреймуъркове като [Vue.js](https://vuejs.org/) или [React](https://reactjs.org/) могат да ви помогнат да управлявате централизирането на вашия код.
+
+Отделете минута, за да гледате видео за използването на `const`, `let` и `var`
+
+[![Типове променливи](https://img.youtube.com/vi/JNIXfGiDWM8/0.jpg)](https://youtube.com/watch?v=JNIXfGiDWM8 "Типове променливи")
+
+> 🎥 Кликнете върху изображението по-горе за видео за променливи.
+
+### Добавяне на логика за старт
+
+За да започне играта, играчът ще кликне върху старт. Разбира се, не знаем кога ще кликне върху старт. Тук влиза в действие [слушателят на събитие](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener). Слушателят на събитие ще ни позволи да слушаме за настъпването на нещо (събитие) и да изпълним код в отговор. В нашия случай искаме да изпълним код, когато потребителят кликне върху старт.
+
+Когато потребителят кликне върху **старт**, трябва да изберем цитат, да настроим потребителския интерфейс и да настроим проследяването на текущата дума и времето. По-долу е JavaScript, който трябва да добавите; ще го обсъдим веднага след блока със скрипта.
+
+```javascript
+// at the end of script.js
+document.getElementById('start').addEventListener('click', () => {
+  // get a quote
+  const quoteIndex = Math.floor(Math.random() * quotes.length);
+  const quote = quotes[quoteIndex];
+  // Put the quote into an array of words
+  words = quote.split(' ');
+  // reset the word index for tracking
+  wordIndex = 0;
+
+  // UI updates
+  // Create an array of span elements so we can set a class
+  const spanWords = words.map(function(word) { return `<span>${word} </span>`});
+  // Convert into string and set as innerHTML on quote display
+  quoteElement.innerHTML = spanWords.join('');
+  // Highlight the first word
+  quoteElement.childNodes[0].className = 'highlight';
+  // Clear any prior messages
+  messageElement.innerText = '';
+
+  // Setup the textbox
+  // Clear the textbox
+  typedValueElement.value = '';
+  // set focus
+  typedValueElement.focus();
+  // set the event handler
+
+  // Start the timer
+  startTime = new Date().getTime();
+});
+```
+
+Нека разгледаме кода!
+
+- Настройка на проследяването на думите
+  - Използването на [Math.floor](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Math/floor) и [Math.random](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Math/random) ни позволява случайно да изберем цитат от масива `quotes`
+  - Преобразуваме `quote` в масив от `words`, за да можем да проследим думата, която играчът пише в момента
+  - `wordIndex` се задава на 0, тъй като играчът ще започне с първата дума
+- Настройка на потребителския интерфейс
+  - Създаваме масив от `spanWords`, който съдържа всяка дума в `span` елемент
+    - Това ще ни позволи да маркираме думата на дисплея
+  - `join` масива, за да създадем низ, който можем да използваме за актуализиране на `innerHTML` на `quoteElement`
+    - Това ще покаже цитата на играча
+  - Задаваме `className` на първия `span` елемент на `highlight`, за да го маркираме в жълто
+  - Изчистваме `messageElement`, като задаваме `innerText` на `''`
+- Настройка на текстовото поле
+  - Изчистваме текущата `value` на `typedValueElement`
+  - Задаваме `focus` на `typedValueElement`
+- Стартираме таймера, като извикваме `getTime`
+
+### Добавяне на логика за писане
+
+Докато играчът пише, се предизвиква събитие `input`. Този слушател на събитие ще провери дали играчът пише думата правилно и ще обработи текущия статус на играта. Върнете се към **script.js** и добавете следния код в края. Ще го разгледаме след това.
+
+```javascript
+// at the end of script.js
+typedValueElement.addEventListener('input', () => {
+  // Get the current word
+  const currentWord = words[wordIndex];
+  // get the current value
+  const typedValue = typedValueElement.value;
+
+  if (typedValue === currentWord && wordIndex === words.length - 1) {
+    // end of sentence
+    // Display success
+    const elapsedTime = new Date().getTime() - startTime;
+    const message = `CONGRATULATIONS! You finished in ${elapsedTime / 1000} seconds.`;
+    messageElement.innerText = message;
+  } else if (typedValue.endsWith(' ') && typedValue.trim() === currentWord) {
+    // end of word
+    // clear the typedValueElement for the new word
+    typedValueElement.value = '';
+    // move to the next word
+    wordIndex++;
+    // reset the class name for all elements in quote
+    for (const wordElement of quoteElement.childNodes) {
+      wordElement.className = '';
+    }
+    // highlight the new word
+    quoteElement.childNodes[wordIndex].className = 'highlight';
+  } else if (currentWord.startsWith(typedValue)) {
+    // currently correct
+    // highlight the next word
+    typedValueElement.className = '';
+  } else {
+    // error state
+    typedValueElement.className = 'error';
+  }
+});
+```
+
+Нека разгледаме кода! Започваме, като вземаме текущата дума и стойността, която играчът е написал досега. След това имаме логика тип "водопад", където проверяваме дали цитатът е завършен, думата е завършена, думата е правилна или (накрая), дали има грешка.
+
+- Цитатът е завършен, което се указва от `typedValue`, равен на `currentWord`, и `wordIndex`, равен на един по-малко от `length` на `words`
+  - Изчисляваме `elapsedTime`, като изваждаме `startTime` от текущото време
+  - Разделяме `elapsedTime` на 1,000, за да го преобразуваме от милисекунди в секунди
+  - Показваме съобщение за успех
+- Думата е завършена, което се указва от `typedValue`, завършващ с интервал (края на дума), и `typedValue`, равен на `currentWord`
+  - Задаваме `value` на `typedElement` на `''`, за да позволим следващата дума да бъде написана
+  - Увеличаваме `wordIndex`, за да преминем към следващата дума
+  - Преглеждаме всички `childNodes` на `quoteElement`, за да зададем `className` на `''`, за да се върнем към стандартния дисплей
+  - Задаваме `className` на текущата дума на `highlight`, за да я маркираме като следващата дума за писане
+- Думата е написана правилно (но не е завършена), което се указва от `currentWord`, започващ с `typedValue`
+  - Уверяваме се, че `typedValueElement` се показва като стандартен, като изчистваме `className`
+- Ако сме стигнали дотук, имаме грешка
+  - Задаваме `className` на `typedValueElement` на `error`
+
+## Тествайте вашето приложение
+
+Стигнахте до края! Последната стъпка е да се уверите, че вашето приложение работи. Опитайте го! Не се притеснявайте, ако има грешки; **всички разработчици** имат грешки. Анализирайте съобщенията и отстранявайте проблемите, ако е необходимо.
+
+Кликнете върху **старт** и започнете да пишете! Трябва да изглежда малко като анимацията, която видяхме преди.
+
+![Анимация на играта в действие](../../../../4-typing-game/images/demo.gif)
+
+---
+
+## 🚀 Предизвикателство
+
+Добавете повече функционалност
+
+- Деактивирайте слушателя на събитие `input` при завършване и го активирайте отново, когато бутонът бъде кликнат
+- Деактивирайте текстовото поле, когато играчът завърши цитата
+- Показвайте модален ди
+- Съхранявайте най-високите резултати, използвайки [localStorage](https://developer.mozilla.org/docs/Web/API/Window/localStorage)
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/22)
+
+## Преглед и самостоятелно обучение
+
+Прочетете за [всички налични събития](https://developer.mozilla.org/docs/Web/Events), достъпни за разработчиците чрез уеб браузъра, и обмислете сценариите, в които бихте използвали всяко от тях.
+
+## Задача
+
+[Създайте нова игра с клавиатура](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/4-typing-game/typing-game/assignment.md b/translations/bg/4-typing-game/typing-game/assignment.md
new file mode 100644
index 00000000..d74985df
--- /dev/null
+++ b/translations/bg/4-typing-game/typing-game/assignment.md
@@ -0,0 +1,26 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "de5384c118e15e4d1d0eaa00fc01b112",
+  "translation_date": "2025-08-28T08:23:30+00:00",
+  "source_file": "4-typing-game/typing-game/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Създайте нова игра с клавиатура
+
+## Инструкции
+
+Създайте малка игра, която използва събития от клавиатурата за изпълнение на задачи. Това може да бъде различен вид игра за писане или игра от арт тип, която рисува пиксели на екрана при натискане на клавиши. Бъдете креативни!
+
+## Критерии за оценка
+
+| Критерии | Отлично представяне      | Задоволително представяне | Нуждае се от подобрение |
+| -------- | ------------------------ | ------------------------- | ----------------------- |
+|          | Представена е цяла игра  | Играта е много минимална  | Играта има грешки       |
+|          |                          |                           |                         |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/1-about-browsers/README.md b/translations/bg/5-browser-extension/1-about-browsers/README.md
new file mode 100644
index 00000000..3932cb39
--- /dev/null
+++ b/translations/bg/5-browser-extension/1-about-browsers/README.md
@@ -0,0 +1,182 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "0bb55e0b98600afab801eea115228873",
+  "translation_date": "2025-08-28T07:42:27+00:00",
+  "source_file": "5-browser-extension/1-about-browsers/README.md",
+  "language_code": "bg"
+}
+-->
+# Проект за браузърно разширение, част 1: Всичко за браузърите
+
+![Скица на браузър](../../../../translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.bg.jpg)
+> Скица от [Wassim Chegham](https://dev.to/wassimchegham/ever-wondered-what-happens-when-you-type-in-a-url-in-an-address-bar-in-a-browser-3dob)
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/23)
+
+### Въведение
+
+Браузърните разширения добавят допълнителна функционалност към браузъра. Но преди да създадете такова, е добре да научите малко повече за това как браузърите работят.
+
+### За браузъра
+
+В тази серия от уроци ще научите как да създадете браузърно разширение, което ще работи на браузърите Chrome, Firefox и Edge. В тази част ще откриете как работят браузърите и ще изградите основните елементи на браузърното разширение.
+
+Но какво всъщност е браузърът? Това е софтуерно приложение, което позволява на крайния потребител да достъпва съдържание от сървър и да го показва на уеб страници.
+
+✅ Малко история: първият браузър се е наричал 'WorldWideWeb' и е създаден от сър Тимъти Бърнърс-Лий през 1990 година.
+
+![ранни браузъри](../../../../translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.bg.jpg)
+> Някои ранни браузъри, чрез [Karen McGrane](https://www.slideshare.net/KMcGrane/week-4-ixd-history-personal-computing)
+
+Когато потребител се свърже с интернет чрез URL (Uniform Resource Locator) адрес, обикновено използвайки Hypertext Transfer Protocol чрез адрес `http` или `https`, браузърът комуникира с уеб сървър и извлича уеб страница.
+
+На този етап, рендериращият двигател на браузъра я показва на устройството на потребителя, което може да бъде мобилен телефон, настолен компютър или лаптоп.
+
+Браузърите също така имат способността да кешират съдържание, за да не се налага то да бъде извличано от сървъра всеки път. Те могат да записват историята на активността на потребителя, да съхраняват 'бисквитки', които са малки частици данни, съдържащи информация за активността на потребителя, и още много други функции.
+
+Едно много важно нещо, което трябва да запомните за браузърите, е че те не са еднакви! Всеки браузър има своите силни и слаби страни, и професионалният уеб разработчик трябва да разбира как да направи уеб страниците да работят добре на различни браузъри. Това включва работа с малки екрани, като тези на мобилни телефони, както и с потребители, които са офлайн.
+
+Един много полезен уебсайт, който вероятно трябва да запазите в предпочитанията на браузъра, който използвате, е [caniuse.com](https://www.caniuse.com). Когато създавате уеб страници, е много полезно да използвате списъците на caniuse за поддържани технологии, за да можете най-добре да подкрепите своите потребители.
+
+✅ Как можете да разберете кои браузъри са най-популярни сред потребителите на вашия уебсайт? Проверете вашата аналитика - можете да инсталирате различни аналитични пакети като част от процеса на уеб разработка, и те ще ви покажат кои браузъри се използват най-често.
+
+## Браузърни разширения
+
+Защо бихте искали да създадете браузърно разширение? Това е удобен инструмент, който можете да добавите към браузъра си, когато имате нужда от бърз достъп до задачи, които често повтаряте. Например, ако често ви се налага да проверявате цветовете на различни уеб страници, с които взаимодействате, можете да инсталирате браузърно разширение за избор на цветове. Ако имате затруднения с запомнянето на пароли, можете да използвате браузърно разширение за управление на пароли.
+
+Създаването на браузърни разширения също е забавно. Те обикновено управляват ограничен брой задачи, които изпълняват добре.
+
+✅ Кои са вашите любими браузърни разширения? Какви задачи изпълняват?
+
+### Инсталиране на разширения
+
+Преди да започнете да създавате, разгледайте процеса на създаване и разгръщане на браузърно разширение. Въпреки че всеки браузър има малки разлики в начина, по който управлява тази задача, процесът е подобен на Chrome и Firefox, както в този пример за Edge:
+
+![екранна снимка на браузъра Edge, показваща отворената страница edge://extensions и менюто с настройки](../../../../translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.bg.png)
+
+> Забележка: Уверете се, че сте включили режим за разработчици и сте разрешили разширения от други магазини.
+
+По същество процесът ще бъде:
+
+- създайте вашето разширение, използвайки `npm run build` 
+- навигирайте в браузъра до панела с разширения, използвайки бутона "Настройки и още" (иконата `...`) в горния десен ъгъл
+- ако е нова инсталация, изберете `load unpacked`, за да качите ново разширение от папката му за изграждане (в нашия случай това е `/dist`) 
+- или, кликнете `reload`, ако презареждате вече инсталирано разширение
+
+✅ Тези инструкции се отнасят за разширения, които създавате сами; за да инсталирате разширения, които са публикувани в магазина за браузърни разширения, свързан с всеки браузър, трябва да навигирате до тези [магазини](https://microsoftedge.microsoft.com/addons/Microsoft-Edge-Extensions-Home) и да инсталирате разширението, което сте избрали.
+
+### Започнете
+
+Ще създадете браузърно разширение, което показва въглеродния отпечатък на вашия регион, като показва енергийното потребление на региона и източника на енергията. Разширението ще има форма, която събира API ключ, за да можете да достъпите API на CO2 Signal.
+
+**Необходимо ви е:**
+
+- [API ключ](https://www.co2signal.com/); въведете вашия имейл в полето на тази страница и ще ви бъде изпратен ключ
+- [код за вашия регион](http://api.electricitymap.org/v3/zones), съответстващ на [Electricity Map](https://www.electricitymap.org/map) (например, в Бостън използвам 'US-NEISO').
+- [начален код](../../../../5-browser-extension/start). Изтеглете папката `start`; ще завършите кода в тази папка.
+- [NPM](https://www.npmjs.com) - NPM е инструмент за управление на пакети; инсталирайте го локално и пакетите, изброени във вашия файл `package.json`, ще бъдат инсталирани за използване от вашия уеб актив
+
+✅ Научете повече за управлението на пакети в този [отличен модул за обучение](https://docs.microsoft.com/learn/modules/create-nodejs-project-dependencies/?WT.mc_id=academic-77807-sagibbon)
+
+Отделете минута, за да разгледате базата с код:
+
+dist
+    -|manifest.json (настройките по подразбиране са тук)
+    -|index.html (HTML маркировката за предния край е тук)
+    -|background.js (JS за фонови процеси е тук)
+    -|main.js (компилиран JS)
+src
+    -|index.js (вашият JS код е тук)
+
+✅ След като разполагате с вашия API ключ и код за региона, запазете ги някъде в бележка за бъдеща употреба.
+
+### Създайте HTML за разширението
+
+Това разширение има два изгледа. Един за събиране на API ключ и код за региона:
+
+![екранна снимка на завършеното разширение, отворено в браузър, показващо форма с полета за име на регион и API ключ.](../../../../translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.bg.png)
+
+И втори за показване на въглеродното потребление на региона:
+
+![екранна снимка на завършеното разширение, показващо стойности за въглеродно потребление и процент на изкопаеми горива за региона US-NEISO.](../../../../translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.bg.png)
+
+Нека започнем със създаването на HTML за формата и стилизирането му с CSS.
+
+В папката `/dist` ще създадете форма и зона за резултати. Във файла `index.html` попълнете обозначената зона за форма:
+
+```HTML
+<form class="form-data" autocomplete="on">
+	<div>
+		<h2>New? Add your Information</h2>
+	</div>
+	<div>
+		<label for="region">Region Name</label>
+		<input type="text" id="region" required class="region-name" />
+	</div>
+	<div>
+		<label for="api">Your API Key from tmrow</label>
+		<input type="text" id="api" required class="api-key" />
+	</div>
+	<button class="search-btn">Submit</button>
+</form>	
+```
+Това е формата, където вашата запазена информация ще бъде въведена и съхранена в локалното хранилище.
+
+След това създайте зоната за резултати; под последния таг на формата добавете няколко div елемента:
+
+```HTML
+<div class="result">
+	<div class="loading">loading...</div>
+	<div class="errors"></div>
+	<div class="data"></div>
+	<div class="result-container">
+		<p><strong>Region: </strong><span class="my-region"></span></p>
+		<p><strong>Carbon Usage: </strong><span class="carbon-usage"></span></p>
+		<p><strong>Fossil Fuel Percentage: </strong><span class="fossil-fuel"></span></p>
+	</div>
+	<button class="clear-btn">Change region</button>
+</div>
+```
+На този етап можете да опитате изграждане. Уверете се, че сте инсталирали зависимостите на пакета за това разширение:
+
+```
+npm install
+```
+
+Тази команда ще използва npm, мениджъра на пакети за Node, за да инсталира webpack за процеса на изграждане на вашето разширение. Можете да видите резултата от този процес, като погледнете в `/dist/main.js` - ще видите, че кодът е бил обединен.
+
+Засега разширението трябва да се изгради и, ако го разположите в Edge като разширение, ще видите форма, която е чисто показана.
+
+Поздравления, направихте първите стъпки към създаването на браузърно разширение. В следващите уроци ще го направите по-функционално и полезно.
+
+---
+
+## 🚀 Предизвикателство
+
+Разгледайте магазин за браузърни разширения и инсталирайте едно на вашия браузър. Можете да разгледате неговите файлове по интересни начини. Какво откривате?
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/24)
+
+## Преглед и самостоятелно обучение
+
+В този урок научихте малко за историята на уеб браузъра; използвайте тази възможност, за да научите повече за това как създателите на Световната мрежа са си представяли нейното използване, като прочетете повече за нейната история. Някои полезни сайтове включват:
+
+[История на уеб браузърите](https://www.mozilla.org/firefox/browsers/browser-history/)
+
+[История на мрежата](https://webfoundation.org/about/vision/history-of-the-web/)
+
+[Интервю с Тим Бърнърс-Лий](https://www.theguardian.com/technology/2019/mar/12/tim-berners-lee-on-30-years-of-the-web-if-we-dream-a-little-we-can-get-the-web-we-want)
+
+## Задание 
+
+[Променете стила на вашето разширение](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/1-about-browsers/assignment.md b/translations/bg/5-browser-extension/1-about-browsers/assignment.md
new file mode 100644
index 00000000..5e90c24d
--- /dev/null
+++ b/translations/bg/5-browser-extension/1-about-browsers/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e3c6f2a03c2336e60412612d870af547",
+  "translation_date": "2025-08-28T07:43:14+00:00",
+  "source_file": "5-browser-extension/1-about-browsers/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Променете стила на вашето разширение
+
+## Инструкции
+
+Кодовата база на това разширение идва с готови стилове, но не е задължително да ги използвате; направете разширението си уникално, като промените стила му чрез редактиране на css файла.
+
+## Критерии за оценка
+
+| Критерии | Отлично                                     | Задоволително         | Нуждае се от подобрение |
+| -------- | ------------------------------------------- | --------------------- | ----------------------- |
+|          | Кодът е предоставен с функционални нови стилове | Стиловете са непълни  | Стиловете са с грешки   |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/2-forms-browsers-local-storage/README.md b/translations/bg/5-browser-extension/2-forms-browsers-local-storage/README.md
new file mode 100644
index 00000000..f869135c
--- /dev/null
+++ b/translations/bg/5-browser-extension/2-forms-browsers-local-storage/README.md
@@ -0,0 +1,240 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e10f168beac4e7b05e30e0eb5c92bf11",
+  "translation_date": "2025-08-28T07:52:08+00:00",
+  "source_file": "5-browser-extension/2-forms-browsers-local-storage/README.md",
+  "language_code": "bg"
+}
+-->
+# Проект за браузърно разширение, част 2: Извикване на API, използване на локално хранилище
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/25)
+
+### Въведение
+
+В този урок ще извикате API, като изпратите формуляра на вашето браузърно разширение и покажете резултатите в него. Освен това ще научите как да съхранявате данни в локалното хранилище на браузъра за бъдеща справка и употреба.
+
+✅ Следвайте номерираните сегменти в съответните файлове, за да знаете къде да поставите кода си.
+
+### Настройка на елементите за манипулиране в разширението:
+
+До този момент сте създали HTML за формуляра и `<div>` за резултатите в браузърното разширение. Оттук нататък ще трябва да работите във файла `/src/index.js` и да изграждате разширението си стъпка по стъпка. Прегледайте [предишния урок](../1-about-browsers/README.md) за настройка на проекта и процеса на изграждане.
+
+Работейки във файла `index.js`, започнете със създаването на някои `const` променливи, които да държат стойностите, свързани с различни полета:
+
+```JavaScript
+// form fields
+const form = document.querySelector('.form-data');
+const region = document.querySelector('.region-name');
+const apiKey = document.querySelector('.api-key');
+
+// results
+const errors = document.querySelector('.errors');
+const loading = document.querySelector('.loading');
+const results = document.querySelector('.result-container');
+const usage = document.querySelector('.carbon-usage');
+const fossilfuel = document.querySelector('.fossil-fuel');
+const myregion = document.querySelector('.my-region');
+const clearBtn = document.querySelector('.clear-btn');
+```
+
+Всички тези полета се реферират чрез техния CSS клас, както сте го настроили в HTML в предишния урок.
+
+### Добавяне на слушатели
+
+След това добавете слушатели на събития към формуляра и бутона за изчистване, който нулира формуляра, така че ако потребителят изпрати формуляра или кликне върху бутона за нулиране, да се случи нещо. Добавете и извикване за инициализация на приложението в края на файла:
+
+```JavaScript
+form.addEventListener('submit', (e) => handleSubmit(e));
+clearBtn.addEventListener('click', (e) => reset(e));
+init();
+```
+
+✅ Обърнете внимание на съкратената форма, използвана за слушане на събития за изпращане или кликване, и как събитието се предава на функциите `handleSubmit` или `reset`. Можете ли да напишете еквивалента на тази съкратена форма в по-дълъг формат? Кой предпочитате?
+
+### Изграждане на функциите init() и reset():
+
+Сега ще изградите функцията, която инициализира разширението, наречена init():
+
+```JavaScript
+function init() {
+	//if anything is in localStorage, pick it up
+	const storedApiKey = localStorage.getItem('apiKey');
+	const storedRegion = localStorage.getItem('regionName');
+
+	//set icon to be generic green
+	//todo
+
+	if (storedApiKey === null || storedRegion === null) {
+		//if we don't have the keys, show the form
+		form.style.display = 'block';
+		results.style.display = 'none';
+		loading.style.display = 'none';
+		clearBtn.style.display = 'none';
+		errors.textContent = '';
+	} else {
+        //if we have saved keys/regions in localStorage, show results when they load
+        displayCarbonUsage(storedApiKey, storedRegion);
+		results.style.display = 'none';
+		form.style.display = 'none';
+		clearBtn.style.display = 'block';
+	}
+};
+
+function reset(e) {
+	e.preventDefault();
+	//clear local storage for region only
+	localStorage.removeItem('regionName');
+	init();
+}
+
+```
+
+В тази функция има интересна логика. Четейки я, можете ли да разберете какво се случва?
+
+- Две `const` променливи се създават, за да проверят дали потребителят е съхранил APIKey и регионален код в локалното хранилище.
+- Ако някоя от тях е null, показва формуляра, като променя стила му на 'block'.
+- Скрива областта за резултати, зареждане и бутона за изчистване, и задава текста за грешка като празен низ.
+- Ако има ключ и регион, започва рутина за:
+  - извикване на API за получаване на данни за въглеродна употреба,
+  - скриване на областта за резултати,
+  - скриване на формуляра,
+  - показване на бутона за нулиране.
+
+Преди да продължите, е полезно да научите за много важна концепция, налична в браузърите: [LocalStorage](https://developer.mozilla.org/docs/Web/API/Window/localStorage). LocalStorage е полезен начин за съхраняване на низове в браузъра като двойки `ключ-стойност`. Този тип уеб хранилище може да бъде манипулиран чрез JavaScript за управление на данни в браузъра. LocalStorage не изтича, докато SessionStorage, друг вид уеб хранилище, се изчиства при затваряне на браузъра. Различните видове хранилища имат своите плюсове и минуси.
+
+> Забележка - вашето браузърно разширение има собствено локално хранилище; основният прозорец на браузъра е отделен екземпляр и се държи независимо.
+
+Можете да зададете стойност на вашия APIKey, например, и да видите, че е зададен в Edge, като "инспектирате" уеб страница (можете да кликнете с десния бутон върху браузъра, за да инспектирате) и отидете в раздела Applications, за да видите хранилището.
+
+![Раздел за локално хранилище](../../../../translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.bg.png)
+
+✅ Помислете за ситуации, в които НЕ бихте искали да съхранявате някои данни в LocalStorage. Като цяло, поставянето на API ключове в LocalStorage е лоша идея! Можете ли да разберете защо? В нашия случай, тъй като приложението ни е само за обучение и няма да бъде публикувано в магазин за приложения, ще използваме този метод.
+
+Обърнете внимание, че използвате Web API за манипулиране на LocalStorage, като използвате `getItem()`, `setItem()` или `removeItem()`. Той е широко поддържан в браузърите.
+
+Преди да изградите функцията `displayCarbonUsage()`, която се извиква в `init()`, нека изградим функционалността за обработка на първоначалното изпращане на формуляра.
+
+### Обработка на изпращането на формуляра
+
+Създайте функция, наречена `handleSubmit`, която приема аргумент за събитие `(e)`. Спрете разпространението на събитието (в този случай искаме да спрем браузъра от обновяване) и извикайте нова функция, `setUpUser`, като предадете аргументите `apiKey.value` и `region.value`. По този начин използвате двете стойности, които се въвеждат чрез първоначалния формуляр, когато съответните полета са попълнени.
+
+```JavaScript
+function handleSubmit(e) {
+	e.preventDefault();
+	setUpUser(apiKey.value, region.value);
+}
+```
+
+✅ Освежете паметта си - HTML, който сте настроили в последния урок, има две полета за въвеждане, чиито `values` се улавят чрез `const`, които сте създали в началото на файла, и те са `required`, така че браузърът спира потребителите от въвеждане на null стойности.
+
+### Настройка на потребителя
+
+Продължавайки към функцията `setUpUser`, тук задавате стойности в локалното хранилище за apiKey и regionName. Добавете нова функция:
+
+```JavaScript
+function setUpUser(apiKey, regionName) {
+	localStorage.setItem('apiKey', apiKey);
+	localStorage.setItem('regionName', regionName);
+	loading.style.display = 'block';
+	errors.textContent = '';
+	clearBtn.style.display = 'block';
+	//make initial call
+	displayCarbonUsage(apiKey, regionName);
+}
+```
+
+Тази функция показва съобщение за зареждане, докато се извиква API. На този етап сте стигнали до създаването на най-важната функция на това браузърно разширение!
+
+### Показване на въглеродна употреба
+
+Накрая е време да направите заявка към API!
+
+Преди да продължим, трябва да обсъдим API. API, или [Application Programming Interfaces](https://www.webopedia.com/TERM/A/API.html), са критичен елемент в инструментариума на уеб разработчика. Те предоставят стандартни начини за взаимодействие и интерфейс между програми. Например, ако изграждате уеб сайт, който трябва да направи заявка към база данни, някой може да е създал API, който да използвате. Докато има много видове API, един от най-популярните е [REST API](https://www.smashingmagazine.com/2018/01/understanding-using-rest-api/).
+
+✅ Терминът 'REST' означава 'Representational State Transfer' и включва използването на различно конфигурирани URL адреси за извличане на данни. Направете малко проучване за различните видове API, достъпни за разработчиците. Кой формат ви допада?
+
+Има важни неща, които трябва да отбележите за тази функция. Първо, обърнете внимание на [`async` ключовата дума](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/async_function). Писането на вашите функции така, че да работят асинхронно, означава, че те изчакват завършването на действие, като например връщане на данни, преди да продължат.
+
+Ето кратко видео за `async`:
+
+[![Async и Await за управление на обещания](https://img.youtube.com/vi/YwmlRkrxvkk/0.jpg)](https://youtube.com/watch?v=YwmlRkrxvkk "Async и Await за управление на обещания")
+
+> 🎥 Кликнете върху изображението по-горе за видео за async/await.
+
+Създайте нова функция за заявка към C02Signal API:
+
+```JavaScript
+import axios from '../node_modules/axios';
+
+async function displayCarbonUsage(apiKey, region) {
+	try {
+		await axios
+			.get('https://api.co2signal.com/v1/latest', {
+				params: {
+					countryCode: region,
+				},
+				headers: {
+					'auth-token': apiKey,
+				},
+			})
+			.then((response) => {
+				let CO2 = Math.floor(response.data.data.carbonIntensity);
+
+				//calculateColor(CO2);
+
+				loading.style.display = 'none';
+				form.style.display = 'none';
+				myregion.textContent = region;
+				usage.textContent =
+					Math.round(response.data.data.carbonIntensity) + ' grams (grams C02 emitted per kilowatt hour)';
+				fossilfuel.textContent =
+					response.data.data.fossilFuelPercentage.toFixed(2) +
+					'% (percentage of fossil fuels used to generate electricity)';
+				results.style.display = 'block';
+			});
+	} catch (error) {
+		console.log(error);
+		loading.style.display = 'none';
+		results.style.display = 'none';
+		errors.textContent = 'Sorry, we have no data for the region you have requested.';
+	}
+}
+```
+
+Това е голяма функция. Какво се случва тук?
+
+- Следвайки добрите практики, използвате ключовата дума `async`, за да направите тази функция да работи асинхронно. Функцията съдържа блок `try/catch`, тъй като ще върне обещание, когато API върне данни. Тъй като нямате контрол върху скоростта, с която API ще отговори (може изобщо да не отговори!), трябва да се справите с тази несигурност, като я извикате асинхронно.
+- Правите заявка към co2signal API, за да получите данни за вашия регион, използвайки вашия API ключ. За да използвате този ключ, трябва да използвате вид автентикация в параметрите на заглавката.
+- След като API отговори, присвоявате различни елементи от неговите данни за отговор на частите от екрана, които сте настроили да показват тези данни.
+- Ако има грешка или няма резултат, показвате съобщение за грешка.
+
+✅ Използването на асинхронни програмни модели е още един много полезен инструмент във вашия арсенал. Прочетете [за различните начини](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/async_function), по които можете да конфигурирате този тип код.
+
+Поздравления! Ако изградите разширението си (`npm run build`) и го обновите в панела за разширения, имате работещо разширение! Единственото нещо, което не работи, е иконата, и ще го поправите в следващия урок.
+
+---
+
+## 🚀 Предизвикателство
+
+Обсъдихме няколко типа API досега в тези уроци. Изберете уеб API и проучете подробно какво предлага. Например, разгледайте API, достъпни в браузърите, като [HTML Drag and Drop API](https://developer.mozilla.org/docs/Web/API/HTML_Drag_and_Drop_API). Какво според вас прави един API страхотен?
+
+## Финален тест
+
+[Финален тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/26)
+
+## Преглед и самостоятелно обучение
+
+В този урок научихте за LocalStorage и API, и двете са много полезни за професионалния уеб разработчик. Можете ли да помислите как тези две неща работят заедно? Помислете как бихте проектирали уеб сайт, който съхранява елементи, които да се използват от API.
+
+## Задание
+
+[Осиновете API](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/2-forms-browsers-local-storage/assignment.md b/translations/bg/5-browser-extension/2-forms-browsers-local-storage/assignment.md
new file mode 100644
index 00000000..4eeeaeeb
--- /dev/null
+++ b/translations/bg/5-browser-extension/2-forms-browsers-local-storage/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "a0c78d1dd9d1acdbf7f52e7cc3ebe1a7",
+  "translation_date": "2025-08-28T07:52:56+00:00",
+  "source_file": "5-browser-extension/2-forms-browsers-local-storage/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Осиновете API
+
+## Инструкции
+
+API-тата могат да бъдат много забавни за използване. Ето [списък с много безплатни API-та](https://github.com/public-apis/public-apis). Изберете API и създайте браузър разширение, което решава даден проблем. Това може да бъде малък проблем, като липсата на достатъчно снимки на домашни любимци (например, използвайте [dog CEO API](https://dog.ceo/dog-api/)) или нещо по-голямо - забавлявайте се!
+
+## Критерии за оценка
+
+| Критерий | Отлично                                                                  | Задоволително                           | Нуждае се от подобрение |
+| -------- | ------------------------------------------------------------------------ | --------------------------------------- | ----------------------- |
+|          | Завършено браузър разширение е представено, използвайки API от горния списък | Частично браузър разширение е представено | Представеното съдържа грешки |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/3-background-tasks-and-performance/README.md b/translations/bg/5-browser-extension/3-background-tasks-and-performance/README.md
new file mode 100644
index 00000000..d04e70cf
--- /dev/null
+++ b/translations/bg/5-browser-extension/3-background-tasks-and-performance/README.md
@@ -0,0 +1,176 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "f198c6b817b4b2a99749f4662e7cae98",
+  "translation_date": "2025-08-28T07:45:33+00:00",
+  "source_file": "5-browser-extension/3-background-tasks-and-performance/README.md",
+  "language_code": "bg"
+}
+-->
+# Проект за браузърно разширение, част 3: Научете за фонови задачи и производителност
+
+## Тест преди лекцията
+
+[Тест преди лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/27)
+
+### Въведение
+
+В последните два урока от този модул научихте как да създадете форма и зона за показване на данни, извлечени от API. Това е много стандартен начин за създаване на уеб присъствие. Дори научихте как да обработвате асинхронно извличане на данни. Вашето браузърно разширение е почти завършено.
+
+Остава да управлявате някои фонови задачи, включително обновяване на цвета на иконата на разширението, така че това е чудесен момент да обсъдим как браузърът управлява този тип задачи. Нека разгледаме тези задачи в контекста на производителността на вашите уеб ресурси, докато ги изграждате.
+
+## Основи на уеб производителността
+
+> "Производителността на уебсайта се свежда до две неща: колко бързо се зарежда страницата и колко бързо работи кодът на нея." -- [Зак Гросбарт](https://www.smashingmagazine.com/2012/06/javascript-profiling-chrome-developer-tools/)
+
+Темата за това как да направите вашите уебсайтове изключително бързи на всякакви устройства, за всякакви потребители и в различни ситуации, е, разбира се, обширна. Ето някои точки, които да имате предвид, докато изграждате стандартен уеб проект или браузърно разширение.
+
+Първото нещо, което трябва да направите, за да се уверите, че вашият сайт работи ефективно, е да съберете данни за неговата производителност. Първото място, където можете да направите това, е в инструментите за разработчици на вашия уеб браузър. В Edge можете да изберете бутона "Настройки и още" (иконата с три точки в горния десен ъгъл на браузъра), след това да отидете на Още инструменти > Инструменти за разработчици и да отворите раздела "Производителност". Можете също да използвате клавишните комбинации `Ctrl` + `Shift` + `I` на Windows или `Option` + `Command` + `I` на Mac, за да отворите инструментите за разработчици.
+
+Разделът "Производителност" съдържа инструмент за профилиране. Отворете уебсайт (например [https://www.microsoft.com](https://www.microsoft.com/?WT.mc_id=academic-77807-sagibbon)) и кликнете върху бутона "Запис", след което обновете сайта. Спрете записа по всяко време и ще можете да видите рутините, които се генерират за 'скрипт', 'рендиране' и 'рисуване' на сайта:
+
+![Профилиране в Edge](../../../../translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.bg.png)
+
+✅ Посетете [документацията на Microsoft](https://docs.microsoft.com/microsoft-edge/devtools-guide/performance/?WT.mc_id=academic-77807-sagibbon) за панела "Производителност" в Edge.
+
+> Съвет: за да получите точни данни за времето за стартиране на вашия сайт, изчистете кеша на браузъра си.
+
+Изберете елементи от времевата линия на профила, за да увеличите събитията, които се случват, докато страницата ви се зарежда.
+
+Получете моментна снимка на производителността на вашата страница, като изберете част от времевата линия на профила и разгледате панела със сумарни данни:
+
+![Моментна снимка на профилирането в Edge](../../../../translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.bg.png)
+
+Проверете панела "Дневник на събитията", за да видите дали някое събитие е отнело повече от 15 ms:
+
+![Дневник на събитията в Edge](../../../../translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.bg.png)
+
+✅ Запознайте се с вашия инструмент за профилиране! Отворете инструментите за разработчици на този сайт и вижте дали има някакви тесни места. Кой е най-бавно зареждащият се ресурс? А най-бързият?
+
+## Проверки при профилиране
+
+Като цяло, има някои "проблемни области", които всеки уеб разработчик трябва да следи, когато изгражда сайт, за да избегне неприятни изненади при внедряване в продукция.
+
+**Размери на ресурсите**: Уебът стана "по-тежък" и съответно по-бавен през последните години. Част от това тегло се дължи на използването на изображения.
+
+✅ Разгледайте [Интернет архива](https://httparchive.org/reports/page-weight) за исторически преглед на теглото на страниците и още.
+
+Добра практика е да се уверите, че изображенията ви са оптимизирани и доставени в правилния размер и резолюция за вашите потребители.
+
+**Обхождане на DOM**: Браузърът трябва да изгради своя Document Object Model въз основа на кода, който пишете, така че в интерес на добрата производителност на страницата е да поддържате таговете минимални, като използвате и стилизирате само това, което е необходимо. Например, излишният CSS, свързан със страницата, може да бъде оптимизиран; стилове, които трябва да се използват само на една страница, не е необходимо да бъдат включени в основния стилов файл.
+
+**JavaScript**: Всеки JavaScript разработчик трябва да следи за скриптове, които блокират рендирането и трябва да бъдат заредени, преди останалата част от DOM да може да бъде обходена и нарисувана в браузъра. Помислете за използване на `defer` с вашите вградени скриптове (както е направено в модула Terrarium).
+
+✅ Изпробвайте някои сайтове на [уебсайт за тест на скоростта](https://www.webpagetest.org/), за да научите повече за обичайните проверки, които се правят за определяне на производителността на сайта.
+
+Сега, когато имате представа как браузърът рендира ресурсите, които му изпращате, нека разгледаме последните няколко неща, които трябва да направите, за да завършите вашето разширение:
+
+### Създайте функция за изчисляване на цвят
+
+Работейки в `/src/index.js`, добавете функция, наречена `calculateColor()` след поредицата от `const` променливи, които сте задали, за да получите достъп до DOM:
+
+```JavaScript
+function calculateColor(value) {
+	let co2Scale = [0, 150, 600, 750, 800];
+	let colors = ['#2AA364', '#F5EB4D', '#9E4229', '#381D02', '#381D02'];
+
+	let closestNum = co2Scale.sort((a, b) => {
+		return Math.abs(a - value) - Math.abs(b - value);
+	})[0];
+	console.log(value + ' is closest to ' + closestNum);
+	let num = (element) => element > closestNum;
+	let scaleIndex = co2Scale.findIndex(num);
+
+	let closestColor = colors[scaleIndex];
+	console.log(scaleIndex, closestColor);
+
+	chrome.runtime.sendMessage({ action: 'updateIcon', value: { color: closestColor } });
+}
+```
+
+Какво се случва тук? Подавате стойност (интензитета на въглерода) от API извикването, което завършихте в последния урок, и след това изчислявате колко близка е стойността му до индекса, представен в масива с цветове. След това изпращате тази най-близка цветова стойност към chrome runtime.
+
+Chrome.runtime има [API](https://developer.chrome.com/extensions/runtime), което обработва всякакви фонови задачи, и вашето разширение го използва:
+
+> "Използвайте chrome.runtime API, за да извлечете фоновата страница, да върнете детайли за манифеста и да слушате и отговаряте на събития в жизнения цикъл на приложението или разширението. Можете също да използвате този API, за да конвертирате относителния път на URL адреси в напълно квалифицирани URL адреси."
+
+✅ Ако разработвате това браузърно разширение за Edge, може да ви изненада, че използвате chrome API. По-новите версии на браузъра Edge работят на браузърния енджин Chromium, така че можете да използвате тези инструменти.
+
+> Забележка: ако искате да профилирате браузърно разширение, стартирайте инструментите за разработчици от самото разширение, тъй като то е отделен браузърен екземпляр.
+
+### Задайте цвят по подразбиране за иконата
+
+Сега, във функцията `init()`, задайте иконата да бъде обикновено зелена в началото, като отново извикате действието `updateIcon` на chrome:
+
+```JavaScript
+chrome.runtime.sendMessage({
+	action: 'updateIcon',
+		value: {
+			color: 'green',
+		},
+});
+```
+
+### Извикайте функцията, изпълнете извикването
+
+След това извикайте функцията, която току-що създадохте, като я добавите към обещанието, върнато от API на C02Signal:
+
+```JavaScript
+//let CO2...
+calculateColor(CO2);
+```
+
+И накрая, в `/dist/background.js`, добавете слушател за тези извиквания на фонови действия:
+
+```JavaScript
+chrome.runtime.onMessage.addListener(function (msg, sender, sendResponse) {
+	if (msg.action === 'updateIcon') {
+		chrome.browserAction.setIcon({ imageData: drawIcon(msg.value) });
+	}
+});
+//borrowed from energy lollipop extension, nice feature!
+function drawIcon(value) {
+	let canvas = document.createElement('canvas');
+	let context = canvas.getContext('2d');
+
+	context.beginPath();
+	context.fillStyle = value.color;
+	context.arc(100, 100, 50, 0, 2 * Math.PI);
+	context.fill();
+
+	return context.getImageData(50, 50, 100, 100);
+}
+```
+
+В този код добавяте слушател за всякакви съобщения, идващи към мениджъра на фонови задачи. Ако е наречено 'updateIcon', следващият код се изпълнява, за да нарисува икона с правилния цвят, използвайки Canvas API.
+
+✅ Ще научите повече за Canvas API в [уроците за космическата игра](../../6-space-game/2-drawing-to-canvas/README.md).
+
+Сега, изградете отново вашето разширение (`npm run build`), обновете и стартирайте разширението си и наблюдавайте как цветът се променя. Добър момент ли е да излезете за малко или да измиете чиниите? Сега знаете!
+
+Поздравления, създадохте полезно браузърно разширение и научихте повече за това как работи браузърът и как да профилирате неговата производителност.
+
+---
+
+## 🚀 Предизвикателство
+
+Разгледайте някои отворени уебсайтове, които съществуват отдавна, и въз основа на тяхната история в GitHub, вижте дали можете да определите как са били оптимизирани през годините за производителност, ако изобщо са били. Коя е най-честата проблемна точка?
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/28)
+
+## Преглед и самостоятелно обучение
+
+Обмислете да се абонирате за [бюлетин за производителност](https://perf.email/).
+
+Разгледайте някои от начините, по които браузърите оценяват уеб производителността, като прегледате разделите за производителност в техните уеб инструменти. Откривате ли някакви съществени разлики?
+
+## Задание
+
+[Анализирайте сайт за производителност](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/3-background-tasks-and-performance/assignment.md b/translations/bg/5-browser-extension/3-background-tasks-and-performance/assignment.md
new file mode 100644
index 00000000..80983708
--- /dev/null
+++ b/translations/bg/5-browser-extension/3-background-tasks-and-performance/assignment.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "fc09b0fb314a5ab0507ba99216e6a843",
+  "translation_date": "2025-08-28T07:46:30+00:00",
+  "source_file": "5-browser-extension/3-background-tasks-and-performance/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Анализ на сайт за производителност
+
+Предоставете подробен доклад за уебсайт, като посочите областите, където производителността е проблематична. Анализирайте защо сайтът е бавен и какво може да се направи, за да се ускори. Не разчитайте само на инструментите на браузъра, а направете проучване за други инструменти, които могат да помогнат за вашия доклад.
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                                                                   | Задоволително              | Нуждае се от подобрение       |
+| -------- | --------------------------------------------------------------------------------------------------------- | -------------------------- | ----------------------------- |
+|          | Представен е доклад с подробности, извлечени не само от инструменти на браузъра, но и от външни инструменти, ако са налични | Представен е основен доклад | Представен е минимален доклад |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/README.md b/translations/bg/5-browser-extension/README.md
new file mode 100644
index 00000000..a613f152
--- /dev/null
+++ b/translations/bg/5-browser-extension/README.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b121a279a6ab39878491f3e572673515",
+  "translation_date": "2025-08-28T07:41:27+00:00",
+  "source_file": "5-browser-extension/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на браузър разширение
+
+Създаването на браузър разширения е забавен и интересен начин да се замислите за производителността на вашите приложения, докато създавате различен тип уеб актив. Този модул включва уроци за това как работят браузърите, как да разположите браузър разширение, как да създадете форма, да извикате API, да използвате локално съхранение, както и как да оцените производителността на вашия уебсайт и да я подобрите.
+
+Ще създадете браузър разширение, което работи на Edge, Chrome и Firefox. Това разширение, което е като мини уебсайт, създаден за много специфична задача, проверява [C02 Signal API](https://www.co2signal.com) за електрическата консумация и въглеродната интензивност на даден регион и връща информация за въглеродния отпечатък на региона.
+
+Това разширение може да бъде извикано от потребител, след като въведе API ключ и код на регион във формата, за да определи местната електрическа консумация и по този начин да предостави данни, които могат да повлияят на решенията на потребителя относно електричеството. Например, може да е по-добре да се отложи пускането на сушилня за дрехи (дейност с висока въглеродна интензивност) по време на период на висока електрическа консумация във вашия регион.
+
+### Теми
+
+1. [За браузъра](1-about-browsers/README.md)
+2. [Форми и локално съхранение](2-forms-browsers-local-storage/README.md)
+3. [Фонови задачи и производителност](3-background-tasks-and-performance/README.md)
+
+### Кредити
+
+![зелено браузър разширение](../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Кредити
+
+Идеята за този уеб въглероден тригер беше предложена от Асим Хюсеин, ръководител в Microsoft на екипа за Green Cloud Advocacy и автор на [Green Principles](https://principles.green/). Първоначално това беше [проект за уебсайт](https://github.com/jlooper/green).
+
+Структурата на браузър разширението беше повлияна от [COVID разширението на Адебола Адениран](https://github.com/onedebos/covtension).
+
+Концепцията зад системата с икони "точка" беше предложена от структурата на иконите на [Energy Lollipop](https://energylollipop.com/) браузър разширението за емисиите в Калифорния.
+
+Тези уроци бяха написани с ♥️ от [Джен Лупър](https://www.twitter.com/jenlooper)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/README.md b/translations/bg/5-browser-extension/solution/README.md
new file mode 100644
index 00000000..fc99c46d
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/README.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "fab4e6b4f0efcd587a9029d82991f597",
+  "translation_date": "2025-08-28T07:47:25+00:00",
+  "source_file": "5-browser-extension/solution/README.md",
+  "language_code": "bg"
+}
+-->
+# Разширение за браузър Carbon Trigger: Завършен код
+
+Използвайки API на tmrow за CO2 Signal, създайте разширение за браузър, което да ви напомня директно в браузъра за натовареността на електрическата мрежа във вашия регион. Използването на това разширение ще ви помогне да вземате информирани решения за вашите дейности въз основа на тази информация.
+
+![екранна снимка на разширението](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Първи стъпки
+
+Трябва да имате инсталиран [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, използвайте менюто с „три точки“ в горния десен ъгъл на браузъра, за да намерите панела с разширения. Оттам изберете „Load Unpacked“, за да заредите ново разширение. Отворете папката „dist“ при подканата и разширението ще се зареди. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([вземете го тук чрез имейл](https://www.co2signal.com/) - въведете вашия имейл в полето на тази страница) и [код за вашия регион](http://api.electricitymap.org/v3/zones), съответстващ на [Electricity Map](https://www.electricitymap.org/map) (например в Бостън използвам 'US-NEISO').
+
+![инсталиране](../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на разширението на браузъра трябва да се промени, за да отрази енергийната натовареност на вашия регион. Тя ще ви даде насоки за това кои дейности, изискващи повече енергия, са подходящи за изпълнение. Концепцията зад тази система с „точка“ ми беше вдъхновена от [разширението Energy Lollipop](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/translation/README.es.md b/translations/bg/5-browser-extension/solution/translation/README.es.md
new file mode 100644
index 00000000..c79b398e
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/translation/README.es.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "cbaf73f94a9ab4c680a10ef871e92948",
+  "translation_date": "2025-08-28T07:49:04+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.es.md",
+  "language_code": "bg"
+}
+-->
+# Разширение за браузър Carbon Trigger: Пълен код
+
+Използвайки API за CO2 Signal от tmrow за проследяване на потреблението на електроенергия, създайте разширение за браузър, което да ви напомня директно в браузъра за потреблението на електроенергия във вашия регион. Използването на това разширение ще ви помогне да вземате решения за вашите дейности въз основа на тази информация.
+
+![екранна снимка на разширението](../../../../../translated_images/extension-screenshot.352c4c3ba54e4041ad2f6af749d562cc5705f527b5826efd53d11c3528f5ae45.bg.png)
+
+## Започване
+
+Трябва да имате инсталиран [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, използвайте менюто с „три точки“ в горния десен ъгъл на браузъра, за да намерите панела Разширения. Оттам изберете „Зареди разопаковано“, за да добавите ново разширение. Отворете папката 'dist', когато бъдете подканени, и разширението ще бъде заредено. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([получете го тук чрез имейл](https://www.co2signal.com/) - въведете вашия имейл в полето на тази страница) и [код за вашия регион](http://api.electricitymap.org/v3/zones), съответстващ на [Картата на електроенергията](https://www.electricitymap.org/map) (например в Бостън използвам 'US-NEISO').
+
+![инсталиране](../../../../../translated_images/install-on-edge.8bd0ee3ca7dcda1c5334b5195603a43c864e3b38d088b03d57376d25e77b9459.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на разширението на браузъра трябва да се промени, за да отрази потреблението на енергия във вашия регион и да ви даде индикатор за подходящите дейности с високо енергийно потребление. Концепцията зад тази система с „точки“ ми беше вдъхновена от [разширението Energy Lollipop](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/translation/README.fr.md b/translations/bg/5-browser-extension/solution/translation/README.fr.md
new file mode 100644
index 00000000..39f74d66
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/translation/README.fr.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9361268ca430b2579375009e1eceb5e5",
+  "translation_date": "2025-08-28T07:50:00+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.fr.md",
+  "language_code": "bg"
+}
+-->
+# Разширение за браузър Carbon Trigger: Завършен код
+
+Използвайки API-то на CO2 Signal от tmrow за проследяване на потреблението на електроенергия, създайте разширение за браузър, което да ви напомня директно в браузъра за потреблението на електроенергия във вашия регион. Използването на това разширение ще ви помогне да вземате информирани решения за вашите дейности въз основа на тази информация.
+
+![екранна снимка на разширението](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Начало
+
+Трябва да имате инсталиран [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате на Edge, използвайте менюто с 'три точки' в горния десен ъгъл на браузъра, за да намерите панела за разширения. Оттам изберете 'Зареждане на разархивирано разширение', за да добавите ново разширение. Отворете папката 'dist', когато бъдете подканени, и разширението ще се зареди. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([вземете го тук по имейл](https://www.co2signal.com/) - въведете вашия имейл в полето на тази страница) и [код за вашия регион](http://api.electricitymap.org/v3/zones), съответстващ на [Картата на електроенергията](https://www.electricitymap.org/map) (например за Бостън използвам 'US-NEISO').
+
+![инсталация](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на разширенията на браузъра трябва да се промени, за да отрази потреблението на енергия във вашия регион. Това ще ви даде индикатор за енергоемките дейности, които е подходящо да извършвате. Концепцията зад тази система с 'точки' ми беше вдъхновена от [разширението Energy Lollipop](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/translation/README.hi.md b/translations/bg/5-browser-extension/solution/translation/README.hi.md
new file mode 100644
index 00000000..8f58ed5d
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/translation/README.hi.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "dd58ae1b7707034f055718c1b68bc8de",
+  "translation_date": "2025-08-28T07:47:52+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.hi.md",
+  "language_code": "bg"
+}
+-->
+# Carbon Trigger Browser Extension: Завършен код
+
+Използване на API на CO2 Signal от tmrow за проследяване на потреблението на електроенергия, създаване на браузър разширение, което да ви напомня колко натоварено е потреблението на електроенергия във вашия регион. Използването на това разширение ще ви помогне да вземате решения за вашите дейности въз основа на тази информация.
+
+![Скрийншот на разширението](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Започване
+
+Трябва да инсталирате [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, използвайте менюто „три точки“ в горния десен ъгъл на браузъра, за да намерите панела за разширения. Оттам изберете „Load unpacked“, за да заредите ново разширение. В подканата отворете папката „dist“ и разширението ще бъде заредено. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([получете го тук чрез имейл](https://www.co2signal.com/) – въведете вашия имейл в полето на страницата) и [код за вашия регион](http://api.electricitymap.org/v3/zones) от [Electricity Map](https://www.electricitymap.org/map) (например, за Бостън използвам „US-NEISO“).
+
+![Инсталиране](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на браузър разширението трябва да се промени, за да отразява потреблението на енергия във вашия регион и да ви даде индикатор за това кои енергоемки дейности са подходящи за изпълнение. Концепцията за тази система с „точка“ ми беше вдъхновена от [Energy Lollipop Extension](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/translation/README.it.md b/translations/bg/5-browser-extension/solution/translation/README.it.md
new file mode 100644
index 00000000..85b9cbfb
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/translation/README.it.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9a6b22a2eff0f499b66236be973b24ad",
+  "translation_date": "2025-08-28T07:48:15+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.it.md",
+  "language_code": "bg"
+}
+-->
+# Разширение за браузър Carbon Trigger: код за стартиране
+
+Ще използваме API-то Signal CO2 на tmrow, за да следим потреблението на електричество и да създадем разширение за браузър, което да ви напомня директно в браузъра колко интензивно е използването на електричество във вашия регион. Използването на това специално разширение ще ви помогне да оцените дейностите си въз основа на тази информация.
+
+![екранна снимка на разширението](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Начало
+
+Необходимо е [npm](https://npmjs.com) да бъде инсталиран. Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, използвайте менюто с "три точки" в горния десен ъгъл на браузъра, за да намерите панела за разширения. Ако не е активиран, включете Режим за разработчици (в долния ляв ъгъл). Изберете "Зареди разархивирано", за да добавите ново разширение. Отворете папката "dist" в подканата и разширението ще бъде заредено. За да го използвате, ще ви е необходим API ключ за CO2 Signal API (можете да го [получите тук чрез имейл](https://www.co2signal.com/) - въведете своя имейл в полето на тази страница) и [код за вашия регион](http://api.electricitymap.org/v3/zones), съответстващ на [електрическата карта](https://www.electricitymap.org/map) (например за Бостън, "US-NEISO").
+
+![инсталация](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на разширението на браузъра трябва да се промени, за да отрази енергийното потребление на региона и да предостави насоки за това кои дейности с висока енергийна консумация са подходящи за изпълнение. Концепцията зад тази система с "точки" е вдъхновена от [разширението Energy Lollipop](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/translation/README.ja.md b/translations/bg/5-browser-extension/solution/translation/README.ja.md
new file mode 100644
index 00000000..74be6c55
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/translation/README.ja.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3f5e6821e0febccfc5d05e7c944d9e3d",
+  "translation_date": "2025-08-28T07:48:41+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.ja.md",
+  "language_code": "bg"
+}
+-->
+# Разширение за браузър Carbon Trigger: Завършен код
+
+Създайте разширение за браузър, което използва API на CO2 Signal от tmrow, за да следи потреблението на енергия във вашия регион и да го показва като напомняне директно в браузъра. Това разширение може да се използва, за да вземате информирани решения относно вашите дейности въз основа на тази информация.
+
+![екранна снимка на разширението](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Въведение
+
+Необходимо е да имате инсталиран [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети.
+
+```
+npm install
+```
+
+Изградете разширението с помощта на webpack.
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, намерете панела „Разширения“ от менюто с „три точки“ в горния десен ъгъл на браузъра. Оттам изберете „Load Unpacked“ и заредете новото разширение. Когато бъдете подканени, отворете папката „dist“, за да заредите разширението. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([вземете го тук чрез имейл](https://www.co2signal.com/) - въведете имейла си в полето на тази страница) и [код за вашия регион](http://api.electricitymap.org/v3/zones), съвместим с [Electricity Map](https://www.electricitymap.org/map) (например за Бостън използвайте 'US-NEISO').
+
+![инсталиране](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветна точка, която се показва в лентата на разширенията на браузъра, ще се променя, за да отразява енергийното потребление във вашия регион. Това ще ви помогне да определите кои дейности, изискващи енергия, са подходящи в момента. Концепцията за тази „точкова“ система е вдъхновена от [Energy Lollipop extension](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/solution/translation/README.ms.md b/translations/bg/5-browser-extension/solution/translation/README.ms.md
new file mode 100644
index 00000000..89c2292b
--- /dev/null
+++ b/translations/bg/5-browser-extension/solution/translation/README.ms.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "21b364c158c8e4f698de65eeac16c9fe",
+  "translation_date": "2025-08-28T07:49:33+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.ms.md",
+  "language_code": "bg"
+}
+-->
+# Разширение за браузър Carbon Trigger: Пълен код
+
+Използвайки API на CO2 Signal от tmrow за проследяване на електрическата консумация, създайте разширение за браузър, което да ви предупреждава за нивото на електрическа консумация във вашия регион. Използването на това разширение ще ви помогне да вземате информирани решения относно вашите дейности въз основа на тази информация.
+
+![екранна снимка на разширението за браузър](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Започнете оттук
+
+Трябва да инсталирате [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, използвайте менюто с „три точки“ в горния десен ъгъл на браузъра, за да намерите панела Разширения. Оттам изберете „Load Unpacked“, за да заредите новото разширение. Отворете папката 'dist', когато бъдете подканени, и разширението ще бъде заредено. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([вземете го тук чрез имейл](https://www.co2signal.com/) - въведете имейла си в полето на страницата) и [код за вашия регион](http://api.electricitymap.org/v3/zones), който съответства на [Electricity Map](https://www.electricitymap.org/map) (например в Бостън използвам 'US-NEISO').
+
+![изтегляне](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на разширението на браузъра ще се променя, за да отразява енергийната консумация във вашия регион и ще ви дава насоки за подходящи дейности. Концепцията зад системата с „точки“ беше вдъхновена от [разширението за браузър Energy Lollipop](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/5-browser-extension/start/README.md b/translations/bg/5-browser-extension/start/README.md
new file mode 100644
index 00000000..519fbc64
--- /dev/null
+++ b/translations/bg/5-browser-extension/start/README.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "26fd39046d264ba185dcb086d3a8cf3e",
+  "translation_date": "2025-08-28T07:46:59+00:00",
+  "source_file": "5-browser-extension/start/README.md",
+  "language_code": "bg"
+}
+-->
+# Carbon Trigger Browser Extension: Начален код
+
+Използвайки API на tmrow за CO2 Signal, можете да следите електрическата консумация и да създадете разширение за браузър, което да ви напомня директно в браузъра колко интензивно е използването на електроенергия във вашия регион. Използването на това разширение ще ви помогне да вземате информирани решения за вашите дейности въз основа на тази информация.
+
+![екранна снимка на разширението](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.bg.png)
+
+## Първи стъпки
+
+Трябва да имате инсталиран [npm](https://npmjs.com). Изтеглете копие на този код в папка на вашия компютър.
+
+Инсталирайте всички необходими пакети:
+
+```
+npm install
+```
+
+Създайте разширението с помощта на webpack:
+
+```
+npm run build
+```
+
+За да го инсталирате в Edge, използвайте менюто с „три точки“ в горния десен ъгъл на браузъра, за да намерите панела с разширения. Оттам изберете „Load Unpacked“, за да заредите ново разширение. Отворете папката „dist“ при подканата и разширението ще се зареди. За да го използвате, ще ви е необходим API ключ за CO2 Signal ([вземете го тук чрез имейл](https://www.co2signal.com/) - въведете вашия имейл в полето на тази страница) и [код за вашия регион](http://api.electricitymap.org/v3/zones), съответстващ на [Electricity Map](https://www.electricitymap.org/map) (например, в Бостън използвам „US-NEISO“).
+
+![инсталиране](../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.bg.png)
+
+След като въведете API ключа и региона в интерфейса на разширението, цветната точка в лентата на разширението на браузъра трябва да се промени, за да отрази енергийната консумация във вашия регион. Тя ще ви даде насоки за това кои дейности, изискващи повече енергия, са подходящи за изпълнение. Концепцията зад тази система с „точка“ ми беше вдъхновена от [Energy Lollipop разширението](https://energylollipop.com/) за емисиите в Калифорния.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/1-introduction/README.md b/translations/bg/6-space-game/1-introduction/README.md
new file mode 100644
index 00000000..5f40baef
--- /dev/null
+++ b/translations/bg/6-space-game/1-introduction/README.md
@@ -0,0 +1,238 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "d9da6dc61fb712b29f65e108c79b8a5d",
+  "translation_date": "2025-08-28T08:01:58+00:00",
+  "source_file": "6-space-game/1-introduction/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра Част 1: Въведение
+
+![видео](../../../../6-space-game/images/pewpew.gif)
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/29)
+
+### Наследяване и композиция в разработката на игри
+
+В предишните уроци не беше необходимо да се замисляте много за архитектурата на приложенията, които създавахте, тъй като проектите бяха с малък обхват. Но когато приложенията ви нарастват по размер и сложност, архитектурните решения стават по-важни. Има два основни подхода за създаване на по-големи приложения в JavaScript: *композиция* или *наследяване*. И двата подхода имат своите предимства и недостатъци, но нека ги обясним в контекста на игра.
+
+✅ Една от най-известните книги за програмиране е свързана с [дизайн модели](https://en.wikipedia.org/wiki/Design_Patterns).
+
+В една игра имате `обекти на играта`, които са обекти, съществуващи на екрана. Това означава, че те имат местоположение в декартова координатна система, характеризирано с `x` и `y` координати. Докато разработвате игра, ще забележите, че всички обекти на играта имат стандартни свойства, общи за всяка игра, която създавате, а именно елементи, които са:
+
+- **базирани на местоположение** Повечето, ако не всички, елементи на играта са базирани на местоположение. Това означава, че те имат местоположение, `x` и `y`.
+- **подвижни** Това са обекти, които могат да се преместят на ново местоположение. Обикновено това е герой, чудовище или NPC (персонаж, който не е играч), но не например статичен обект като дърво.
+- **самоунищожаващи се** Това са обекти, които съществуват само за определен период от време, преди да се подготвят за изтриване. Обикновено това се представя чрез булева стойност `dead` или `destroyed`, която сигнализира на игровия двигател, че този обект вече не трябва да се визуализира.
+- **с временно ограничение** 'Временно ограничение' е типично свойство за краткотрайни обекти. Типичен пример е текст или графичен ефект като експлозия, който трябва да се вижда само за няколко милисекунди.
+
+✅ Помислете за игра като Pac-Man. Можете ли да идентифицирате четирите типа обекти, изброени по-горе, в тази игра?
+
+### Изразяване на поведение
+
+Всичко, което описахме по-горе, представлява поведение, което обектите на играта могат да имат. Как можем да кодираме това? Можем да изразим това поведение като методи, свързани с класове или обекти.
+
+**Класове**
+
+Идеята е да използваме `класове` в комбинация с `наследяване`, за да добавим определено поведение към даден клас.
+
+✅ Наследяването е важна концепция за разбиране. Научете повече от [статията на MDN за наследяване](https://developer.mozilla.org/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).
+
+Изразено чрез код, обект на играта обикновено изглежда така:
+
+```javascript
+
+//set up the class GameObject
+class GameObject {
+  constructor(x, y, type) {
+    this.x = x;
+    this.y = y;
+    this.type = type;
+  }
+}
+
+//this class will extend the GameObject's inherent class properties
+class Movable extends GameObject {
+  constructor(x,y, type) {
+    super(x,y, type)
+  }
+
+//this movable object can be moved on the screen
+  moveTo(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+}
+
+//this is a specific class that extends the Movable class, so it can take advantage of all the properties that it inherits
+class Hero extends Movable {
+  constructor(x,y) {
+    super(x,y, 'Hero')
+  }
+}
+
+//this class, on the other hand, only inherits the GameObject properties
+class Tree extends GameObject {
+  constructor(x,y) {
+    super(x,y, 'Tree')
+  }
+}
+
+//a hero can move...
+const hero = new Hero();
+hero.moveTo(5,5);
+
+//but a tree cannot
+const tree = new Tree();
+```
+
+✅ Отделете няколко минути, за да си представите герой от Pac-Man (например Inky, Pinky или Blinky) и как би изглеждал в JavaScript.
+
+**Композиция**
+
+Друг начин за управление на наследяването на обекти е чрез използване на *композиция*. Тогава обектите изразяват своето поведение по следния начин:
+
+```javascript
+//create a constant gameObject
+const gameObject = {
+  x: 0,
+  y: 0,
+  type: ''
+};
+
+//...and a constant movable
+const movable = {
+  moveTo(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+}
+//then the constant movableObject is composed of the gameObject and movable constants
+const movableObject = {...gameObject, ...movable};
+
+//then create a function to create a new Hero who inherits the movableObject properties
+function createHero(x, y) {
+  return {
+    ...movableObject,
+    x,
+    y,
+    type: 'Hero'
+  }
+}
+//...and a static object that inherits only the gameObject properties
+function createStatic(x, y, type) {
+  return {
+    ...gameObject
+    x,
+    y,
+    type
+  }
+}
+//create the hero and move it
+const hero = createHero(10,10);
+hero.moveTo(5,5);
+//and create a static tree which only stands around
+const tree = createStatic(0,0, 'Tree'); 
+```
+
+**Кой модел да използвам?**
+
+Изборът зависи от вас. JavaScript поддържа и двата подхода.
+
+--
+
+Друг модел, често срещан в разработката на игри, се занимава с проблема за управлението на потребителското изживяване и производителността на играта.
+
+## Модел Pub/sub
+
+✅ Pub/Sub означава 'публикуване-абониране'
+
+Този модел разглежда идеята, че различните части на вашето приложение не трябва да знаят една за друга. Защо? Това прави много по-лесно да се разбере какво се случва като цяло, ако различните части са разделени. Също така улеснява внезапната промяна на поведението, ако е необходимо. Как постигаме това? Чрез установяване на някои концепции:
+
+- **съобщение**: Съобщението обикновено е текстов низ, придружен от опционален полезен товар (част от данни, която уточнява за какво е съобщението). Типично съобщение в игра може да бъде `KEY_PRESSED_ENTER`.
+- **публикуващ**: Този елемент *публикува* съобщение и го изпраща до всички абонати.
+- **абонат**: Този елемент *слуша* конкретни съобщения и изпълнява определена задача в резултат на получаването на това съобщение, като например изстрелване на лазер.
+
+Реализацията е доста малка по размер, но това е много мощен модел. Ето как може да бъде реализиран:
+
+```javascript
+//set up an EventEmitter class that contains listeners
+class EventEmitter {
+  constructor() {
+    this.listeners = {};
+  }
+//when a message is received, let the listener to handle its payload
+  on(message, listener) {
+    if (!this.listeners[message]) {
+      this.listeners[message] = [];
+    }
+    this.listeners[message].push(listener);
+  }
+//when a message is sent, send it to a listener with some payload
+  emit(message, payload = null) {
+    if (this.listeners[message]) {
+      this.listeners[message].forEach(l => l(message, payload))
+    }
+  }
+}
+
+```
+
+За да използваме горния код, можем да създадем много малка реализация:
+
+```javascript
+//set up a message structure
+const Messages = {
+  HERO_MOVE_LEFT: 'HERO_MOVE_LEFT'
+};
+//invoke the eventEmitter you set up above
+const eventEmitter = new EventEmitter();
+//set up a hero
+const hero = createHero(0,0);
+//let the eventEmitter know to watch for messages pertaining to the hero moving left, and act on it
+eventEmitter.on(Messages.HERO_MOVE_LEFT, () => {
+  hero.move(5,0);
+});
+
+//set up the window to listen for the keyup event, specifically if the left arrow is hit, emit a message to move the hero left
+window.addEventListener('keyup', (evt) => {
+  if (evt.key === 'ArrowLeft') {
+    eventEmitter.emit(Messages.HERO_MOVE_LEFT)
+  }
+});
+```
+
+Горе свързваме събитие от клавиатурата, `ArrowLeft`, и изпращаме съобщението `HERO_MOVE_LEFT`. Слушаме това съобщение и преместваме `hero` в резултат. Силата на този модел е, че слушателят на събития и героят не знаят един за друг. Можете да пренасочите `ArrowLeft` към клавиша `A`. Освен това е възможно да направите нещо напълно различно при `ArrowLeft`, като направите няколко редакции на функцията `on` на eventEmitter:
+
+```javascript
+eventEmitter.on(Messages.HERO_MOVE_LEFT, () => {
+  hero.move(5,0);
+});
+```
+
+Когато играта ви стане по-сложна, този модел остава със същата сложност, а кодът ви остава чист. Силно се препоръчва да възприемете този модел.
+
+---
+
+## 🚀 Предизвикателство
+
+Помислете как моделът pub-sub може да подобри играта. Кои части трябва да излъчват събития и как играта трябва да реагира на тях? Сега е вашият шанс да бъдете креативни, като измислите нова игра и как нейните части могат да се държат.
+
+## Финален тест
+
+[Финален тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/30)
+
+## Преглед и самостоятелно обучение
+
+Научете повече за Pub/Sub, като [прочетете за него](https://docs.microsoft.com/azure/architecture/patterns/publisher-subscriber/?WT.mc_id=academic-77807-sagibbon).
+
+## Задание
+
+[Създайте макет на игра](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/1-introduction/assignment.md b/translations/bg/6-space-game/1-introduction/assignment.md
new file mode 100644
index 00000000..d442b973
--- /dev/null
+++ b/translations/bg/6-space-game/1-introduction/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "009bdedee9cc82988264be8cb31f9bf4",
+  "translation_date": "2025-08-28T08:02:37+00:00",
+  "source_file": "6-space-game/1-introduction/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Създайте макет на игра
+
+## Инструкции
+
+Използвайки примерите с код от урока, създайте представяне на игра, която ви харесва. Тя трябва да бъде проста игра, но целта е да използвате или шаблона с класове, или този с композиция, както и модела pub/sub, за да покажете как една игра може да се стартира. Бъдете креативни!
+
+## Критерии за оценка
+
+| Критерий | Отлично                                                | Задоволително                                        | Нуждае се от подобрение                             |
+| -------- | ------------------------------------------------------ | --------------------------------------------------- | -------------------------------------------------- |
+|          | Три елемента са поставени на екрана и манипулирани     | Два елемента са поставени на екрана и манипулирани  | Един елемент е поставен на екрана и манипулиран    |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/2-drawing-to-canvas/README.md b/translations/bg/6-space-game/2-drawing-to-canvas/README.md
new file mode 100644
index 00000000..2a4e9746
--- /dev/null
+++ b/translations/bg/6-space-game/2-drawing-to-canvas/README.md
@@ -0,0 +1,230 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "41be8d35e7f30aa9dad10773c35e89c4",
+  "translation_date": "2025-08-28T07:59:15+00:00",
+  "source_file": "6-space-game/2-drawing-to-canvas/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра, част 2: Рисуване на герой и чудовища върху Canvas
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/31)
+
+## Canvas
+
+Canvas е HTML елемент, който по подразбиране няма съдържание; той е празно платно. Трябва да добавите съдържание, като рисувате върху него.
+
+✅ Прочетете [повече за Canvas API](https://developer.mozilla.org/docs/Web/API/Canvas_API) на MDN.
+
+Ето как обикновено се декларира като част от тялото на страницата:
+
+```html
+<canvas id="myCanvas" width="200" height="100"></canvas>
+```
+
+Горе задаваме `id`, `width` и `height`.
+
+- `id`: задайте го, за да можете да получите референция, когато трябва да взаимодействате с него.
+- `width`: това е ширината на елемента.
+- `height`: това е височината на елемента.
+
+## Рисуване на прости геометрични фигури
+
+Canvas използва картезианска координатна система за рисуване. Следователно използва x-ос и y-ос, за да изрази местоположението на нещо. Местоположението `0,0` е горният ляв ъгъл, а долният десен е това, което сте задали като WIDTH и HEIGHT на платното.
+
+![мрежата на Canvas](../../../../translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.bg.png)  
+> Изображение от [MDN](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes)
+
+За да рисувате върху елемента Canvas, трябва да преминете през следните стъпки:
+
+1. **Получете референция** към елемента Canvas.
+1. **Получете референция** към елемента Context, който се намира върху Canvas.
+1. **Извършете операция за рисуване** с помощта на елемента Context.
+
+Кодът за горните стъпки обикновено изглежда така:
+
+```javascript
+// draws a red rectangle
+//1. get the canvas reference
+canvas = document.getElementById("myCanvas");
+
+//2. set the context to 2D to draw basic shapes
+ctx = canvas.getContext("2d");
+
+//3. fill it with the color red
+ctx.fillStyle = 'red';
+
+//4. and draw a rectangle with these parameters, setting location and size
+ctx.fillRect(0,0, 200, 200) // x,y,width, height
+```
+
+✅ Canvas API основно се фокусира върху 2D форми, но можете също да рисувате 3D елементи на уеб страница; за това може да използвате [WebGL API](https://developer.mozilla.org/docs/Web/API/WebGL_API).
+
+С Canvas API можете да рисувате всякакви неща, като:
+
+- **Геометрични фигури**: вече показахме как да нарисувате правоъгълник, но има много повече, което можете да нарисувате.
+- **Текст**: можете да нарисувате текст с всякакъв шрифт и цвят, който пожелаете.
+- **Изображения**: можете да нарисувате изображение, базирано на актив като .jpg или .png например.
+
+✅ Опитайте! Знаете как да нарисувате правоъгълник, можете ли да нарисувате кръг на страницата? Разгледайте някои интересни рисунки с Canvas в CodePen. Ето [особено впечатляващ пример](https://codepen.io/dissimulate/pen/KrAwx).
+
+## Зареждане и рисуване на изображение
+
+Можете да заредите изображение, като създадете обект `Image` и зададете неговото свойство `src`. След това слушате събитието `load`, за да знаете кога е готово за използване. Кодът изглежда така:
+
+### Зареждане на актив
+
+```javascript
+const img = new Image();
+img.src = 'path/to/my/image.png';
+img.onload = () => {
+  // image loaded and ready to be used
+}
+```
+
+### Шаблон за зареждане на актив
+
+Препоръчително е да обвиете горното в конструкция като тази, за да е по-лесно за използване и да се опитате да го манипулирате само когато е напълно заредено:
+
+```javascript
+function loadAsset(path) {
+  return new Promise((resolve) => {
+    const img = new Image();
+    img.src = path;
+    img.onload = () => {
+      // image loaded and ready to be used
+      resolve(img);
+    }
+  })
+}
+
+// use like so
+
+async function run() {
+  const heroImg = await loadAsset('hero.png')
+  const monsterImg = await loadAsset('monster.png')
+}
+
+```
+
+За да нарисувате активи от играта на екрана, вашият код би изглеждал така:
+
+```javascript
+async function run() {
+  const heroImg = await loadAsset('hero.png')
+  const monsterImg = await loadAsset('monster.png')
+
+  canvas = document.getElementById("myCanvas");
+  ctx = canvas.getContext("2d");
+  ctx.drawImage(heroImg, canvas.width/2,canvas.height/2);
+  ctx.drawImage(monsterImg, 0,0);
+}
+```
+
+## Време е да започнете да изграждате вашата игра
+
+### Какво да изградите
+
+Ще създадете уеб страница с елемент Canvas. Тя трябва да показва черен екран с размери `1024*768`. Предоставили сме ви две изображения:
+
+- Кораб на героя
+
+   ![Кораб на героя](../../../../translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.bg.png)
+
+- 5*5 чудовища
+
+   ![Кораб на чудовището](../../../../translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.bg.png)
+
+### Препоръчителни стъпки за започване на разработката
+
+Намерете файловете, които са създадени за вас в подпапката `your-work`. Тя трябва да съдържа следното:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Отворете копие на тази папка в Visual Studio Code. Трябва да имате локална среда за разработка, за предпочитане с Visual Studio Code с NPM и Node инсталирани. Ако нямате `npm` настроен на вашия компютър, [ето как да го направите](https://www.npmjs.com/get-npm).
+
+Започнете вашия проект, като навигирате до папката `your_work`:
+
+```bash
+cd your-work
+npm start
+```
+
+Горният код ще стартира HTTP сървър на адрес `http://localhost:5000`. Отворете браузър и въведете този адрес. В момента страницата е празна, но това ще се промени.
+
+> Забележка: за да видите промените на екрана, обновете браузъра си.
+
+### Добавяне на код
+
+Добавете необходимия код в `your-work/app.js`, за да решите следното:
+
+1. **Нарисувайте** Canvas с черен фон  
+   > съвет: добавете два реда под съответния TODO в `/app.js`, задавайки елемента `ctx` да бъде черен, а горните/левите координати да са 0,0, а височината и ширината да съответстват на Canvas.
+2. **Заредете** текстури  
+   > съвет: добавете изображенията на играча и врага, използвайки `await loadTexture` и подавайки пътя на изображението. Все още няма да ги видите на екрана!
+3. **Нарисувайте** героя в центъра на екрана в долната половина  
+   > съвет: използвайте API-то `drawImage`, за да нарисувате heroImg на екрана, задавайки `canvas.width / 2 - 45` и `canvas.height - canvas.height / 4)`.
+4. **Нарисувайте** 5*5 чудовища  
+   > съвет: сега можете да разкоментирате кода за рисуване на враговете на екрана. След това отидете във функцията `createEnemies` и я изградете.
+
+   Първо, задайте някои константи:
+
+    ```javascript
+    const MONSTER_TOTAL = 5;
+    const MONSTER_WIDTH = MONSTER_TOTAL * 98;
+    const START_X = (canvas.width - MONSTER_WIDTH) / 2;
+    const STOP_X = START_X + MONSTER_WIDTH;
+    ```
+
+    след това създайте цикъл, за да нарисувате масива от чудовища на екрана:
+
+    ```javascript
+    for (let x = START_X; x < STOP_X; x += 98) {
+        for (let y = 0; y < 50 * 5; y += 50) {
+          ctx.drawImage(enemyImg, x, y);
+        }
+      }
+    ```
+
+## Резултат
+
+Завършеният резултат трябва да изглежда така:
+
+![Черен екран с герой и 5*5 чудовища](../../../../translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.bg.png)
+
+## Решение
+
+Опитайте първо да го решите сами, но ако се затрудните, погледнете [решението](../../../../6-space-game/2-drawing-to-canvas/solution/app.js).
+
+---
+
+## 🚀 Предизвикателство
+
+Научихте за рисуване с 2D-фокусирания Canvas API; разгледайте [WebGL API](https://developer.mozilla.org/docs/Web/API/WebGL_API) и опитайте да нарисувате 3D обект.
+
+## Последващ тест
+
+[Последващ тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/32)
+
+## Преглед и самостоятелно обучение
+
+Научете повече за Canvas API, като [прочетете за него](https://developer.mozilla.org/docs/Web/API/Canvas_API).
+
+## Задание
+
+[Играйте с Canvas API](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/2-drawing-to-canvas/assignment.md b/translations/bg/6-space-game/2-drawing-to-canvas/assignment.md
new file mode 100644
index 00000000..b8c0e19e
--- /dev/null
+++ b/translations/bg/6-space-game/2-drawing-to-canvas/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "ca1cf78a4c60df77ab32a154ec024d7f",
+  "translation_date": "2025-08-28T07:59:52+00:00",
+  "source_file": "6-space-game/2-drawing-to-canvas/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Играйте с Canvas API
+
+## Инструкции
+
+Изберете един елемент от Canvas API и създайте нещо интересно около него. Можете ли да създадете малка галактика от повтарящи се звезди? Можете ли да създадете интересна текстура от цветни линии? Можете да разгледате CodePen за вдъхновение (но не копирайте).
+
+## Критерии за оценка
+
+| Критерии | Примерно изпълнение                                       | Задоволително изпълнение           | Нуждае се от подобрение |
+| -------- | --------------------------------------------------------- | ----------------------------------- | ----------------------- |
+|          | Кодът е подаден и показва интересна текстура или форма    | Кодът е подаден, но не се изпълнява | Кодът не е подаден     |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/3-moving-elements-around/README.md b/translations/bg/6-space-game/3-moving-elements-around/README.md
new file mode 100644
index 00000000..34187f7b
--- /dev/null
+++ b/translations/bg/6-space-game/3-moving-elements-around/README.md
@@ -0,0 +1,402 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "23f088add24f0f1fa51014a9e27ea280",
+  "translation_date": "2025-08-28T07:54:04+00:00",
+  "source_file": "6-space-game/3-moving-elements-around/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра, част 3: Добавяне на движение
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/33)
+
+Игрите не са много забавни, докато не започнат да се появяват извънземни на екрана! В тази игра ще използваме два типа движения:
+
+- **Движение с клавиатура/мишка**: когато потребителят взаимодейства с клавиатурата или мишката, за да премести обект на екрана.
+- **Движение, предизвикано от играта**: когато играта премества обект с определен времеви интервал.
+
+Как всъщност движим нещата на екрана? Всичко се свежда до картезиански координати: променяме местоположението (x, y) на обекта и след това прерисуваме екрана.
+
+Обикновено са нужни следните стъпки, за да постигнем *движение* на екрана:
+
+1. **Задаване на ново местоположение** за обект; това е необходимо, за да изглежда, че обектът се е преместил.
+2. **Изчистване на екрана**, екранът трябва да бъде изчистен между рисуванията. Можем да го изчистим, като нарисуваме правоъгълник, който запълваме с фонов цвят.
+3. **Прерисуване на обекта** на новото местоположение. По този начин постигаме преместването на обекта от едно място на друго.
+
+Ето как може да изглежда това в код:
+
+```javascript
+//set the hero's location
+hero.x += 5;
+// clear the rectangle that hosts the hero
+ctx.clearRect(0, 0, canvas.width, canvas.height);
+// redraw the game background and hero
+ctx.fillRect(0, 0, canvas.width, canvas.height)
+ctx.fillStyle = "black";
+ctx.drawImage(heroImg, hero.x, hero.y);
+```
+
+✅ Можете ли да се сетите за причина, поради която прерисуването на героя много кадри в секунда може да доведе до разходи за производителност? Прочетете за [алтернативи на този модел](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas).
+
+## Обработка на събития от клавиатурата
+
+Обработвате събития, като свързвате специфични събития с код. Събитията от клавиатурата се задействат върху целия прозорец, докато събитията от мишката, като `click`, могат да бъдат свързани с кликване върху конкретен елемент. Ще използваме събития от клавиатурата през целия проект.
+
+За да обработите събитие, трябва да използвате метода `addEventListener()` на прозореца и да му предоставите два входни параметъра. Първият параметър е името на събитието, например `keyup`. Вторият параметър е функцията, която трябва да бъде извикана в резултат на настъпването на събитието.
+
+Ето пример:
+
+```javascript
+window.addEventListener('keyup', (evt) => {
+  // `evt.key` = string representation of the key
+  if (evt.key === 'ArrowUp') {
+    // do something
+  }
+})
+```
+
+За събития от клавиатурата има две свойства на събитието, които можете да използвате, за да видите кой клавиш е натиснат:
+
+- `key`, това е текстово представяне на натиснатия клавиш, например `ArrowUp`.
+- `keyCode`, това е числово представяне, например `37`, което съответства на `ArrowLeft`.
+
+✅ Манипулирането на събития от клавиатурата е полезно извън разработката на игри. За какви други приложения можете да се сетите за тази техника?
+
+### Специални клавиши: предупреждение
+
+Има някои *специални* клавиши, които влияят на прозореца. Това означава, че ако слушате събитие `keyup` и използвате тези специални клавиши, за да преместите героя си, това също ще извърши хоризонтално превъртане. Поради тази причина може да искате да *изключите* това вградено поведение на браузъра, докато изграждате играта си. Ще ви трябва код като този:
+
+```javascript
+let onKeyDown = function (e) {
+  console.log(e.keyCode);
+  switch (e.keyCode) {
+    case 37:
+    case 39:
+    case 38:
+    case 40: // Arrow keys
+    case 32:
+      e.preventDefault();
+      break; // Space
+    default:
+      break; // do not block other keys
+  }
+};
+
+window.addEventListener('keydown', onKeyDown);
+```
+
+Горният код ще гарантира, че клавишите със стрелки и клавишът за интервал имат своето *по подразбиране* поведение изключено. Механизмът за *изключване* се случва, когато извикваме `e.preventDefault()`.
+
+## Движение, предизвикано от играта
+
+Можем да накараме нещата да се движат сами, като използваме таймери като функциите `setTimeout()` или `setInterval()`, които актуализират местоположението на обекта при всяко тикване или времеви интервал. Ето как може да изглежда това:
+
+```javascript
+let id = setInterval(() => {
+  //move the enemy on the y axis
+  enemy.y += 10;
+})
+```
+
+## Игровият цикъл
+
+Игровият цикъл е концепция, която представлява функция, извиквана на редовни интервали. Нарича се игров цикъл, защото всичко, което трябва да бъде видимо за потребителя, се рисува в цикъла. Игровият цикъл използва всички игрови обекти, които са част от играта, като рисува всички тях, освен ако по някаква причина не трябва да бъдат част от играта. Например, ако обектът е враг, който е бил ударен от лазер и се е взривил, той вече не е част от текущия игров цикъл (ще научите повече за това в следващите уроци).
+
+Ето как обикновено може да изглежда игров цикъл, изразен в код:
+
+```javascript
+let gameLoopId = setInterval(() =>
+  function gameLoop() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    ctx.fillStyle = "black";
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+    drawHero();
+    drawEnemies();
+    drawStaticObjects();
+}, 200);
+```
+
+Горният цикъл се извиква на всеки `200` милисекунди, за да прерисува платното. Имате възможност да изберете най-добрия интервал, който има смисъл за вашата игра.
+
+## Продължаване на космическата игра
+
+Ще вземете съществуващия код и ще го разширите. Можете да започнете с кода, който сте завършили по време на част I, или да използвате кода от [Част II - стартов](../../../../6-space-game/3-moving-elements-around/your-work).
+
+- **Движение на героя**: ще добавите код, за да гарантирате, че можете да движите героя с помощта на клавишите със стрелки.
+- **Движение на враговете**: ще трябва също да добавите код, за да гарантирате, че враговете се движат отгоре надолу с определена скорост.
+
+## Препоръчителни стъпки
+
+Намерете файловете, които са създадени за вас в подпапката `your-work`. Тя трябва да съдържа следното:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Започнете проекта си в папката `your_work`, като напишете:
+
+```bash
+cd your-work
+npm start
+```
+
+Горният код ще стартира HTTP сървър на адрес `http://localhost:5000`. Отворете браузър и въведете този адрес, в момента трябва да се визуализира героят и всички врагове; нищо не се движи - все още!
+
+### Добавяне на код
+
+1. **Добавете специални обекти** за `hero`, `enemy` и `game object`, те трябва да имат свойства `x` и `y`. (Спомнете си частта за [Наследяване или композиция](../README.md)).
+
+   *ПОДСКАЗКА* `game object` трябва да бъде този с `x` и `y` и способността да се рисува върху платно.
+
+   >подсказка: започнете, като добавите нов клас GameObject с неговия конструктор, дефиниран както следва, и след това го нарисувайте върху платното:
+  
+    ```javascript
+        
+    class GameObject {
+      constructor(x, y) {
+        this.x = x;
+        this.y = y;
+        this.dead = false;
+        this.type = "";
+        this.width = 0;
+        this.height = 0;
+        this.img = undefined;
+      }
+    
+      draw(ctx) {
+        ctx.drawImage(this.img, this.x, this.y, this.width, this.height);
+      }
+    }
+    ```
+
+    Сега разширете този GameObject, за да създадете Hero и Enemy.
+    
+    ```javascript
+    class Hero extends GameObject {
+      constructor(x, y) {
+        ...it needs an x, y, type, and speed
+      }
+    }
+    ```
+
+    ```javascript
+    class Enemy extends GameObject {
+      constructor(x, y) {
+        super(x, y);
+        (this.width = 98), (this.height = 50);
+        this.type = "Enemy";
+        let id = setInterval(() => {
+          if (this.y < canvas.height - this.height) {
+            this.y += 5;
+          } else {
+            console.log('Stopped at', this.y)
+            clearInterval(id);
+          }
+        }, 300)
+      }
+    }
+    ```
+
+2. **Добавете обработчици на събития от клавиатурата**, за да обработвате навигацията с клавиши (преместване на героя нагоре/надолу, наляво/надясно).
+
+   *ЗАПОМНЕТЕ* това е картезианска система, горният ляв ъгъл е `0,0`. Също така не забравяйте да добавите код за спиране на *поведение по подразбиране*.
+
+   >подсказка: създайте своя функция onKeyDown и я свържете с прозореца:
+
+   ```javascript
+    let onKeyDown = function (e) {
+	      console.log(e.keyCode);
+	        ...add the code from the lesson above to stop default behavior
+	      }
+    };
+
+    window.addEventListener("keydown", onKeyDown);
+   ```
+    
+   Проверете конзолата на браузъра си на този етап и наблюдавайте регистрирането на натисканията на клавиши.
+
+3. **Реализирайте** [Модела Pub-Sub](../README.md), това ще поддържа кода ви чист, докато следвате останалите части.
+
+   За да направите тази последна част, можете:
+
+   1. **Добавете слушател на събития** към прозореца:
+
+       ```javascript
+        window.addEventListener("keyup", (evt) => {
+          if (evt.key === "ArrowUp") {
+            eventEmitter.emit(Messages.KEY_EVENT_UP);
+          } else if (evt.key === "ArrowDown") {
+            eventEmitter.emit(Messages.KEY_EVENT_DOWN);
+          } else if (evt.key === "ArrowLeft") {
+            eventEmitter.emit(Messages.KEY_EVENT_LEFT);
+          } else if (evt.key === "ArrowRight") {
+            eventEmitter.emit(Messages.KEY_EVENT_RIGHT);
+          }
+        });
+        ```
+
+    1. **Създайте клас EventEmitter**, за да публикувате и абонирате съобщения:
+
+        ```javascript
+        class EventEmitter {
+          constructor() {
+            this.listeners = {};
+          }
+        
+          on(message, listener) {
+            if (!this.listeners[message]) {
+              this.listeners[message] = [];
+            }
+            this.listeners[message].push(listener);
+          }
+        
+          emit(message, payload = null) {
+            if (this.listeners[message]) {
+              this.listeners[message].forEach((l) => l(message, payload));
+            }
+          }
+        }
+        ```
+
+    1. **Добавете константи** и настройте EventEmitter:
+
+        ```javascript
+        const Messages = {
+          KEY_EVENT_UP: "KEY_EVENT_UP",
+          KEY_EVENT_DOWN: "KEY_EVENT_DOWN",
+          KEY_EVENT_LEFT: "KEY_EVENT_LEFT",
+          KEY_EVENT_RIGHT: "KEY_EVENT_RIGHT",
+        };
+        
+        let heroImg, 
+            enemyImg, 
+            laserImg,
+            canvas, ctx, 
+            gameObjects = [], 
+            hero, 
+            eventEmitter = new EventEmitter();
+        ```
+
+    1. **Инициализирайте играта**
+
+    ```javascript
+    function initGame() {
+      gameObjects = [];
+      createEnemies();
+      createHero();
+    
+      eventEmitter.on(Messages.KEY_EVENT_UP, () => {
+        hero.y -=5 ;
+      })
+    
+      eventEmitter.on(Messages.KEY_EVENT_DOWN, () => {
+        hero.y += 5;
+      });
+    
+      eventEmitter.on(Messages.KEY_EVENT_LEFT, () => {
+        hero.x -= 5;
+      });
+    
+      eventEmitter.on(Messages.KEY_EVENT_RIGHT, () => {
+        hero.x += 5;
+      });
+    }
+    ```
+
+1. **Настройте игровия цикъл**
+
+   Рефакторирайте функцията window.onload, за да инициализирате играта и да настроите игров цикъл на подходящ интервал. Ще добавите и лазерен лъч:
+
+    ```javascript
+    window.onload = async () => {
+      canvas = document.getElementById("canvas");
+      ctx = canvas.getContext("2d");
+      heroImg = await loadTexture("assets/player.png");
+      enemyImg = await loadTexture("assets/enemyShip.png");
+      laserImg = await loadTexture("assets/laserRed.png");
+    
+      initGame();
+      let gameLoopId = setInterval(() => {
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        ctx.fillStyle = "black";
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+        drawGameObjects(ctx);
+      }, 100)
+      
+    };
+    ```
+
+5. **Добавете код** за движение на враговете на определен интервал
+
+    Рефакторирайте функцията `createEnemies()`, за да създадете враговете и да ги добавите към новия клас gameObjects:
+
+    ```javascript
+    function createEnemies() {
+      const MONSTER_TOTAL = 5;
+      const MONSTER_WIDTH = MONSTER_TOTAL * 98;
+      const START_X = (canvas.width - MONSTER_WIDTH) / 2;
+      const STOP_X = START_X + MONSTER_WIDTH;
+    
+      for (let x = START_X; x < STOP_X; x += 98) {
+        for (let y = 0; y < 50 * 5; y += 50) {
+          const enemy = new Enemy(x, y);
+          enemy.img = enemyImg;
+          gameObjects.push(enemy);
+        }
+      }
+    }
+    ```
+    
+    и добавете функция `createHero()`, за да направите подобен процес за героя.
+    
+    ```javascript
+    function createHero() {
+      hero = new Hero(
+        canvas.width / 2 - 45,
+        canvas.height - canvas.height / 4
+      );
+      hero.img = heroImg;
+      gameObjects.push(hero);
+    }
+    ```
+
+    и накрая, добавете функция `drawGameObjects()`, за да започнете рисуването:
+
+    ```javascript
+    function drawGameObjects(ctx) {
+      gameObjects.forEach(go => go.draw(ctx));
+    }
+    ```
+
+    Вашите врагове трябва да започнат да настъпват към космическия кораб на героя ви!
+
+---
+
+## 🚀 Предизвикателство
+
+Както виждате, вашият код може да се превърне в "спагети код", когато започнете да добавяте функции, променливи и класове. Как можете да организирате кода си по-добре, така че да бъде по-четим? Начертайте система за организиране на кода си, дори ако той все още се намира в един файл.
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/34)
+
+## Преглед и самостоятелно обучение
+
+Докато пишем играта си без използване на рамки, има много JavaScript-базирани рамки за платно за разработка на игри. Отделете време да направите [проучване за тях](https://github.com/collections/javascript-game-engines).
+
+## Задание
+
+[Коментирайте кода си](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/3-moving-elements-around/assignment.md b/translations/bg/6-space-game/3-moving-elements-around/assignment.md
new file mode 100644
index 00000000..538092bb
--- /dev/null
+++ b/translations/bg/6-space-game/3-moving-elements-around/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "ccfcd8c2932761359fbaff3d6b01ace4",
+  "translation_date": "2025-08-28T07:55:05+00:00",
+  "source_file": "6-space-game/3-moving-elements-around/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Коментирайте вашия код
+
+## Инструкции
+
+Прегледайте текущия файл /app.js в папката на вашата игра и намерете начини да го коментирате и подредите. Много лесно е кодът да излезе извън контрол, а сега е добър момент да добавите коментари, за да гарантирате, че имате четим код, който можете да използвате по-късно.
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                          | Задоволително                          | Нуждае се от подобрение                                      |
+| -------- | ---------------------------------------------------------------- | -------------------------------------- | ----------------------------------------------------------- |
+|          | Кодът в `app.js` е напълно коментиран и организиран в логически блокове | Кодът в `app.js` е адекватно коментиран | Кодът в `app.js` е донякъде неорганизиран и липсват добри коментари |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/4-collision-detection/README.md b/translations/bg/6-space-game/4-collision-detection/README.md
new file mode 100644
index 00000000..5a5c0630
--- /dev/null
+++ b/translations/bg/6-space-game/4-collision-detection/README.md
@@ -0,0 +1,311 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "2e83e38c35dc003f046d7cc0bbfd4920",
+  "translation_date": "2025-08-28T07:57:29+00:00",
+  "source_file": "6-space-game/4-collision-detection/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра, част 4: Добавяне на лазер и откриване на сблъсъци
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/35)
+
+В този урок ще научите как да стреляте с лазери с помощта на JavaScript! Ще добавим две неща към нашата игра:
+
+- **Лазер**: този лазер се изстрелва от кораба на героя и се движи вертикално нагоре.
+- **Откриване на сблъсъци**, като част от реализирането на способността за *стрелба*, ще добавим някои интересни правила за игра:
+   - **Лазер удря враг**: Врагът умира, ако бъде ударен от лазер.
+   - **Лазер удря горната част на екрана**: Лазерът се унищожава, ако удари горната част на екрана.
+   - **Сблъсък между враг и герой**: Врагът и героят се унищожават, ако се сблъскат.
+   - **Враг удря долната част на екрана**: Врагът и героят се унищожават, ако врагът достигне долната част на екрана.
+
+Накратко, вие -- *героят* -- трябва да унищожите всички врагове с лазер, преди те да достигнат долната част на екрана.
+
+✅ Направете малко проучване за първата компютърна игра, която някога е била създадена. Каква беше нейната функционалност?
+
+Нека бъдем героични заедно!
+
+## Откриване на сблъсъци
+
+Как да откриваме сблъсъци? Трябва да мислим за обектите в играта като за правоъгълници, които се движат. Защо, може би ще попитате? Е, изображението, използвано за рисуване на обект в играта, е правоъгълник: има `x`, `y`, `ширина` и `височина`.
+
+Ако два правоъгълника, например герой и враг, *се пресекат*, имаме сблъсък. Какво трябва да се случи след това зависи от правилата на играта. За да реализирате откриване на сблъсъци, ви е необходимо следното:
+
+1. Начин за получаване на правоъгълно представяне на обект в играта, нещо като това:
+
+   ```javascript
+   rectFromGameObject() {
+     return {
+       top: this.y,
+       left: this.x,
+       bottom: this.y + this.height,
+       right: this.x + this.width
+     }
+   }
+   ```
+
+2. Функция за сравнение, която може да изглежда така:
+
+   ```javascript
+   function intersectRect(r1, r2) {
+     return !(r2.left > r1.right ||
+       r2.right < r1.left ||
+       r2.top > r1.bottom ||
+       r2.bottom < r1.top);
+   }
+   ```
+
+## Как да унищожаваме обекти
+
+За да унищожите обекти в играта, трябва да уведомите играта, че този обект вече не трябва да се рисува в игровия цикъл, който се задейства на определен интервал. Един начин да направите това е да маркирате обекта като *мъртъв*, когато се случи нещо, например:
+
+```javascript
+// collision happened
+enemy.dead = true
+```
+
+След това можете да премахнете *мъртвите* обекти, преди да се нарисува екранът, например:
+
+```javascript
+gameObjects = gameObject.filter(go => !go.dead);
+```
+
+## Как да изстреляме лазер
+
+Изстрелването на лазер означава да реагираме на събитие от клавиатурата и да създадем обект, който се движи в определена посока. Затова трябва да изпълним следните стъпки:
+
+1. **Създаване на обект лазер**: от върха на кораба на героя, който започва да се движи нагоре към горната част на екрана веднага след създаването.
+2. **Прикачване на код към събитие от клавиатурата**: трябва да изберем клавиш на клавиатурата, който да представлява стрелбата на лазера от играча.
+3. **Създаване на обект в играта, който изглежда като лазер**, когато клавишът е натиснат.
+
+## Забавяне при стрелба с лазер
+
+Лазерът трябва да се изстрелва всеки път, когато натиснете клавиш, например *space*. За да предотвратим играта да създава твърде много лазери за кратко време, трябва да поправим това. Решението е чрез реализиране на така нареченото *забавяне*, таймер, който гарантира, че лазерът може да се изстрелва само през определен интервал. Можете да го реализирате по следния начин:
+
+```javascript
+class Cooldown {
+  constructor(time) {
+    this.cool = false;
+    setTimeout(() => {
+      this.cool = true;
+    }, time)
+  }
+}
+
+class Weapon {
+  constructor {
+  }
+  fire() {
+    if (!this.cooldown || this.cooldown.cool) {
+      // produce a laser
+      this.cooldown = new Cooldown(500);
+    } else {
+      // do nothing - it hasn't cooled down yet.
+    }
+  }
+}
+```
+
+✅ Върнете се към урок 1 от серията за космическата игра, за да си припомните концепцията за *забавяне*.
+
+## Какво да изградим
+
+Ще вземете съществуващия код (който трябва да сте почистили и рефакторирали) от предишния урок и ще го разширите. Можете да започнете с кода от част II или да използвате кода от [Част III - стартов код](../../../../../../../../../your-work).
+
+> съвет: лазерът, с който ще работите, вече е в папката с ресурси и е рефериран от вашия код
+
+- **Добавете откриване на сблъсъци**, когато лазерът се сблъска с нещо, трябва да се приложат следните правила:
+   1. **Лазер удря враг**: врагът умира, ако бъде ударен от лазер.
+   2. **Лазер удря горната част на екрана**: лазерът се унищожава, ако удари горната част на екрана.
+   3. **Сблъсък между враг и герой**: врагът и героят се унищожават, ако се сблъскат.
+   4. **Враг удря долната част на екрана**: врагът и героят се унищожават, ако врагът достигне долната част на екрана.
+
+## Препоръчителни стъпки
+
+Намерете файловете, които са създадени за вас в подпапката `your-work`. Тя трябва да съдържа следното:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+  -| laserRed.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Започнете проекта си в папката `your_work`, като напишете:
+
+```bash
+cd your-work
+npm start
+```
+
+Горната команда ще стартира HTTP сървър на адрес `http://localhost:5000`. Отворете браузър и въведете този адрес. В момента трябва да виждате героя и всички врагове, но нищо не се движи - все още :).
+
+### Добавете код
+
+1. **Настройте правоъгълно представяне на обектите в играта, за да обработвате сблъсъци**. Следният код ви позволява да получите правоъгълно представяне на `GameObject`. Редактирайте класа GameObject, за да го разширите:
+
+    ```javascript
+    rectFromGameObject() {
+        return {
+          top: this.y,
+          left: this.x,
+          bottom: this.y + this.height,
+          right: this.x + this.width,
+        };
+      }
+    ```
+
+2. **Добавете код, който проверява за сблъсъци**. Това ще бъде нова функция, която тества дали два правоъгълника се пресичат:
+
+    ```javascript
+    function intersectRect(r1, r2) {
+      return !(
+        r2.left > r1.right ||
+        r2.right < r1.left ||
+        r2.top > r1.bottom ||
+        r2.bottom < r1.top
+      );
+    }
+    ```
+
+3. **Добавете способност за стрелба с лазер**
+   1. **Добавете съобщение за събитие от клавиш**. Клавишът *space* трябва да създава лазер точно над кораба на героя. Добавете три константи в обекта Messages:
+
+       ```javascript
+        KEY_EVENT_SPACE: "KEY_EVENT_SPACE",
+        COLLISION_ENEMY_LASER: "COLLISION_ENEMY_LASER",
+        COLLISION_ENEMY_HERO: "COLLISION_ENEMY_HERO",
+       ```
+
+   1. **Обработете клавиша space**. Редактирайте функцията `window.addEventListener` за keyup, за да обработва space:
+
+      ```javascript
+        } else if(evt.keyCode === 32) {
+          eventEmitter.emit(Messages.KEY_EVENT_SPACE);
+        }
+      ```
+
+    1. **Добавете слушатели**. Редактирайте функцията `initGame()`, за да гарантирате, че героят може да стреля, когато се натисне клавишът space:
+
+       ```javascript
+       eventEmitter.on(Messages.KEY_EVENT_SPACE, () => {
+        if (hero.canFire()) {
+          hero.fire();
+        }
+       ```
+
+       и добавете нова функция `eventEmitter.on()`, за да гарантирате поведение, когато враг се сблъска с лазер:
+
+          ```javascript
+          eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
+            first.dead = true;
+            second.dead = true;
+          })
+          ```
+
+   1. **Преместете обекта**, Уверете се, че лазерът постепенно се движи към горната част на екрана. Ще създадете нов клас Laser, който разширява `GameObject`, както сте правили преди: 
+   
+      ```javascript
+        class Laser extends GameObject {
+        constructor(x, y) {
+          super(x,y);
+          (this.width = 9), (this.height = 33);
+          this.type = 'Laser';
+          this.img = laserImg;
+          let id = setInterval(() => {
+            if (this.y > 0) {
+              this.y -= 15;
+            } else {
+              this.dead = true;
+              clearInterval(id);
+            }
+          }, 100)
+        }
+      }
+      ```
+
+   1. **Обработете сблъсъци**, Реализирайте правила за сблъсъци за лазера. Добавете функция `updateGameObjects()`, която тества сблъсъци между обекти:
+
+      ```javascript
+      function updateGameObjects() {
+        const enemies = gameObjects.filter(go => go.type === 'Enemy');
+        const lasers = gameObjects.filter((go) => go.type === "Laser");
+      // laser hit something
+        lasers.forEach((l) => {
+          enemies.forEach((m) => {
+            if (intersectRect(l.rectFromGameObject(), m.rectFromGameObject())) {
+            eventEmitter.emit(Messages.COLLISION_ENEMY_LASER, {
+              first: l,
+              second: m,
+            });
+          }
+         });
+      });
+
+        gameObjects = gameObjects.filter(go => !go.dead);
+      }  
+      ```
+
+      Уверете се, че сте добавили `updateGameObjects()` в игровия цикъл в `window.onload`.
+
+   4. **Реализирайте забавяне** за лазера, така че да може да се изстрелва само през определен интервал.
+
+      Накрая, редактирайте класа Hero, за да може да има забавяне:
+
+       ```javascript
+      class Hero extends GameObject {
+        constructor(x, y) {
+          super(x, y);
+          (this.width = 99), (this.height = 75);
+          this.type = "Hero";
+          this.speed = { x: 0, y: 0 };
+          this.cooldown = 0;
+        }
+        fire() {
+          gameObjects.push(new Laser(this.x + 45, this.y - 10));
+          this.cooldown = 500;
+    
+          let id = setInterval(() => {
+            if (this.cooldown > 0) {
+              this.cooldown -= 100;
+            } else {
+              clearInterval(id);
+            }
+          }, 200);
+        }
+        canFire() {
+          return this.cooldown === 0;
+        }
+      }
+      ```
+
+На този етап вашата игра има някаква функционалност! Можете да се движите с клавишите със стрелки, да стреляте с лазер с клавиша space и враговете изчезват, когато ги ударите. Браво!
+
+---
+
+## 🚀 Предизвикателство
+
+Добавете експлозия! Разгледайте ресурсите за играта в [репото Space Art](../../../../6-space-game/solution/spaceArt/readme.txt) и опитайте да добавите експлозия, когато лазерът удари извънземно.
+
+## Финален тест
+
+[Финален тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/36)
+
+## Преглед и самостоятелно обучение
+
+Експериментирайте с интервалите във вашата игра досега. Какво се случва, когато ги промените? Прочетете повече за [събития за време в JavaScript](https://www.freecodecamp.org/news/javascript-timing-events-settimeout-and-setinterval/).
+
+## Задание
+
+[Изследвайте сблъсъци](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/4-collision-detection/assignment.md b/translations/bg/6-space-game/4-collision-detection/assignment.md
new file mode 100644
index 00000000..d11fd926
--- /dev/null
+++ b/translations/bg/6-space-game/4-collision-detection/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8a0a097b45e7c75a611e2795e4013f16",
+  "translation_date": "2025-08-28T07:58:12+00:00",
+  "source_file": "6-space-game/4-collision-detection/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Изследване на сблъсъци
+
+## Инструкции
+
+За да разберете по-добре как работят сблъсъците, създайте много малка игра с няколко елемента, които се сблъскват. Направете ги да се движат чрез натискания на клавиши или кликове с мишката и накарайте нещо да се случи с един от елементите, когато бъде ударен. Това може да бъде нещо като метеор, който удря земята, или блъскащи се колички. Бъдете креативни!
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                                                                                  | Задоволително                  | Нуждае се от подобрение |
+| -------- | ------------------------------------------------------------------------------------------------------------------------ | ------------------------------ | ----------------------- |
+|          | Създаден е напълно работещ код, с елементи, нарисувани върху платното, основни сблъсъци и реакции                        | Кодът е непълен по някакъв начин | Кодът не работи правилно |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/4-collision-detection/solution/README.md b/translations/bg/6-space-game/4-collision-detection/solution/README.md
new file mode 100644
index 00000000..e6074e36
--- /dev/null
+++ b/translations/bg/6-space-game/4-collision-detection/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:58:27+00:00",
+  "source_file": "6-space-game/4-collision-detection/solution/README.md",
+  "language_code": "bg"
+}
+-->
+Това е запълващ текст, оставен празен нарочно
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/4-collision-detection/your-work/README.md b/translations/bg/6-space-game/4-collision-detection/your-work/README.md
new file mode 100644
index 00000000..5e5142dc
--- /dev/null
+++ b/translations/bg/6-space-game/4-collision-detection/your-work/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:58:41+00:00",
+  "source_file": "6-space-game/4-collision-detection/your-work/README.md",
+  "language_code": "bg"
+}
+-->
+Това е заместител, оставен празен нарочно
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/5-keeping-score/README.md b/translations/bg/6-space-game/5-keeping-score/README.md
new file mode 100644
index 00000000..2c93fae2
--- /dev/null
+++ b/translations/bg/6-space-game/5-keeping-score/README.md
@@ -0,0 +1,203 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "4e8250db84b027c9ff816b4e4c093457",
+  "translation_date": "2025-08-28T07:55:39+00:00",
+  "source_file": "6-space-game/5-keeping-score/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра, част 5: Точки и животи
+
+## Тест преди лекцията
+
+[Тест преди лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/37)
+
+В този урок ще научите как да добавите точки към играта и как да изчислявате животи.
+
+## Рисуване на текст на екрана
+
+За да можете да показвате резултата от играта на екрана, трябва да знаете как да поставите текст върху него. Отговорът е използването на метода `fillText()` на обекта canvas. Можете също така да контролирате други аспекти като шрифта, цвета на текста и дори подравняването му (ляво, дясно, център). По-долу е даден код, който рисува текст на екрана.
+
+```javascript
+ctx.font = "30px Arial";
+ctx.fillStyle = "red";
+ctx.textAlign = "right";
+ctx.fillText("show this on the screen", 0, 0);
+```
+
+✅ Прочетете повече за [как да добавите текст към canvas](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_text) и не се колебайте да направите вашия текст по-стилен!
+
+## Животът като концепция в игрите
+
+Концепцията за живот в играта е просто число. В контекста на космическа игра е обичайно да се задават определен брой животи, които се намаляват един по един, когато вашият кораб понася щети. Ще е хубаво, ако можете да покажете графично представяне на това, например миникорабчета или сърца, вместо просто число.
+
+## Какво да изградите
+
+Нека добавим следното към вашата игра:
+
+- **Резултат от играта**: За всеки унищожен вражески кораб, героят трябва да получава точки. Предлагаме 100 точки на кораб. Резултатът от играта трябва да се показва в долния ляв ъгъл.
+- **Живот**: Вашият кораб има три живота. Губите живот всеки път, когато вражески кораб се сблъска с вас. Броят на животите трябва да се показва в долния десен ъгъл и да бъде представен с графика като тази: ![изображение на живот](../../../../translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.bg.png).
+
+## Препоръчителни стъпки
+
+Намерете файловете, които са създадени за вас в подпапката `your-work`. Тя трябва да съдържа следното:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+  -| laserRed.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Започнете проекта си в папката `your_work`, като напишете:
+
+```bash
+cd your-work
+npm start
+```
+
+Горната команда ще стартира HTTP сървър на адрес `http://localhost:5000`. Отворете браузър и въведете този адрес. В момента трябва да виждате героя и всички врагове, а когато натискате стрелките наляво и надясно, героят се движи и може да стреля по враговете.
+
+### Добавяне на код
+
+1. **Копирайте необходимите ресурси** от папката `solution/assets/` в папката `your-work`. Ще добавите ресурса `life.png`. Добавете lifeImg към функцията window.onload:
+
+    ```javascript
+    lifeImg = await loadTexture("assets/life.png");
+    ```
+
+1. Добавете `lifeImg` към списъка с ресурси:
+
+    ```javascript
+    let heroImg,
+    ...
+    lifeImg,
+    ...
+    eventEmitter = new EventEmitter();
+    ```
+  
+2. **Добавете променливи**. Добавете код, който представлява общия резултат (0) и оставащите животи (3), и ги покажете на екрана.
+
+3. **Разширете функцията `updateGameObjects()`**. Разширете функцията `updateGameObjects()`, за да обработва сблъсъци с врагове:
+
+    ```javascript
+    enemies.forEach(enemy => {
+        const heroRect = hero.rectFromGameObject();
+        if (intersectRect(heroRect, enemy.rectFromGameObject())) {
+          eventEmitter.emit(Messages.COLLISION_ENEMY_HERO, { enemy });
+        }
+      })
+    ```
+
+4. **Добавете `life` и `points`**. 
+   1. **Инициализирайте променливи**. Под `this.cooldown = 0` в класа `Hero` задайте life и points:
+
+        ```javascript
+        this.life = 3;
+        this.points = 0;
+        ```
+
+   1. **Рисувайте променливите на екрана**. Покажете тези стойности на екрана:
+
+        ```javascript
+        function drawLife() {
+          // TODO, 35, 27
+          const START_POS = canvas.width - 180;
+          for(let i=0; i < hero.life; i++ ) {
+            ctx.drawImage(
+              lifeImg, 
+              START_POS + (45 * (i+1) ), 
+              canvas.height - 37);
+          }
+        }
+        
+        function drawPoints() {
+          ctx.font = "30px Arial";
+          ctx.fillStyle = "red";
+          ctx.textAlign = "left";
+          drawText("Points: " + hero.points, 10, canvas.height-20);
+        }
+        
+        function drawText(message, x, y) {
+          ctx.fillText(message, x, y);
+        }
+
+        ```
+
+   1. **Добавете методи към игровия цикъл**. Уверете се, че добавяте тези функции към функцията window.onload под `updateGameObjects()`:
+
+        ```javascript
+        drawPoints();
+        drawLife();
+        ```
+
+1. **Реализирайте правилата на играта**. Реализирайте следните правила:
+
+   1. **За всеки сблъсък между героя и враг** изваждайте един живот.
+   
+      Разширете класа `Hero`, за да направите това изваждане:
+
+        ```javascript
+        decrementLife() {
+          this.life--;
+          if (this.life === 0) {
+            this.dead = true;
+          }
+        }
+        ```
+
+   2. **За всеки лазер, който удари враг**, увеличавайте резултата от играта със 100 точки.
+
+      Разширете класа `Hero`, за да направите това увеличение:
+    
+        ```javascript
+          incrementPoints() {
+            this.points += 100;
+          }
+        ```
+
+        Добавете тези функции към вашите Collision Event Emitters:
+
+        ```javascript
+        eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
+           first.dead = true;
+           second.dead = true;
+           hero.incrementPoints();
+        })
+
+        eventEmitter.on(Messages.COLLISION_ENEMY_HERO, (_, { enemy }) => {
+           enemy.dead = true;
+           hero.decrementLife();
+        });
+        ```
+
+✅ Направете малко проучване, за да откриете други игри, създадени с JavaScript/Canvas. Какви са техните общи черти?
+
+След като завършите тази работа, трябва да виждате малките "живот" кораби в долния десен ъгъл, точките в долния ляв ъгъл и да виждате как броят на животите намалява при сблъсък с врагове, а точките се увеличават, когато стреляте по врагове. Браво! Вашата игра е почти завършена.
+
+---
+
+## 🚀 Предизвикателство
+
+Вашият код е почти завършен. Можете ли да си представите следващите стъпки?
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/38)
+
+## Преглед и самостоятелно обучение
+
+Проучете начини за увеличаване и намаляване на резултатите и животите в игрите. Съществуват интересни игрови енджини като [PlayFab](https://playfab.com). Как използването на такъв енджин би подобрило вашата игра?
+
+## Задача
+
+[Създайте игра с точки](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/5-keeping-score/assignment.md b/translations/bg/6-space-game/5-keeping-score/assignment.md
new file mode 100644
index 00000000..fbc5d031
--- /dev/null
+++ b/translations/bg/6-space-game/5-keeping-score/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "81f292dbda01685b91735e0398dc0504",
+  "translation_date": "2025-08-28T07:56:11+00:00",
+  "source_file": "6-space-game/5-keeping-score/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Създайте игра за точкуване
+
+## Инструкции
+
+Създайте игра, в която показвате живота и точките по креативен начин. Едно предложение е да покажете живота като сърца, а точките като голямо число в долната централна част на екрана. Вижте тук за [Безплатни ресурси за игри](https://www.kenney.nl/)
+
+# Критерии за оценка
+
+| Критерии | Отлично представяне    | Задоволително представяне   | Нуждае се от подобрение    |
+| -------- | ---------------------- | --------------------------- | -------------------------- |
+|          | цялата игра е представена | играта е частично представена | частичната игра съдържа грешки |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/5-keeping-score/solution/README.md b/translations/bg/6-space-game/5-keeping-score/solution/README.md
new file mode 100644
index 00000000..05e37741
--- /dev/null
+++ b/translations/bg/6-space-game/5-keeping-score/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:56:23+00:00",
+  "source_file": "6-space-game/5-keeping-score/solution/README.md",
+  "language_code": "bg"
+}
+-->
+Това е заместител, оставен празен умишлено
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/5-keeping-score/your-work/README.md b/translations/bg/6-space-game/5-keeping-score/your-work/README.md
new file mode 100644
index 00000000..af8cec2f
--- /dev/null
+++ b/translations/bg/6-space-game/5-keeping-score/your-work/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:56:33+00:00",
+  "source_file": "6-space-game/5-keeping-score/your-work/README.md",
+  "language_code": "bg"
+}
+-->
+Това е заместител, оставен празен умишлено
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/6-end-condition/README.md b/translations/bg/6-space-game/6-end-condition/README.md
new file mode 100644
index 00000000..6a6d4ba6
--- /dev/null
+++ b/translations/bg/6-space-game/6-end-condition/README.md
@@ -0,0 +1,236 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "01336cddd638242e99b133614111ea40",
+  "translation_date": "2025-08-28T08:00:24+00:00",
+  "source_file": "6-space-game/6-end-condition/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра, част 6: Край и рестарт
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/39)
+
+Има различни начини да се изрази *условие за край* в една игра. Вие, като създател на играта, решавате защо играта приключва. Ето някои причини, ако приемем, че говорим за космическата игра, която създавате досега:
+
+- **Унищожени са `N` вражески кораба**: Често, когато играта е разделена на различни нива, трябва да унищожите `N` вражески кораба, за да завършите нивото.
+- **Вашият кораб е унищожен**: Има игри, в които губите, ако вашият кораб бъде унищожен. Друг често срещан подход е концепцията за животи. Всеки път, когато вашият кораб бъде унищожен, се отнема един живот. Когато всички животи бъдат загубени, играта приключва.
+- **Събрали сте `N` точки**: Друго често срещано условие за край е събирането на точки. Как ще получите точки зависи от вас, но е обичайно да се присвояват точки за различни дейности, като унищожаване на вражески кораб или събиране на предмети, които се *пускат*, когато бъдат унищожени.
+- **Завършване на ниво**: Това може да включва няколко условия, като унищожени `X` вражески кораба, събрани `Y` точки или може би събиране на конкретен предмет.
+
+## Рестартиране
+
+Ако хората харесват вашата игра, вероятно ще искат да я играят отново. След като играта приключи по каквато и да е причина, трябва да предложите опция за рестарт.
+
+✅ Помислете малко за условията, при които една игра приключва, и как ви подканват да я рестартирате.
+
+## Какво да създадете
+
+Ще добавите следните правила към вашата игра:
+
+1. **Победа в играта**. След като всички вражески кораби бъдат унищожени, печелите играта. Освен това покажете някакво съобщение за победа.
+1. **Рестарт**. След като всички животи бъдат загубени или играта бъде спечелена, трябва да предложите начин за рестартиране на играта. Не забравяйте! Ще трябва да инициализирате играта отново и да изчистите предишното състояние на играта.
+
+## Препоръчителни стъпки
+
+Намерете файловете, които са създадени за вас в подпапката `your-work`. Тя трябва да съдържа следното:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+  -| laserRed.png
+  -| life.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Започнете проекта си в папката `your_work`, като въведете:
+
+```bash
+cd your-work
+npm start
+```
+
+Горната команда ще стартира HTTP сървър на адрес `http://localhost:5000`. Отворете браузър и въведете този адрес. Вашата игра трябва да е в състояние за игра.
+
+> съвет: за да избегнете предупреждения в Visual Studio Code, редактирайте функцията `window.onload`, така че да извиква `gameLoopId` без `let`, и декларирайте `gameLoopId` в началото на файла, независимо: `let gameLoopId;`
+
+### Добавяне на код
+
+1. **Проследяване на условието за край**. Добавете код, който следи броя на враговете или дали героичният кораб е унищожен, като добавите тези две функции:
+
+    ```javascript
+    function isHeroDead() {
+      return hero.life <= 0;
+    }
+
+    function isEnemiesDead() {
+      const enemies = gameObjects.filter((go) => go.type === "Enemy" && !go.dead);
+      return enemies.length === 0;
+    }
+    ```
+
+1. **Добавяне на логика към обработващите съобщения**. Редактирайте `eventEmitter`, за да обработва тези условия:
+
+    ```javascript
+    eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
+        first.dead = true;
+        second.dead = true;
+        hero.incrementPoints();
+
+        if (isEnemiesDead()) {
+          eventEmitter.emit(Messages.GAME_END_WIN);
+        }
+    });
+
+    eventEmitter.on(Messages.COLLISION_ENEMY_HERO, (_, { enemy }) => {
+        enemy.dead = true;
+        hero.decrementLife();
+        if (isHeroDead())  {
+          eventEmitter.emit(Messages.GAME_END_LOSS);
+          return; // loss before victory
+        }
+        if (isEnemiesDead()) {
+          eventEmitter.emit(Messages.GAME_END_WIN);
+        }
+    });
+    
+    eventEmitter.on(Messages.GAME_END_WIN, () => {
+        endGame(true);
+    });
+      
+    eventEmitter.on(Messages.GAME_END_LOSS, () => {
+      endGame(false);
+    });
+    ```
+
+1. **Добавяне на нови типове съобщения**. Добавете тези съобщения към обекта constants:
+
+    ```javascript
+    GAME_END_LOSS: "GAME_END_LOSS",
+    GAME_END_WIN: "GAME_END_WIN",
+    ```
+
+2. **Добавяне на код за рестарт**. Добавете код, който рестартира играта при натискане на избран бутон.
+
+   1. **Слушане за натискане на клавиш `Enter`**. Редактирайте eventListener на прозореца, за да слуша за това натискане:
+
+    ```javascript
+     else if(evt.key === "Enter") {
+        eventEmitter.emit(Messages.KEY_EVENT_ENTER);
+      }
+    ```
+
+   1. **Добавяне на съобщение за рестарт**. Добавете това съобщение към constants:
+
+        ```javascript
+        KEY_EVENT_ENTER: "KEY_EVENT_ENTER",
+        ```
+
+1. **Прилагане на правилата на играта**. Прилагайте следните правила:
+
+   1. **Условие за победа на играча**. Когато всички вражески кораби бъдат унищожени, покажете съобщение за победа.
+
+      1. Първо, създайте функция `displayMessage()`:
+
+        ```javascript
+        function displayMessage(message, color = "red") {
+          ctx.font = "30px Arial";
+          ctx.fillStyle = color;
+          ctx.textAlign = "center";
+          ctx.fillText(message, canvas.width / 2, canvas.height / 2);
+        }
+        ```
+
+      1. Създайте функция `endGame()`:
+
+        ```javascript
+        function endGame(win) {
+          clearInterval(gameLoopId);
+        
+          // set a delay so we are sure any paints have finished
+          setTimeout(() => {
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            ctx.fillStyle = "black";
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+            if (win) {
+              displayMessage(
+                "Victory!!! Pew Pew... - Press [Enter] to start a new game Captain Pew Pew",
+                "green"
+              );
+            } else {
+              displayMessage(
+                "You died !!! Press [Enter] to start a new game Captain Pew Pew"
+              );
+            }
+          }, 200)  
+        }
+        ```
+
+   1. **Логика за рестарт**. Когато всички животи бъдат загубени или играчът спечели играта, покажете, че играта може да бъде рестартирана. Освен това рестартирайте играта, когато бъде натиснат клавишът за *рестарт* (можете да решите кой клавиш да бъде свързан с рестарт).
+
+      1. Създайте функция `resetGame()`:
+
+        ```javascript
+        function resetGame() {
+          if (gameLoopId) {
+            clearInterval(gameLoopId);
+            eventEmitter.clear();
+            initGame();
+            gameLoopId = setInterval(() => {
+              ctx.clearRect(0, 0, canvas.width, canvas.height);
+              ctx.fillStyle = "black";
+              ctx.fillRect(0, 0, canvas.width, canvas.height);
+              drawPoints();
+              drawLife();
+              updateGameObjects();
+              drawGameObjects(ctx);
+            }, 100);
+          }
+        }
+        ```
+
+     1. Добавете извикване към `eventEmitter`, за да рестартирате играта в `initGame()`:
+
+        ```javascript
+        eventEmitter.on(Messages.KEY_EVENT_ENTER, () => {
+          resetGame();
+        });
+        ```
+
+     1. Добавете функция `clear()` към EventEmitter:
+
+        ```javascript
+        clear() {
+          this.listeners = {};
+        }
+        ```
+
+👽 💥 🚀 Поздравления, капитане! Вашата игра е завършена! Браво! 🚀 💥 👽
+
+---
+
+## 🚀 Предизвикателство
+
+Добавете звук! Можете ли да добавите звук, за да подобрите играта, например когато има лазерен удар, или когато героят загине или спечели? Разгледайте този [sandbox](https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_audio_play), за да научите как да възпроизвеждате звук с JavaScript.
+
+## Финален тест
+
+[Финален тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/40)
+
+## Преглед и самостоятелно обучение
+
+Вашата задача е да създадете нова примерна игра, така че разгледайте някои интересни игри, за да видите какъв тип игра бихте могли да създадете.
+
+## Задача
+
+[Създайте примерна игра](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/6-end-condition/assignment.md b/translations/bg/6-space-game/6-end-condition/assignment.md
new file mode 100644
index 00000000..02533216
--- /dev/null
+++ b/translations/bg/6-space-game/6-end-condition/assignment.md
@@ -0,0 +1,33 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "24201cf428c7edba1ccec2a78a0dd8f8",
+  "translation_date": "2025-08-28T08:00:56+00:00",
+  "source_file": "6-space-game/6-end-condition/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Създайте примерна игра
+
+## Инструкции
+
+Опитайте да създадете малка игра, в която да упражнявате различни крайни условия. Варирайте между достигане на определен брой точки, героят губи всички животи или всички чудовища са победени. Създайте нещо просто, като приключенска игра в конзолен формат. Използвайте следния игрови поток като вдъхновение:
+
+```
+Hero> Strikes with broadsword - orc takes 3p damage
+Orc> Hits with club - hero takes 2p damage
+Hero> Kicks - orc takes 1p damage
+Game> Orc is defeated - Hero collects 2 coins
+Game> ****No more monsters, you have conquered the evil fortress****
+```
+
+## Оценка
+
+| Критерии | Отлично представяне    | Достатъчно представяне      | Нуждае се от подобрение     |
+| -------- | ---------------------- | --------------------------- | -------------------------- |
+|          | цялата игра е представена | играта е частично представена | частичната игра съдържа грешки |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/6-end-condition/solution/README.md b/translations/bg/6-space-game/6-end-condition/solution/README.md
new file mode 100644
index 00000000..134facd8
--- /dev/null
+++ b/translations/bg/6-space-game/6-end-condition/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T08:01:11+00:00",
+  "source_file": "6-space-game/6-end-condition/solution/README.md",
+  "language_code": "bg"
+}
+-->
+Това е заместител, оставен празен нарочно
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/6-end-condition/your-work/README.md b/translations/bg/6-space-game/6-end-condition/your-work/README.md
new file mode 100644
index 00000000..b505b3a9
--- /dev/null
+++ b/translations/bg/6-space-game/6-end-condition/your-work/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T08:01:22+00:00",
+  "source_file": "6-space-game/6-end-condition/your-work/README.md",
+  "language_code": "bg"
+}
+-->
+Това е заместител, оставен празен нарочно
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/README.md b/translations/bg/6-space-game/README.md
new file mode 100644
index 00000000..ddb09cff
--- /dev/null
+++ b/translations/bg/6-space-game/README.md
@@ -0,0 +1,45 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "c40a698395ee5102715f7880bba3f2e7",
+  "translation_date": "2025-08-28T07:53:15+00:00",
+  "source_file": "6-space-game/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на космическа игра
+
+Космическа игра за изучаване на по-напреднали основи на JavaScript
+
+В този урок ще научите как да създадете своя собствена космическа игра. Ако някога сте играли играта "Space Invaders", тази игра има същата идея: да управлявате космически кораб и да стреляте по чудовища, които се спускат отгоре. Ето как ще изглежда завършената игра:
+
+![Завършена игра](../../../6-space-game/images/pewpew.gif)
+
+В тези шест урока ще научите следното:
+
+- **Взаимодействие** с елемента Canvas за рисуване на екрана
+- **Разбиране** на картезианската координатна система
+- **Изучаване** на модела Pub-Sub за създаване на здрава архитектура на играта, която е по-лесна за поддръжка и разширяване
+- **Използване** на Async/Await за зареждане на ресурси за играта
+- **Обработка** на събития от клавиатурата
+
+## Преглед
+
+- Теория
+   - [Въведение в създаването на игри с JavaScript](1-introduction/README.md)
+- Практика
+   - [Рисуване върху canvas](2-drawing-to-canvas/README.md)
+   - [Придвижване на елементи по екрана](3-moving-elements-around/README.md)
+   - [Откриване на сблъсъци](4-collision-detection/README.md)
+   - [Поддържане на резултат](5-keeping-score/README.md)
+   - [Завършване и рестартиране на играта](6-end-condition/README.md)
+
+## Кредити
+
+Ресурсите, използвани за тази игра, са взети от https://www.kenney.nl/.  
+Ако се интересувате от създаване на игри, това са наистина качествени ресурси, много от тях са безплатни, а някои са платени.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/6-space-game/solution/README.md b/translations/bg/6-space-game/solution/README.md
new file mode 100644
index 00000000..f5731aac
--- /dev/null
+++ b/translations/bg/6-space-game/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:56:51+00:00",
+  "source_file": "6-space-game/solution/README.md",
+  "language_code": "bg"
+}
+-->
+Това е запълващ текст, оставен празен нарочно
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/1-template-route/README.md b/translations/bg/7-bank-project/1-template-route/README.md
new file mode 100644
index 00000000..1151696e
--- /dev/null
+++ b/translations/bg/7-bank-project/1-template-route/README.md
@@ -0,0 +1,322 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8da1b5e2c63f749808858c53f37b8ce7",
+  "translation_date": "2025-08-28T07:40:00+00:00",
+  "source_file": "7-bank-project/1-template-route/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на Банкова Приложение Част 1: HTML Шаблони и Роутове в Уеб Приложение
+
+## Предварителен Тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/41)
+
+### Въведение
+
+С появата на JavaScript в браузърите, уебсайтовете стават все по-интерактивни и сложни. Уеб технологиите вече често се използват за създаване на напълно функционални приложения, които работят директно в браузъра и които наричаме [уеб приложения](https://en.wikipedia.org/wiki/Web_application). Тъй като уеб приложенията са силно интерактивни, потребителите не искат да чакат пълно презареждане на страницата всеки път, когато се извършва действие. Затова JavaScript се използва за директно обновяване на HTML чрез DOM, за да се осигури по-гладко потребителско изживяване.
+
+В този урок ще положим основите за създаване на банково уеб приложение, използвайки HTML шаблони за създаване на множество екрани, които могат да се показват и обновяват без необходимост от презареждане на цялата HTML страница.
+
+### Предварителни изисквания
+
+Ще ви е необходим локален уеб сървър, за да тествате уеб приложението, което ще създадем в този урок. Ако нямате такъв, можете да инсталирате [Node.js](https://nodejs.org) и да използвате командата `npx lite-server` от папката на вашия проект. Това ще създаде локален уеб сървър и ще отвори приложението ви в браузър.
+
+### Подготовка
+
+На вашия компютър създайте папка с име `bank` и файл с име `index.html` вътре в нея. Ще започнем с този HTML [шаблон](https://en.wikipedia.org/wiki/Boilerplate_code):
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Bank App</title>
+  </head>
+  <body>
+    <!-- This is where you'll work -->
+  </body>
+</html>
+```
+
+---
+
+## HTML шаблони
+
+Ако искате да създадете множество екрани за уеб страница, едно решение би било да създадете отделен HTML файл за всеки екран, който искате да покажете. Въпреки това, това решение има някои неудобства:
+
+- Трябва да презареждате целия HTML при смяна на екрана, което може да е бавно.
+- Трудно е да се споделят данни между различните екрани.
+
+Друг подход е да имате само един HTML файл и да дефинирате множество [HTML шаблони](https://developer.mozilla.org/docs/Web/HTML/Element/template), използвайки елемента `<template>`. Шаблонът е многократно използваем HTML блок, който не се показва от браузъра и трябва да бъде инстанциран по време на изпълнение с помощта на JavaScript.
+
+### Задача
+
+Ще създадем банково приложение с два екрана: страницата за вход и таблото за управление. Първо, нека добавим в тялото на HTML елемент за запазване на място, който ще използваме за инстанциране на различните екрани на нашето приложение:
+
+```html
+<div id="app">Loading...</div>
+```
+
+Даваме му `id`, за да го намираме по-лесно с JavaScript по-късно.
+
+> Съвет: тъй като съдържанието на този елемент ще бъде заменено, можем да поставим съобщение за зареждане или индикатор, който ще се показва, докато приложението се зарежда.
+
+След това нека добавим HTML шаблон за страницата за вход. Засега ще поставим само заглавие и секция, съдържаща връзка, която ще използваме за навигация.
+
+```html
+<template id="login">
+  <h1>Bank App</h1>
+  <section>
+    <a href="/dashboard">Login</a>
+  </section>
+</template>
+```
+
+След това ще добавим друг HTML шаблон за страницата на таблото за управление. Тази страница ще съдържа различни секции:
+
+- Заглавна част със заглавие и връзка за изход
+- Текущото салдо на банковата сметка
+- Списък с транзакции, показан в таблица
+
+```html
+<template id="dashboard">
+  <header>
+    <h1>Bank App</h1>
+    <a href="/login">Logout</a>
+  </header>
+  <section>
+    Balance: 100$
+  </section>
+  <section>
+    <h2>Transactions</h2>
+    <table>
+      <thead>
+        <tr>
+          <th>Date</th>
+          <th>Object</th>
+          <th>Amount</th>
+        </tr>
+      </thead>
+      <tbody></tbody>
+    </table>
+  </section>
+</template>
+```
+
+> Съвет: когато създавате HTML шаблони, ако искате да видите как ще изглеждат, можете да коментирате линиите `<template>` и `</template>`, като ги обградите с `<!-- -->`.
+
+✅ Защо мислите, че използваме атрибути `id` за шаблоните? Можем ли да използваме нещо друго, като например класове?
+
+## Показване на шаблони с JavaScript
+
+Ако опитате текущия HTML файл в браузър, ще видите, че той остава на екрана с надпис „Зареждане...“. Това е така, защото трябва да добавим JavaScript код, за да инстанцираме и покажем HTML шаблоните.
+
+Инстанцирането на шаблон обикновено се извършва в 3 стъпки:
+
+1. Извличане на елемента шаблон в DOM, например с [`document.getElementById`](https://developer.mozilla.org/docs/Web/API/Document/getElementById).
+2. Клониране на елемента шаблон, използвайки [`cloneNode`](https://developer.mozilla.org/docs/Web/API/Node/cloneNode).
+3. Прикачване към DOM под видим елемент, например с [`appendChild`](https://developer.mozilla.org/docs/Web/API/Node/appendChild).
+
+✅ Защо трябва да клонираме шаблона, преди да го прикачим към DOM? Какво мислите, че ще се случи, ако пропуснем тази стъпка?
+
+### Задача
+
+Създайте нов файл с име `app.js` в папката на вашия проект и го импортирайте в секцията `<head>` на вашия HTML:
+
+```html
+<script src="app.js" defer></script>
+```
+
+Сега в `app.js` ще създадем нова функция `updateRoute`:
+
+```js
+function updateRoute(templateId) {
+  const template = document.getElementById(templateId);
+  const view = template.content.cloneNode(true);
+  const app = document.getElementById('app');
+  app.innerHTML = '';
+  app.appendChild(view);
+}
+```
+
+Това, което правим тук, са точно описаните по-горе 3 стъпки. Инстанцираме шаблона с `id` `templateId` и поставяме клонираното му съдържание в нашия елемент за запазване на място. Забележете, че трябва да използваме `cloneNode(true)`, за да копираме цялото поддърво на шаблона.
+
+Сега извикайте тази функция с един от шаблоните и вижте резултата.
+
+```js
+updateRoute('login');
+```
+
+✅ Каква е целта на този код `app.innerHTML = '';`? Какво се случва без него?
+
+## Създаване на роутове
+
+Когато говорим за уеб приложение, наричаме *роутинг* намерението да се свържат **URL адреси** със специфични екрани, които трябва да бъдат показани. На уебсайт с множество HTML файлове това се прави автоматично, тъй като пътищата на файловете се отразяват в URL адреса. Например, с тези файлове във вашата проектна папка:
+
+```
+mywebsite/index.html
+mywebsite/login.html
+mywebsite/admin/index.html
+```
+
+Ако създадете уеб сървър с `mywebsite` като корен, картографирането на URL адресите ще бъде:
+
+```
+https://site.com            --> mywebsite/index.html
+https://site.com/login.html --> mywebsite/login.html
+https://site.com/admin/     --> mywebsite/admin/index.html
+```
+
+Въпреки това, за нашето уеб приложение използваме един HTML файл, съдържащ всички екрани, така че това поведение по подразбиране няма да ни помогне. Трябва да създадем тази карта ръчно и да актуализираме показания шаблон с помощта на JavaScript.
+
+### Задача
+
+Ще използваме прост обект, за да имплементираме [карта](https://en.wikipedia.org/wiki/Associative_array) между пътищата на URL адресите и нашите шаблони. Добавете този обект в началото на вашия `app.js` файл.
+
+```js
+const routes = {
+  '/login': { templateId: 'login' },
+  '/dashboard': { templateId: 'dashboard' },
+};
+```
+
+Сега нека модифицираме малко функцията `updateRoute`. Вместо директно да подаваме `templateId` като аргумент, искаме първо да извлечем текущия URL адрес и след това да използваме нашата карта, за да получим съответстващата стойност на `templateId`. Можем да използваме [`window.location.pathname`](https://developer.mozilla.org/docs/Web/API/Location/pathname), за да получим само частта от пътя на URL адреса.
+
+```js
+function updateRoute() {
+  const path = window.location.pathname;
+  const route = routes[path];
+
+  const template = document.getElementById(route.templateId);
+  const view = template.content.cloneNode(true);
+  const app = document.getElementById('app');
+  app.innerHTML = '';
+  app.appendChild(view);
+}
+```
+
+Тук картографирахме декларираните от нас роутове към съответстващия шаблон. Можете да проверите дали работи правилно, като промените URL адреса ръчно в браузъра си.
+
+✅ Какво се случва, ако въведете неизвестен път в URL адреса? Как бихме могли да решим този проблем?
+
+## Добавяне на навигация
+
+Следващата стъпка за нашето приложение е да добавим възможност за навигация между страниците, без да се налага ръчно да променяме URL адреса. Това включва две неща:
+
+1. Актуализиране на текущия URL адрес
+2. Актуализиране на показания шаблон въз основа на новия URL адрес
+
+Вече се погрижихме за втората част с функцията `updateRoute`, така че трябва да разберем как да актуализираме текущия URL адрес.
+
+Ще трябва да използваме JavaScript и по-специално [`history.pushState`](https://developer.mozilla.org/docs/Web/API/History/pushState), който позволява актуализиране на URL адреса и създаване на нов запис в историята на браузъра, без да се презарежда HTML.
+
+> Забележка: Докато HTML елементът за връзка [`<a href>`](https://developer.mozilla.org/docs/Web/HTML/Element/a) може да се използва самостоятелно за създаване на хипервръзки към различни URL адреси, той ще накара браузъра да презареди HTML по подразбиране. Необходимо е да се предотврати това поведение, когато се обработва роутинг с персонализиран JavaScript, като се използва функцията `preventDefault()` върху събитието за кликване.
+
+### Задача
+
+Нека създадем нова функция, която можем да използваме за навигация в нашето приложение:
+
+```js
+function navigate(path) {
+  window.history.pushState({}, path, path);
+  updateRoute();
+}
+```
+
+Този метод първо актуализира текущия URL адрес въз основа на дадения път, след което актуализира шаблона. Свойството `window.location.origin` връща корена на URL адреса, което ни позволява да реконструираме пълен URL адрес от даден път.
+
+Сега, когато имаме тази функция, можем да се погрижим за проблема, който имаме, ако даден път не съвпада с някой от дефинираните роутове. Ще модифицираме функцията `updateRoute`, като добавим резервен вариант към един от съществуващите роутове, ако не можем да намерим съвпадение.
+
+```js
+function updateRoute() {
+  const path = window.location.pathname;
+  const route = routes[path];
+
+  if (!route) {
+    return navigate('/login');
+  }
+
+  ...
+```
+
+Ако не може да се намери роут, сега ще пренасочваме към страницата за вход.
+
+Сега нека създадем функция, която да получава URL адреса, когато се кликне върху връзка, и да предотвратява стандартното поведение на браузъра за връзки:
+
+```js
+function onLinkClick(event) {
+  event.preventDefault();
+  navigate(event.target.href);
+}
+```
+
+Нека завършим системата за навигация, като добавим връзки към нашите бутони за *Вход* и *Изход* в HTML.
+
+```html
+<a href="/dashboard" onclick="onLinkClick(event)">Login</a>
+...
+<a href="/login" onclick="onLinkClick(event)">Logout</a>
+```
+
+Обектът `event` по-горе улавя събитието `click` и го предава на нашата функция `onLinkClick`.
+
+Използвайки атрибута [`onclick`](https://developer.mozilla.org/docs/Web/API/GlobalEventHandlers/onclick), свържете събитието `click` с JavaScript код, тук извикването на функцията `navigate()`.
+
+Опитайте да кликнете върху тези връзки, сега трябва да можете да навигирате между различните екрани на вашето приложение.
+
+✅ Методът `history.pushState` е част от стандарта HTML5 и е имплементиран във [всички модерни браузъри](https://caniuse.com/?search=pushState). Ако създавате уеб приложение за по-стари браузъри, има трик, който можете да използвате вместо този API: използвайки [хаш (`#`)](https://en.wikipedia.org/wiki/URI_fragment) преди пътя, можете да имплементирате роутинг, който работи с обикновена навигация чрез връзки и не презарежда страницата, тъй като целта му е да създава вътрешни връзки в рамките на страница.
+
+## Обработка на бутоните за връщане и напред на браузъра
+
+Използването на `history.pushState` създава нови записи в историята на навигацията на браузъра. Можете да проверите това, като задържите *бутона за връщане* на браузъра, трябва да се покаже нещо подобно:
+
+![Снимка на историята на навигацията](../../../../translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.bg.png)
+
+Ако опитате да кликнете върху бутона за връщане няколко пъти, ще видите, че текущият URL адрес се променя и историята се актуализира, но същият шаблон продължава да се показва.
+
+Това е така, защото приложението не знае, че трябва да извика `updateRoute()` всеки път, когато историята се промени. Ако погледнете документацията за [`history.pushState`](https://developer.mozilla.org/docs/Web/API/History/pushState), ще видите, че ако състоянието се промени - което означава, че сме преминали към различен URL адрес - се задейства събитието [`popstate`](https://developer.mozilla.org/docs/Web/API/Window/popstate_event). Ще използваме това, за да решим този проблем.
+
+### Задача
+
+За да се уверим, че показаният шаблон се актуализира, когато историята на браузъра се промени, ще прикачим нова функция, която извиква `updateRoute()`. Ще направим това в края на нашия файл `app.js`:
+
+```js
+window.onpopstate = () => updateRoute();
+updateRoute();
+```
+
+> Забележка: използвахме [arrow функция](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Functions/Arrow_functions) тук, за да декларираме нашия обработчик на събития `popstate` за краткост, но обикновена функция би работила по същия начин.
+
+Ето видео за освежаване на знанията за arrow функции:
+
+[![Arrow Functions](https://img.youtube.com/vi/OP6eEbOj2sc/0.jpg)](https://youtube.com/watch?v=OP6eEbOj2sc "Arrow Functions")
+
+> 🎥 Кликнете върху изображението по-горе за видео за arrow функции.
+
+Сега опитайте да използвате бутоните за връщане и напред на вашия браузър и проверете дали показаният роут се актуализира правилно този път.
+
+---
+
+## 🚀 Предизвикателство
+
+Добавете нов шаблон и роут за трета страница, която показва кредитите за това приложение.
+
+## Финален Тест
+
+[Финален тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/42)
+
+## Преглед и Самостоятелно Обучение
+
+Роутингът е една от изненадващо сложните части на уеб разработката, особено когато уебът преминава от поведение с презареждане на страници към поведение на Single Page Application. Прочетете малко за [как услугата Azure Static Web App](https://docs.microsoft.com/azure/static-web-apps/routes/?WT.mc_id=academic-77807-sagibbon) обработва роутинг. Можете ли да обясните защо някои от решенията, описани в този документ, са необходими?
+
+## Задание
+
+[Подобрете роутинга](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/1-template-route/assignment.md b/translations/bg/7-bank-project/1-template-route/assignment.md
new file mode 100644
index 00000000..4993b4e0
--- /dev/null
+++ b/translations/bg/7-bank-project/1-template-route/assignment.md
@@ -0,0 +1,28 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8223e429218befa731dd5bfd22299520",
+  "translation_date": "2025-08-28T07:41:02+00:00",
+  "source_file": "7-bank-project/1-template-route/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Подобряване на маршрутизацията
+
+## Инструкции
+
+Декларацията на маршрутите в момента съдържа само ID на шаблона, който да се използва. Но при показване на нова страница понякога е необходимо малко повече. Нека подобрим нашата имплементация на маршрутизацията с две допълнителни функции:
+
+- Дайте заглавия на всеки шаблон и актуализирайте заглавието на прозореца с това ново заглавие, когато шаблонът се промени.
+- Добавете опция за изпълнение на код след промяната на шаблона. Искаме да отпечатваме `'Dashboard is shown'` в конзолата за разработчици всеки път, когато страницата на таблото се показва.
+
+## Критерии за оценка
+
+| Критерий | Отлично                                                                                                                            | Задоволително                                                                                                                                                                             | Нуждае се от подобрение                                |
+| -------- | ----------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- |
+|          | Двете функции са имплементирани и работят. Добавянето на заглавие и код също работи за нов маршрут, добавен в декларацията `routes`. | Двете функции работят, но поведението е твърдо кодирано и не е конфигурируемо чрез декларацията `routes`. Добавянето на трети маршрут със заглавие и код работи частично или не работи. | Една от функциите липсва или не работи правилно.      |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/2-forms/README.md b/translations/bg/7-bank-project/2-forms/README.md
new file mode 100644
index 00000000..26053d67
--- /dev/null
+++ b/translations/bg/7-bank-project/2-forms/README.md
@@ -0,0 +1,313 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b667b7d601e2ee19acb5aa9d102dc9f3",
+  "translation_date": "2025-08-28T07:34:55+00:00",
+  "source_file": "7-bank-project/2-forms/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на Банкова Приложение Част 2: Създаване на Формуляр за Вход и Регистрация
+
+## Предварителен Тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/43)
+
+### Въведение
+
+В почти всички съвременни уеб приложения можете да създадете акаунт, за да имате свое собствено лично пространство. Тъй като множество потребители могат да имат достъп до уеб приложението едновременно, е необходим механизъм за съхранение на личните данни на всеки потребител отделно и за избор на информацията, която да се показва. Няма да разглеждаме как да управляваме [потребителската идентичност сигурно](https://en.wikipedia.org/wiki/Authentication), тъй като това е обширна тема сама по себе си, но ще се уверим, че всеки потребител може да създаде един (или повече) банкови акаунти в нашето приложение.
+
+В тази част ще използваме HTML формуляри, за да добавим вход и регистрация към нашето уеб приложение. Ще видим как да изпращаме данни към сървърна API програмно и в крайна сметка как да дефинираме основни правила за валидиране на потребителски вход.
+
+### Предварителни изисквания
+
+Трябва да сте завършили [HTML шаблони и маршрутизация](../1-template-route/README.md) на уеб приложението за този урок. Също така трябва да инсталирате [Node.js](https://nodejs.org) и [да стартирате сървърната API](../api/README.md) локално, за да можете да изпращате данни за създаване на акаунти.
+
+**Обърнете внимание**
+Ще имате два терминала, работещи едновременно, както е описано по-долу:
+1. За основното банково приложение, което създадохме в урока [HTML шаблони и маршрутизация](../1-template-route/README.md)
+2. За [сървърната API на Банковото Приложение](../api/README.md), която току-що настроихме.
+
+Трябва да стартирате и двата сървъра, за да продължите с останалата част от урока. Те слушат на различни портове (порт `3000` и порт `5000`), така че всичко трябва да работи без проблеми.
+
+Можете да тествате дали сървърът работи правилно, като изпълните тази команда в терминала:
+
+```sh
+curl http://localhost:5000/api
+# -> should return "Bank API v1.0.0" as a result
+```
+
+---
+
+## Формуляр и контроли
+
+Елементът `<form>` обхваща секция от HTML документ, където потребителят може да въвежда и изпраща данни чрез интерактивни контроли. Съществуват всякакви потребителски интерфейсни (UI) контроли, които могат да се използват в рамките на формуляр, като най-често срещаните са елементите `<input>` и `<button>`.
+
+Има много различни [типове](https://developer.mozilla.org/docs/Web/HTML/Element/input) `<input>`, например за създаване на поле, където потребителят може да въведе своето потребителско име, можете да използвате:
+
+```html
+<input id="username" name="username" type="text">
+```
+
+Атрибутът `name` ще се използва като име на свойството, когато данните от формуляра бъдат изпратени. Атрибутът `id` се използва за асоцииране на `<label>` с контролата на формуляра.
+
+> Разгледайте целия списък с [`<input>` типове](https://developer.mozilla.org/docs/Web/HTML/Element/input) и [други контроли на формуляри](https://developer.mozilla.org/docs/Learn/Forms/Other_form_controls), за да получите представа за всички вградени UI елементи, които можете да използвате при изграждането на вашия интерфейс.
+
+✅ Забележете, че `<input>` е [празен елемент](https://developer.mozilla.org/docs/Glossary/Empty_element), на който не трябва да добавяте съответстващ затварящ таг. Можете обаче да използвате самозатварящата се нотация `<input/>`, но това не е задължително.
+
+Елементът `<button>` в рамките на формуляр е малко специален. Ако не зададете неговия атрибут `type`, той автоматично ще изпрати данните от формуляра към сървъра, когато бъде натиснат. Ето възможните стойности на `type`:
+
+- `submit`: По подразбиране в рамките на `<form>`, бутонът задейства действието за изпращане на формуляра.
+- `reset`: Бутонът нулира всички контроли на формуляра до техните начални стойности.
+- `button`: Не задава никакво поведение по подразбиране, когато бутонът бъде натиснат. Можете да му зададете персонализирани действия с помощта на JavaScript.
+
+### Задача
+
+Нека започнем с добавяне на формуляр към шаблона `login`. Ще ни трябва поле за *потребителско име* и бутон *Вход*.
+
+```html
+<template id="login">
+  <h1>Bank App</h1>
+  <section>
+    <h2>Login</h2>
+    <form id="loginForm">
+      <label for="username">Username</label>
+      <input id="username" name="user" type="text">
+      <button>Login</button>
+    </form>
+  </section>
+</template>
+```
+
+Ако погледнете по-отблизо, можете да забележите, че тук сме добавили и елемент `<label>`. Елементите `<label>` се използват за добавяне на име към UI контроли, като нашето поле за потребителско име. Етикетите са важни за четимостта на вашите формуляри, но също така идват с допълнителни предимства:
+
+- Чрез асоцииране на етикет с контрола на формуляра, това помага на потребителите, използващи асистивни технологии (като екранен четец), да разберат какви данни се очаква да предоставят.
+- Можете да кликнете върху етикета, за да поставите директно фокуса върху свързаното поле, което улеснява достъпа на устройства с тъчскрийн.
+
+> [Достъпността](https://developer.mozilla.org/docs/Learn/Accessibility/What_is_accessibility) в уеб пространството е много важна тема, която често се пренебрегва. Благодарение на [семантичните HTML елементи](https://developer.mozilla.org/docs/Learn/Accessibility/HTML) не е трудно да създадете достъпно съдържание, ако ги използвате правилно. Можете [да прочетете повече за достъпността](https://developer.mozilla.org/docs/Web/Accessibility), за да избегнете често срещани грешки и да станете отговорен разработчик.
+
+Сега ще добавим втори формуляр за регистрация, точно под предишния:
+
+```html
+<hr/>
+<h2>Register</h2>
+<form id="registerForm">
+  <label for="user">Username</label>
+  <input id="user" name="user" type="text">
+  <label for="currency">Currency</label>
+  <input id="currency" name="currency" type="text" value="$">
+  <label for="description">Description</label>
+  <input id="description" name="description" type="text">
+  <label for="balance">Current balance</label>
+  <input id="balance" name="balance" type="number" value="0">
+  <button>Register</button>
+</form>
+```
+
+С помощта на атрибута `value` можем да дефинираме стойност по подразбиране за дадено поле.
+Забележете също, че полето за `balance` има тип `number`. Изглежда ли различно от другите полета? Опитайте да взаимодействате с него.
+
+✅ Можете ли да навигирате и взаимодействате с формулярите само с клавиатура? Как бихте направили това?
+
+## Изпращане на данни към сървъра
+
+Сега, когато имаме функционален интерфейс, следващата стъпка е да изпратим данните към сървъра. Нека направим бърз тест с текущия код: какво се случва, ако кликнете върху бутона *Вход* или *Регистрация*?
+
+Забелязахте ли промяната в секцията на URL адреса на браузъра?
+
+![Снимка на екрана, показваща промяна в URL адреса на браузъра след клик върху бутона Регистрация](../../../../translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.bg.png)
+
+По подразбиране действието на `<form>` е да изпрати формуляра към текущия URL адрес на сървъра, използвайки [GET метода](https://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3), като добавя данните от формуляра директно към URL адреса. Този метод обаче има някои недостатъци:
+
+- Изпратените данни са много ограничени по размер (около 2000 символа)
+- Данните са директно видими в URL адреса (не е подходящо за пароли)
+- Не работи с качване на файлове
+
+Затова можете да го промените, за да използва [POST метода](https://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5), който изпраща данните от формуляра към сървъра в тялото на HTTP заявката, без предишните ограничения.
+
+> Въпреки че POST е най-често използваният метод за изпращане на данни, [в някои специфични сценарии](https://www.w3.org/2001/tag/doc/whenToUseGet.html) е за предпочитане да се използва GET методът, например при имплементиране на поле за търсене.
+
+### Задача
+
+Добавете свойства `action` и `method` към формуляра за регистрация:
+
+```html
+<form id="registerForm" action="//localhost:5000/api/accounts" method="POST">
+```
+
+Сега опитайте да регистрирате нов акаунт с вашето име. След като кликнете върху бутона *Регистрация*, трябва да видите нещо подобно:
+
+![Прозорец на браузъра на адрес localhost:5000/api/accounts, показващ JSON низ с потребителски данни](../../../../translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.bg.png)
+
+Ако всичко върви добре, сървърът трябва да отговори на вашата заявка с [JSON](https://www.json.org/json-en.html) отговор, съдържащ данните за създадения акаунт.
+
+✅ Опитайте да се регистрирате отново със същото име. Какво се случва?
+
+## Изпращане на данни без презареждане на страницата
+
+Както вероятно забелязахте, има малък проблем с подхода, който току-що използвахме: при изпращане на формуляра излизаме от нашето приложение и браузърът се пренасочва към URL адреса на сървъра. Опитваме се да избегнем всички презареждания на страницата с нашето уеб приложение, тъй като създаваме [Едностранично приложение (SPA)](https://en.wikipedia.org/wiki/Single-page_application).
+
+За да изпратим данните от формуляра към сървъра без да принуждаваме презареждане на страницата, трябва да използваме JavaScript код. Вместо да поставяме URL адрес в свойството `action` на елемента `<form>`, можете да използвате произволен JavaScript код, предшестван от низа `javascript:`, за да изпълните персонализирано действие. Използването на това означава също, че ще трябва да имплементирате някои задачи, които преди това се извършваха автоматично от браузъра:
+
+- Извличане на данните от формуляра
+- Конвертиране и кодиране на данните от формуляра в подходящ формат
+- Създаване на HTTP заявка и изпращането й към сървъра
+
+### Задача
+
+Заменете `action` на формуляра за регистрация със:
+
+```html
+<form id="registerForm" action="javascript:register()">
+```
+
+Отворете `app.js` и добавете нова функция с име `register`:
+
+```js
+function register() {
+  const registerForm = document.getElementById('registerForm');
+  const formData = new FormData(registerForm);
+  const data = Object.fromEntries(formData);
+  const jsonData = JSON.stringify(data);
+}
+```
+
+Тук извличаме елемента на формуляра, използвайки `getElementById()` и използваме помощника [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData), за да извлечем стойностите от контролите на формуляра като набор от ключ/стойност двойки. След това конвертираме данните в обикновен обект, използвайки [`Object.fromEntries()`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object/fromEntries), и накрая сериализираме данните в [JSON](https://www.json.org/json-en.html), формат, който често се използва за обмен на данни в уеб пространството.
+
+Данните вече са готови за изпращане към сървъра. Създайте нова функция с име `createAccount`:
+
+```js
+async function createAccount(account) {
+  try {
+    const response = await fetch('//localhost:5000/api/accounts', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: account
+    });
+    return await response.json();
+  } catch (error) {
+    return { error: error.message || 'Unknown error' };
+  }
+}
+```
+
+Какво прави тази функция? Първо, забележете ключовата дума `async` тук. Това означава, че функцията съдържа код, който ще се изпълнява [**асинхронно**](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/async_function). Когато се използва заедно с ключовата дума `await`, тя позволява изчакване за изпълнение на асинхронен код - като изчакване за отговор от сървъра тук - преди да продължи.
+
+Ето кратко видео за използването на `async/await`:
+
+[![Async и Await за управление на обещания](https://img.youtube.com/vi/YwmlRkrxvkk/0.jpg)](https://youtube.com/watch?v=YwmlRkrxvkk "Async и Await за управление на обещания")
+
+> 🎥 Кликнете върху изображението по-горе за видео за async/await.
+
+Използваме API-то `fetch()`, за да изпратим JSON данни към сървъра. Този метод приема 2 параметъра:
+
+- URL адреса на сървъра, затова тук поставяме `//localhost:5000/api/accounts`.
+- Настройките на заявката. Тук задаваме метода на `POST` и предоставяме `body` за заявката. Тъй като изпращаме JSON данни към сървъра, трябва също да зададем заглавката `Content-Type` на `application/json`, за да може сървърът да интерпретира съдържанието.
+
+Тъй като сървърът ще отговори на заявката с JSON, можем да използваме `await response.json()`, за да анализираме JSON съдържанието и да върнем получения обект. Забележете, че този метод е асинхронен, затова използваме ключовата дума `await` тук, преди да върнем, за да се уверим, че всички грешки по време на анализа също са уловени.
+
+Сега добавете малко код към функцията `register`, за да извикате `createAccount()`:
+
+```js
+const result = await createAccount(jsonData);
+```
+
+Тъй като използваме ключовата дума `await` тук, трябва да добавим ключовата дума `async` преди функцията register:
+
+```js
+async function register() {
+```
+
+Накрая, нека добавим някои логове, за да проверим резултата. Финалната функция трябва да изглежда така:
+
+```js
+async function register() {
+  const registerForm = document.getElementById('registerForm');
+  const formData = new FormData(registerForm);
+  const jsonData = JSON.stringify(Object.fromEntries(formData));
+  const result = await createAccount(jsonData);
+
+  if (result.error) {
+    return console.log('An error occurred:', result.error);
+  }
+
+  console.log('Account created!', result);
+}
+```
+
+Това беше малко дълго, но стигнахме до целта! Ако отворите [инструментите за разработчици на браузъра](https://developer.mozilla.org/docs/Learn/Common_questions/What_are_browser_developer_tools) и опитате да регистрирате нов акаунт, не трябва да виждате никаква промяна на уеб страницата, но съобщение ще се появи в конзолата, потвърждавайки, че всичко работи.
+
+![Снимка на екрана, показваща съобщение в конзолата на браузъра](../../../../translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.bg.png)
+
+✅ Смятате ли, че данните се изпращат към сървъра сигурно? Какво би станало, ако някой успее да прихване заявката? Можете да прочетете за [HTTPS](https://en.wikipedia.org/wiki/HTTPS), за да научите повече за сигурната комуникация на данни.
+
+## Валидиране на данни
+
+Ако опитате да регистрирате нов акаунт, без да зададете потребителско име, можете да видите, че сървърът връща грешка със статус код [400 (Bad Request)](https://developer.mozilla.org/docs/Web/HTTP/Status/400#:~:text=The%20HyperText%20Transfer%20Protocol%20(HTTP,%2C%20or%20deceptive%20request%20routing).).
+
+Преди да изпращате данни към сървъра, е добра практика [да валидирате данните от формуляра](https://developer.mozilla.org/docs/Learn/Forms/Form_validation) предварително, когато е възможно, за да се уверите, че изпращате валидна заявка. HTML5 контролите на формуляра предоставят вградена валидиране, използвайки различни атрибути:
+
+- `required`: полето трябва да бъде попълнено, иначе формулярът не може да бъде изпратен.
+- `minlength` и `maxlength`: дефинират минималния и максималния брой символи в текстови полета.
+- `min` и `max`: дефинират минималната и максималната стойност на числово поле.
+- `type`: дефинира вида на очакваните данни, като `number`, `email`, `file` или [други вградени типове](https://developer.mozilla.org/docs/Web/HTML/Element/input). Този атрибут може също да промени визуалното представяне на контролата на формуляра.
+- `pattern`: позволява дефиниране на [регулярен израз](https
+> Съвет: можете да персонализирате външния вид на вашите контролни елементи във формуляра в зависимост от това дали са валидни или не, като използвате CSS псевдокласовете `:valid` и `:invalid`.
+### Задача
+
+Има два задължителни полета за създаване на валиден нов акаунт: потребителско име и валута. Останалите полета са по избор. Актуализирайте HTML формуляра, като използвате както атрибута `required`, така и текст в етикета на полето, за да:
+
+```html
+<label for="user">Username (required)</label>
+<input id="user" name="user" type="text" required>
+...
+<label for="currency">Currency (required)</label>
+<input id="currency" name="currency" type="text" value="$" required>
+```
+
+Въпреки че тази конкретна сървърна имплементация не налага специфични ограничения за максималната дължина на полетата, винаги е добра практика да се задават разумни ограничения за всяко текстово поле, което потребителят попълва.
+
+Добавете атрибут `maxlength` към текстовите полета:
+
+```html
+<input id="user" name="user" type="text" maxlength="20" required>
+...
+<input id="currency" name="currency" type="text" value="$" maxlength="5" required>
+...
+<input id="description" name="description" type="text" maxlength="100">
+```
+
+Сега, ако натиснете бутона *Регистрация* и някое поле не отговаря на зададените правила за валидация, ще видите нещо подобно:
+
+![Екранна снимка, показваща грешка при валидация при опит за изпращане на формуляра](../../../../translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.bg.png)
+
+Валидацията, която се извършва *преди* изпращането на данни към сървъра, се нарича **клиентска валидация**. Но имайте предвид, че не винаги е възможно да се извършат всички проверки без изпращане на данни. Например, тук не можем да проверим дали вече съществува акаунт със същото потребителско име, без да изпратим заявка към сървъра. Допълнителната валидация, която се извършва на сървъра, се нарича **сървърна валидация**.
+
+Обикновено и двете трябва да бъдат имплементирани. Клиентската валидация подобрява потребителското изживяване, като предоставя незабавна обратна връзка, но сървърната валидация е от съществено значение, за да се гарантира, че данните, които обработвате, са коректни и безопасни.
+
+---
+
+## 🚀 Предизвикателство
+
+Покажете съобщение за грешка в HTML, ако потребителят вече съществува.
+
+Ето пример как може да изглежда финалната страница за вход след малко стилизиране:
+
+![Екранна снимка на страницата за вход след добавяне на CSS стилове](../../../../translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.bg.png)
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/44)
+
+## Преглед и самостоятелно обучение
+
+Разработчиците са станали много креативни в усилията си за създаване на формуляри, особено по отношение на стратегиите за валидация. Научете повече за различни подходи към формулярите, като разгледате [CodePen](https://codepen.com); можете ли да намерите интересни и вдъхновяващи примери?
+
+## Задание
+
+[Стилизирайте вашето банково приложение](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/2-forms/assignment.md b/translations/bg/7-bank-project/2-forms/assignment.md
new file mode 100644
index 00000000..418e7edb
--- /dev/null
+++ b/translations/bg/7-bank-project/2-forms/assignment.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "474f3ab1ee755ca980fc9104a0316e17",
+  "translation_date": "2025-08-28T07:36:43+00:00",
+  "source_file": "7-bank-project/2-forms/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Стилизирайте вашето банково приложение
+
+## Инструкции
+
+Създайте нов файл `styles.css` и добавете връзка към него в текущия файл `index.html`. В CSS файла, който току-що създадохте, добавете стилове, за да направите страниците *Вход* и *Табло* да изглеждат добре и подредени. Опитайте се да създадете цветова тема, която да придаде на приложението ви собствена идентичност.
+
+> Съвет: можете да модифицирате HTML и да добавите нови елементи и класове, ако е необходимо.
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                                                                                | Задоволително                                                                  | Нуждае се от подобрение                                                                          |
+| -------- | ---------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------- |
+|          | Всички страници изглеждат чисти и четливи, с последователна цветова тема и ясно разграничени секции.                   | Страниците са стилизирани, но без тема или със секции, които не са ясно отделени. | Страниците липсват стилове, секциите изглеждат неподредени и информацията е трудна за четене.   |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/3-data/README.md b/translations/bg/7-bank-project/3-data/README.md
new file mode 100644
index 00000000..a1f49f6d
--- /dev/null
+++ b/translations/bg/7-bank-project/3-data/README.md
@@ -0,0 +1,337 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "f587e913e3f7c0b1c549a05dd74ee8e5",
+  "translation_date": "2025-08-28T07:31:53+00:00",
+  "source_file": "7-bank-project/3-data/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на Банкова Приложение Част 3: Методи за Извличане и Използване на Данни
+
+## Предварителен Тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/45)
+
+### Въведение
+
+В основата на всяко уеб приложение стои *данните*. Данните могат да приемат различни форми, но основната им цел винаги е да предоставят информация на потребителя. С развитието на уеб приложенията, които стават все по-интерактивни и сложни, начинът, по който потребителят достъпва и взаимодейства с информацията, е ключова част от уеб разработката.
+
+В този урок ще разгледаме как да извличаме данни от сървър асинхронно и как да използваме тези данни, за да показваме информация на уеб страница без презареждане на HTML.
+
+### Предварителни изисквания
+
+Трябва да сте създали [Формата за Вход и Регистрация](../2-forms/README.md) като част от уеб приложението за този урок. Също така трябва да инсталирате [Node.js](https://nodejs.org) и [да стартирате сървърния API](../api/README.md) локално, за да получите данни за акаунта.
+
+Можете да тествате дали сървърът работи правилно, като изпълните следната команда в терминала:
+
+```sh
+curl http://localhost:5000/api
+# -> should return "Bank API v1.0.0" as a result
+```
+
+---
+
+## AJAX и извличане на данни
+
+Традиционните уеб сайтове обновяват съдържанието, когато потребителят избере линк или изпрати данни чрез форма, като презареждат цялата HTML страница. Всеки път, когато трябва да се заредят нови данни, уеб сървърът връща изцяло нова HTML страница, която трябва да бъде обработена от браузъра, прекъсвайки текущото действие на потребителя и ограничавайки взаимодействията по време на презареждането. Този работен процес е известен като *Многостранично Приложение* или *MPA*.
+
+![Работен процес при многостранично приложение](../../../../translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.bg.png)
+
+С развитието на по-сложни и интерактивни уеб приложения се появи нова техника, наречена [AJAX (Асинхронен JavaScript и XML)](https://en.wikipedia.org/wiki/Ajax_(programming)). Тази техника позволява на уеб приложенията да изпращат и получават данни от сървър асинхронно с помощта на JavaScript, без да се налага презареждане на HTML страницата, което води до по-бързи актуализации и по-гладки взаимодействия с потребителя. Когато нови данни се получат от сървъра, текущата HTML страница може да бъде обновена с JavaScript чрез [DOM](https://developer.mozilla.org/docs/Web/API/Document_Object_Model) API. С времето този подход еволюира в това, което сега наричаме [*Едностранично Приложение* или *SPA*](https://en.wikipedia.org/wiki/Single-page_application).
+
+![Работен процес при едностранично приложение](../../../../translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.bg.png)
+
+Когато AJAX беше въведен за първи път, единственият наличен API за асинхронно извличане на данни беше [`XMLHttpRequest`](https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest). Но съвременните браузъри вече поддържат по-удобния и мощен [`Fetch` API](https://developer.mozilla.org/docs/Web/API/Fetch_API), който използва обещания (promises) и е по-подходящ за работа с JSON данни.
+
+> Въпреки че всички съвременни браузъри поддържат `Fetch API`, ако искате вашето уеб приложение да работи на стари браузъри, винаги е добра идея да проверите [таблицата за съвместимост на caniuse.com](https://caniuse.com/fetch).
+
+### Задача
+
+В [предишния урок](../2-forms/README.md) имплементирахме формата за регистрация, за да създадем акаунт. Сега ще добавим код за вход с вече съществуващ акаунт и извличане на неговите данни. Отворете файла `app.js` и добавете нова функция `login`:
+
+```js
+async function login() {
+  const loginForm = document.getElementById('loginForm')
+  const user = loginForm.user.value;
+}
+```
+
+Тук започваме с извличане на елемента на формата чрез `getElementById()`, след което получаваме потребителското име от полето за вход с `loginForm.user.value`. Всеки контрол на формата може да бъде достъпен чрез неговото име (зададено в HTML чрез атрибута `name`) като свойство на формата.
+
+По подобен начин на това, което направихме за регистрацията, ще създадем друга функция за изпълнение на заявка към сървъра, но този път за извличане на данни за акаунта:
+
+```js
+async function getAccount(user) {
+  try {
+    const response = await fetch('//localhost:5000/api/accounts/' + encodeURIComponent(user));
+    return await response.json();
+  } catch (error) {
+    return { error: error.message || 'Unknown error' };
+  }
+}
+```
+
+Използваме `fetch` API, за да заявим данните асинхронно от сървъра, но този път не се нуждаем от допълнителни параметри освен URL адреса, тъй като само извличаме данни. По подразбиране `fetch` създава HTTP заявка от тип [`GET`](https://developer.mozilla.org/docs/Web/HTTP/Methods/GET), което е точно това, което ни трябва тук.
+
+✅ `encodeURIComponent()` е функция, която кодира специални символи за URL. Какви проблеми бихме могли да имаме, ако не извикаме тази функция и използваме директно стойността на `user` в URL?
+
+Сега нека актуализираме нашата функция `login`, за да използва `getAccount`:
+
+```js
+async function login() {
+  const loginForm = document.getElementById('loginForm')
+  const user = loginForm.user.value;
+  const data = await getAccount(user);
+
+  if (data.error) {
+    return console.log('loginError', data.error);
+  }
+
+  account = data;
+  navigate('/dashboard');
+}
+```
+
+Първо, тъй като `getAccount` е асинхронна функция, трябва да я съчетаем с ключовата дума `await`, за да изчакаме резултата от сървъра. Както при всяка заявка към сървър, трябва да се справим и с грешки. Засега ще добавим само съобщение за грешка в конзолата и ще се върнем към това по-късно.
+
+След това трябва да съхраним данните някъде, за да можем по-късно да ги използваме за показване на информацията на таблото. Тъй като променливата `account` все още не съществува, ще създадем глобална променлива за нея в началото на нашия файл:
+
+```js
+let account = null;
+```
+
+След като данните за потребителя са запазени в променлива, можем да преминем от страницата за *вход* към *таблото* с помощта на функцията `navigate()`, която вече имаме.
+
+Накрая, трябва да извикаме нашата функция `login`, когато формата за вход е изпратена, като модифицираме HTML:
+
+```html
+<form id="loginForm" action="javascript:login()">
+```
+
+Тествайте дали всичко работи правилно, като регистрирате нов акаунт и опитате да влезете с него.
+
+Преди да преминем към следващата част, можем също да завършим функцията `register`, като добавим това в края на функцията:
+
+```js
+account = result;
+navigate('/dashboard');
+```
+
+✅ Знаете ли, че по подразбиране можете да извиквате сървърни API само от *същия домейн и порт*, от който разглеждате уеб страницата? Това е механизъм за сигурност, наложен от браузърите. Но изчакайте, нашето уеб приложение работи на `localhost:3000`, докато сървърният API работи на `localhost:5000`. Защо тогава работи? Чрез използване на техника, наречена [Споделяне на Ресурси между Различни Произходи (CORS)](https://developer.mozilla.org/docs/Web/HTTP/CORS), е възможно да се изпълняват HTTP заявки между различни произходи, ако сървърът добави специални заглавия към отговора, позволяващи изключения за конкретни домейни.
+
+> Научете повече за API, като преминете този [урок](https://docs.microsoft.com/learn/modules/use-apis-discover-museum-art/?WT.mc_id=academic-77807-sagibbon)
+
+## Актуализиране на HTML за показване на данни
+
+Сега, когато разполагаме с данните за потребителя, трябва да актуализираме съществуващия HTML, за да ги покажем. Вече знаем как да извличаме елемент от DOM, например с `document.getElementById()`. След като имате базов елемент, ето някои API, които можете да използвате, за да го модифицирате или добавите дъщерни елементи към него:
+
+- С помощта на свойството [`textContent`](https://developer.mozilla.org/docs/Web/API/Node/textContent) можете да промените текста на елемента. Имайте предвид, че промяната на тази стойност премахва всички дъщерни елементи (ако има такива) и ги заменя с предоставения текст. Това също е ефективен метод за премахване на всички дъщерни елементи на даден елемент, като му зададете празен низ `''`.
+
+- С помощта на [`document.createElement()`](https://developer.mozilla.org/docs/Web/API/Document/createElement) заедно с метода [`append()`](https://developer.mozilla.org/docs/Web/API/ParentNode/append) можете да създавате и прикачвате един или повече нови дъщерни елементи.
+
+✅ С помощта на свойството [`innerHTML`](https://developer.mozilla.org/docs/Web/API/Element/innerHTML) на елемент също е възможно да промените неговото HTML съдържание, но това трябва да се избягва, тъй като е уязвимо към [атаки чрез междусайтово скриптиране (XSS)](https://developer.mozilla.org/docs/Glossary/Cross-site_scripting).
+
+### Задача
+
+Преди да преминем към екрана на таблото, има още нещо, което трябва да направим на страницата за *вход*. В момента, ако се опитате да влезете с потребителско име, което не съществува, съобщение се показва в конзолата, но за обикновения потребител нищо не се променя и не е ясно какво се случва.
+
+Нека добавим елемент за запазване на място във формата за вход, където можем да показваме съобщение за грешка, ако е необходимо. Добро място би било точно преди бутона за вход `<button>`:
+
+```html
+...
+<div id="loginError"></div>
+<button>Login</button>
+...
+```
+
+Този `<div>` елемент е празен, което означава, че нищо няма да се показва на екрана, докато не добавим съдържание към него. Също така му даваме `id`, за да можем лесно да го извличаме с JavaScript.
+
+Върнете се към файла `app.js` и създайте нова помощна функция `updateElement`:
+
+```js
+function updateElement(id, text) {
+  const element = document.getElementById(id);
+  element.textContent = text;
+}
+```
+
+Тази функция е доста проста: като се дадат *id* на елемент и *текст*, тя ще актуализира текстовото съдържание на DOM елемента с даденото `id`. Нека използваме този метод вместо предишното съобщение за грешка във функцията `login`:
+
+```js
+if (data.error) {
+  return updateElement('loginError', data.error);
+}
+```
+
+Сега, ако се опитате да влезете с невалиден акаунт, трябва да видите нещо подобно:
+
+![Снимка на екрана, показваща съобщението за грешка при вход](../../../../translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.bg.png)
+
+Сега имаме текст за грешка, който се показва визуално, но ако го опитате със скрийн рийдър, ще забележите, че нищо не се обявява. За да може текст, който се добавя динамично към страница, да бъде обявен от скрийн рийдъри, ще трябва да използва нещо, наречено [Жива Област (Live Region)](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/ARIA_Live_Regions). Тук ще използваме специфичен тип жива област, наречена предупреждение:
+
+```html
+<div id="loginError" role="alert"></div>
+```
+
+Имплементирайте същото поведение за грешките във функцията `register` (не забравяйте да актуализирате HTML).
+
+## Показване на информация на таблото
+
+С помощта на същите техники, които току-що разгледахме, ще се погрижим и за показването на информацията за акаунта на страницата на таблото.
+
+Ето как изглежда обектът на акаунта, получен от сървъра:
+
+```json
+{
+  "user": "test",
+  "currency": "$",
+  "description": "Test account",
+  "balance": 75,
+  "transactions": [
+    { "id": "1", "date": "2020-10-01", "object": "Pocket money", "amount": 50 },
+    { "id": "2", "date": "2020-10-03", "object": "Book", "amount": -10 },
+    { "id": "3", "date": "2020-10-04", "object": "Sandwich", "amount": -5 }
+  ],
+}
+```
+
+> Забележка: за да улесните работата си, можете да използвате предварително създадения акаунт `test`, който вече е попълнен с данни.
+
+### Задача
+
+Нека започнем, като заменим секцията "Баланс" в HTML, за да добавим елементи за запазване на място:
+
+```html
+<section>
+  Balance: <span id="balance"></span><span id="currency"></span>
+</section>
+```
+
+Също така ще добавим нова секция точно под нея, за да показваме описанието на акаунта:
+
+```html
+<h2 id="description"></h2>
+```
+
+✅ Тъй като описанието на акаунта функционира като заглавие за съдържанието под него, то е маркирано семантично като заглавие. Научете повече за това как [структурата на заглавията](https://www.nomensa.com/blog/2017/how-structure-headings-web-accessibility) е важна за достъпността и направете критичен преглед на страницата, за да определите какво друго би могло да бъде заглавие.
+
+След това ще създадем нова функция в `app.js`, за да попълним елементите за запазване на място:
+
+```js
+function updateDashboard() {
+  if (!account) {
+    return navigate('/login');
+  }
+
+  updateElement('description', account.description);
+  updateElement('balance', account.balance.toFixed(2));
+  updateElement('currency', account.currency);
+}
+```
+
+Първо, проверяваме дали разполагаме с необходимите данни за акаунта, преди да продължим. След това използваме функцията `updateElement()`, която създадохме по-рано, за да актуализираме HTML.
+
+> За да направим показването на баланса по-привлекателно, използваме метода [`toFixed(2)`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed), за да принудим показването на стойността с 2 цифри след десетичната запетая.
+
+Сега трябва да извикаме нашата функция `updateDashboard()` всеки път, когато таблото се зарежда. Ако вече сте завършили [заданието от урок 1](../1-template-route/assignment.md), това трябва да е лесно, в противен случай можете да използвате следната имплементация.
+
+Добавете този код в края на функцията `updateRoute()`:
+
+```js
+if (typeof route.init === 'function') {
+  route.init();
+}
+```
+
+И актуализирайте дефиницията на маршрутите със:
+
+```js
+const routes = {
+  '/login': { templateId: 'login' },
+  '/dashboard': { templateId: 'dashboard', init: updateDashboard }
+};
+```
+
+С тази промяна, всеки път, когато страницата на таблото се показва, се извиква функцията `updateDashboard()`. След вход трябва да можете да видите баланса на акаунта, валутата и описанието.
+
+## Създаване на редове в таблица динамично с HTML шаблони
+
+В [първия урок](../1-template-route/README.md) използвахме HTML шаблони заедно с метода [`appendChild()`](https://developer.mozilla.org/docs/Web/API/Node/appendChild), за да имплементираме навигацията в нашето приложение. Шаблоните могат да бъдат и по-малки и да се използват за динамично попълване на повтарящи се части от страница.
+
+Ще използваме подобен подход, за да покажем списъка с транзакции в HTML таблица.
+
+### Задача
+
+Добавете нов шаблон в `<body>` на HTML:
+
+```html
+<template id="transaction">
+  <tr>
+    <td></td>
+    <td></td>
+    <td></td>
+  </tr>
+</template>
+```
+
+Този шаблон представлява един ред в таблицата с трите колони, които искаме да попълним: *дата*, *обект* и *сума* на транзакцията.
+
+След това добавете този `id` атрибут към `<tbody>` елемента на таблицата в шаблона на таблото, за да го направите по-лесен за намиране с JavaScript:
+
+```html
+<tbody id="transactions"></tbody>
+```
+
+Нашият HTML е готов, нека преминем към JavaScript кода и създадем нова функция `createTransactionRow`:
+
+```js
+function createTransactionRow(transaction) {
+  const template = document.getElementById('transaction');
+  const transactionRow = template.content.cloneNode(true);
+  const tr = transactionRow.querySelector('tr');
+  tr.children[0].textContent = transaction.date;
+  tr.children[1].textContent = transaction.object;
+  tr.children[2].textContent = transaction.amount.toFixed(2);
+  return transactionRow;
+}
+```
+
+Тази функция прави точно това, което подсказва името ѝ: използвайки шаблона, който създадохме по-рано, тя създава нов ред в таблицата и попълва съдържанието му с данни за транзакцията. Ще използваме това в нашата функция `updateDashboard()`, за да попълним таблицата:
+
+```js
+const transactionsRows = document.createDocumentFragment();
+for (const transaction of account.transactions) {
+  const transactionRow = createTransactionRow(transaction);
+  transactionsRows.appendChild(transactionRow);
+}
+updateElement('transactions', transactionsRows);
+```
+
+Тук използваме метода [`document.createDocumentFragment()`](https://developer.mozilla.org/docs/Web/API/Document/createDocumentFragment), който създава нов DOM фрагмент, върху който можем да работим, преди накрая да го прикачим към нашата HTML таблица.
+
+Остава
+Ако опитате да влезете с акаунта `test`, вече трябва да виждате списък с транзакции на таблото 🎉.
+
+---
+
+## 🚀 Предизвикателство
+
+Работете заедно, за да направите страницата на таблото да изглежда като истинско банково приложение. Ако вече сте стилизирали приложението си, опитайте да използвате [медийни заявки](https://developer.mozilla.org/docs/Web/CSS/Media_Queries), за да създадете [отзивчив дизайн](https://developer.mozilla.org/docs/Web/Progressive_web_apps/Responsive/responsive_design_building_blocks), който работи добре както на настолни, така и на мобилни устройства.
+
+Ето пример за стилизирана страница на таблото:
+
+![Снимка на примерен резултат на таблото след стилизиране](../../../../translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.bg.png)
+
+## Тест след лекцията
+
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/46)
+
+## Задание
+
+[Рефакторирайте и коментирайте кода си](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/3-data/assignment.md b/translations/bg/7-bank-project/3-data/assignment.md
new file mode 100644
index 00000000..91edec5d
--- /dev/null
+++ b/translations/bg/7-bank-project/3-data/assignment.md
@@ -0,0 +1,29 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "a4abf305ede1cfaadd56a8fab4b4c288",
+  "translation_date": "2025-08-28T07:33:09+00:00",
+  "source_file": "7-bank-project/3-data/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Рефакторирайте и коментирайте вашия код
+
+## Инструкции
+
+С разрастването на вашия кодов проект е важно често да рефакторирате кода си, за да остане четим и лесен за поддръжка с времето. Добавете коментари и рефакторирайте вашия `app.js`, за да подобрите качеството на кода:
+
+- Извлечете константи, като например основния URL на сървърния API
+- Обединете подобен код: например можете да създадете функция `sendRequest()`, за да групирате кода, използван както в `createAccount()`, така и в `getAccount()`
+- Реорганизирайте кода, за да го направите по-лесен за четене, и добавете коментари
+
+## Критерии за оценка
+
+| Критерии | Отлично                                                                                                                                                     | Задоволително                                                                                     | Нуждае се от подобрение                                                                     |
+| -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ |
+|          | Кодът е коментиран, добре организиран в различни секции и лесен за четене. Константите са извлечени и е създадена факторизирана функция `sendRequest()`.      | Кодът е чист, но може да бъде подобрен с повече коментари, извличане на константи или факторизация. | Кодът е хаотичен, не е коментиран, константите не са извлечени и кодът не е факторизиран.   |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/4-state-management/README.md b/translations/bg/7-bank-project/4-state-management/README.md
new file mode 100644
index 00000000..03f3a7e4
--- /dev/null
+++ b/translations/bg/7-bank-project/4-state-management/README.md
@@ -0,0 +1,284 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "4fa20c513e367e9cdd401bf49ae16e33",
+  "translation_date": "2025-08-28T07:37:48+00:00",
+  "source_file": "7-bank-project/4-state-management/README.md",
+  "language_code": "bg"
+}
+-->
+# Създаване на банково приложение, част 4: Концепции за управление на състоянието
+
+## Предварителен тест
+
+[Предварителен тест](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/47)
+
+### Въведение
+
+С разрастването на уеб приложението става предизвикателство да се следят всички потоци от данни. Кой код получава данните, коя страница ги използва, къде и кога трябва да бъдат актуализирани... лесно е да се стигне до объркан код, който е труден за поддръжка. Това е особено вярно, когато трябва да споделяте данни между различни страници на приложението, например данни за потребителя. Концепцията за *управление на състоянието* винаги е съществувала във всички видове програми, но с увеличаването на сложността на уеб приложенията тя вече е ключова точка, която трябва да се обмисли по време на разработката.
+
+В тази последна част ще разгледаме приложението, което създадохме, за да преосмислим как се управлява състоянието, като позволим поддръжка на обновяване на браузъра по всяко време и запазване на данните между потребителските сесии.
+
+### Предпоставки
+
+Трябва да сте завършили [частта за извличане на данни](../3-data/README.md) от уеб приложението за този урок. Също така трябва да инсталирате [Node.js](https://nodejs.org) и [да стартирате API сървъра](../api/README.md) локално, за да можете да управлявате данните за акаунта.
+
+Можете да тествате дали сървърът работи правилно, като изпълните тази команда в терминала:
+
+```sh
+curl http://localhost:5000/api
+# -> should return "Bank API v1.0.0" as a result
+```
+
+---
+
+## Преосмисляне на управлението на състоянието
+
+В [предишния урок](../3-data/README.md) въведохме основна концепция за състояние в нашето приложение с глобалната променлива `account`, която съдържа банковите данни за текущо влезлия потребител. Въпреки това, текущата ни имплементация има някои недостатъци. Опитайте да обновите страницата, когато сте на таблото. Какво се случва?
+
+Има три проблема с текущия код:
+
+- Състоянието не се запазва, тъй като обновяването на браузъра ви връща обратно на страницата за вход.
+- Има множество функции, които модифицират състоянието. С разрастването на приложението това може да затрудни проследяването на промените и лесно да се забрави актуализирането на някоя.
+- Състоянието не се изчиства, така че когато кликнете върху *Изход*, данните за акаунта все още са там, въпреки че сте на страницата за вход.
+
+Можем да актуализираме кода си, за да се справим с тези проблеми един по един, но това би създало повече дублиране на код и би направило приложението по-сложно и трудно за поддръжка. Или можем да спрем за няколко минути и да преосмислим стратегията си.
+
+> Какви проблеми всъщност се опитваме да решим тук?
+
+[Управлението на състоянието](https://en.wikipedia.org/wiki/State_management) е свързано с намирането на добър подход за решаване на тези два конкретни проблема:
+
+- Как да направим потоците от данни в приложението разбираеми?
+- Как да поддържаме данните за състоянието винаги синхронизирани с потребителския интерфейс (и обратно)?
+
+След като се погрижите за тези проблеми, всички други проблеми, които може да имате, или ще бъдат вече решени, или ще станат по-лесни за решаване. Има много възможни подходи за решаване на тези проблеми, но ние ще използваме общо решение, което се състои в **централизиране на данните и начините за тяхната промяна**. Потокът от данни би изглеждал така:
+
+![Схема, показваща потоците от данни между HTML, действията на потребителя и състоянието](../../../../translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.bg.png)
+
+> Тук няма да разглеждаме частта, в която данните автоматично задействат актуализацията на изгледа, тъй като тя е свързана с по-напреднали концепции на [Реактивното програмиране](https://en.wikipedia.org/wiki/Reactive_programming). Това е добра тема за последващо задълбочаване.
+
+✅ Съществуват много библиотеки с различни подходи към управлението на състоянието, като [Redux](https://redux.js.org) е популярна опция. Разгледайте концепциите и моделите, които се използват, тъй като често това е добър начин да научите какви потенциални проблеми може да срещнете в големи уеб приложения и как те могат да бъдат решени.
+
+### Задача
+
+Ще започнем с малко рефакториране. Заменете декларацията на `account`:
+
+```js
+let account = null;
+```
+
+С:
+
+```js
+let state = {
+  account: null
+};
+```
+
+Идеята е да *централизираме* всички данни на приложението в един обект за състояние. Засега имаме само `account` в състоянието, така че това не променя много, но създава път за бъдещи промени.
+
+Също така трябва да актуализираме функциите, които го използват. Във функциите `register()` и `login()` заменете `account = ...` с `state.account = ...`;
+
+В началото на функцията `updateDashboard()` добавете този ред:
+
+```js
+const account = state.account;
+```
+
+Това рефакториране само по себе си не донесе много подобрения, но идеята беше да се положи основата за следващите промени.
+
+## Проследяване на промените в данните
+
+Сега, когато сме поставили обекта `state` за съхранение на нашите данни, следващата стъпка е да централизиране актуализациите. Целта е да се улесни проследяването на всякакви промени и кога те се случват.
+
+За да избегнем промени в обекта `state`, също е добра практика да го считаме за [*неизменяем*](https://en.wikipedia.org/wiki/Immutable_object), което означава, че той изобщо не може да бъде модифициран. Това означава, че трябва да създадете нов обект за състояние, ако искате да промените нещо в него. По този начин изграждате защита срещу потенциално нежелани [странични ефекти](https://en.wikipedia.org/wiki/Side_effect_(computer_science)) и отваряте възможности за нови функции в приложението си, като например внедряване на undo/redo, като същевременно улеснявате дебъгването. Например, можете да регистрирате всяка промяна, направена в състоянието, и да запазите историята на промените, за да разберете източника на грешка.
+
+В JavaScript можете да използвате [`Object.freeze()`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze), за да създадете неизменяема версия на обект. Ако се опитате да направите промени в неизменяем обект, ще бъде хвърлено изключение.
+
+✅ Знаете ли разликата между *повърхностно* и *дълбоко* неизменяем обект? Можете да прочетете за това [тук](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze#What_is_shallow_freeze).
+
+### Задача
+
+Нека създадем нова функция `updateState()`:
+
+```js
+function updateState(property, newData) {
+  state = Object.freeze({
+    ...state,
+    [property]: newData
+  });
+}
+```
+
+В тази функция създаваме нов обект за състояние и копираме данни от предишното състояние, използвайки [*оператора за разпръскване (`...`)*](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Spread_syntax#Spread_in_object_literals). След това презаписваме конкретно свойство на обекта за състояние с новите данни, използвайки [нотацията с квадратни скоби](https://developer.mozilla.org/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties) `[property]` за присвояване. Накрая заключваме обекта, за да предотвратим модификации, използвайки `Object.freeze()`. Засега имаме само свойството `account`, съхранено в състоянието, но с този подход можете да добавите толкова свойства, колкото са ви необходими.
+
+Също така ще актуализираме инициализацията на `state`, за да сме сигурни, че началното състояние също е заключено:
+
+```js
+let state = Object.freeze({
+  account: null
+});
+```
+
+След това актуализирайте функцията `register`, като замените присвояването `state.account = result;` с:
+
+```js
+updateState('account', result);
+```
+
+Направете същото с функцията `login`, като замените `state.account = data;` с:
+
+```js
+updateState('account', data);
+```
+
+Сега ще използваме възможността да поправим проблема с данните за акаунта, които не се изчистват, когато потребителят кликне върху *Изход*.
+
+Създайте нова функция `logout()`:
+
+```js
+function logout() {
+  updateState('account', null);
+  navigate('/login');
+}
+```
+
+В `updateDashboard()` заменете пренасочването `return navigate('/login');` с `return logout();`
+
+Опитайте да регистрирате нов акаунт, да излезете и да влезете отново, за да проверите дали всичко все още работи правилно.
+
+> Съвет: можете да разгледате всички промени в състоянието, като добавите `console.log(state)` в края на `updateState()` и отворите конзолата в инструментите за разработка на браузъра.
+
+## Запазване на състоянието
+
+Повечето уеб приложения трябва да запазват данни, за да могат да работят правилно. Всички критични данни обикновено се съхраняват в база данни и се достъпват чрез API на сървъра, като например данните за потребителския акаунт в нашия случай. Но понякога е интересно да се запазят някои данни в клиентското приложение, което работи в браузъра, за по-добро потребителско изживяване или за подобряване на производителността при зареждане.
+
+Когато искате да запазите данни в браузъра, има няколко важни въпроса, които трябва да си зададете:
+
+- *Данните чувствителни ли са?* Трябва да избягвате съхраняването на чувствителни данни в клиента, като например пароли на потребители.
+- *За колко време трябва да запазите тези данни?* Планирате ли да достъпвате тези данни само за текущата сесия или искате те да се съхраняват завинаги?
+
+Съществуват множество начини за съхранение на информация в уеб приложение, в зависимост от това, което искате да постигнете. Например, можете да използвате URL адресите, за да съхранявате заявка за търсене и да я направите споделима между потребителите. Можете също така да използвате [HTTP бисквитки](https://developer.mozilla.org/docs/Web/HTTP/Cookies), ако данните трябва да се споделят със сървъра, като например информация за [автентикация](https://en.wikipedia.org/wiki/Authentication).
+
+Друга опция е да използвате един от многото API на браузъра за съхранение на данни. Два от тях са особено интересни:
+
+- [`localStorage`](https://developer.mozilla.org/docs/Web/API/Window/localStorage): [Key/Value хранилище](https://en.wikipedia.org/wiki/Key%E2%80%93value_database), което позволява запазване на данни, специфични за текущия уеб сайт, между различни сесии. Данните, запазени в него, никога не изтичат.
+- [`sessionStorage`](https://developer.mozilla.org/docs/Web/API/Window/sessionStorage): работи по същия начин като `localStorage`, с изключение на това, че данните, съхранени в него, се изчистват, когато сесията приключи (когато браузърът се затвори).
+
+Имайте предвид, че и двата API позволяват съхранение само на [низове](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String). Ако искате да съхранявате сложни обекти, ще трябва да ги сериализирате във формат [JSON](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/JSON), използвайки [`JSON.stringify()`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify).
+
+✅ Ако искате да създадете уеб приложение, което не работи със сървър, е възможно да създадете база данни на клиента, използвайки [`IndexedDB` API](https://developer.mozilla.org/docs/Web/API/IndexedDB_API). Това е запазено за напреднали случаи на употреба или ако трябва да съхранявате значително количество данни, тъй като е по-сложно за използване.
+
+### Задача
+
+Искаме нашите потребители да останат влезли, докато не кликнат изрично върху бутона *Изход*, така че ще използваме `localStorage`, за да съхраняваме данните за акаунта. Първо, нека дефинираме ключ, който ще използваме за съхранение на нашите данни.
+
+```js
+const storageKey = 'savedAccount';
+```
+
+След това добавете този ред в края на функцията `updateState()`:
+
+```js
+localStorage.setItem(storageKey, JSON.stringify(state.account));
+```
+
+С това данните за потребителския акаунт ще бъдат запазени и винаги актуални, тъй като преди това централизирахме всички актуализации на състоянието. Тук започваме да се възползваме от всички предишни рефакторирания 🙂.
+
+Тъй като данните се запазват, трябва също така да се погрижим за тяхното възстановяване, когато приложението се зареди. Тъй като започваме да имаме повече код за инициализация, може би е добра идея да създадем нова функция `init`, която включва и предишния код в края на `app.js`:
+
+```js
+function init() {
+  const savedAccount = localStorage.getItem(storageKey);
+  if (savedAccount) {
+    updateState('account', JSON.parse(savedAccount));
+  }
+
+  // Our previous initialization code
+  window.onpopstate = () => updateRoute();
+  updateRoute();
+}
+
+init();
+```
+
+Тук извличаме запазените данни и ако има такива, актуализираме състоянието съответно. Важно е да направим това *преди* актуализирането на маршрута, тъй като може да има код, който разчита на състоянието по време на актуализацията на страницата.
+
+Също така можем да направим страницата *Табло* основната страница на нашето приложение, тъй като сега запазваме данните за акаунта. Ако не се намерят данни, таблото се грижи за пренасочването към страницата *Вход* така или иначе. В `updateRoute()` заменете резервния вариант `return navigate('/login');` с `return navigate('/dashboard');`.
+
+Сега влезте в приложението и опитайте да обновите страницата. Трябва да останете на таблото. С тази актуализация сме се погрижили за всички първоначални проблеми...
+
+## Обновяване на данните
+
+...Но може би сме създали нов проблем. Опа!
+
+Отидете на таблото, използвайки акаунта `test`, след това изпълнете тази команда в терминала, за да създадете нова транзакция:
+
+```sh
+curl --request POST \
+     --header "Content-Type: application/json" \
+     --data "{ \"date\": \"2020-07-24\", \"object\": \"Bought book\", \"amount\": -20 }" \
+     http://localhost:5000/api/accounts/test/transactions
+```
+
+Опитайте да обновите страницата на таблото в браузъра сега. Какво се случва? Виждате ли новата транзакция?
+
+Състоянието се запазва за неопределено време благодарение на `localStorage`, но това също означава, че то никога не се актуализира, докато не излезете от приложението и не влезете отново!
+
+Една възможна стратегия за решаване на този проблем е да презареждаме данните за акаунта всеки път, когато таблото се зарежда, за да избегнем остарели данни.
+
+### Задача
+
+Създайте нова функция `updateAccountData`:
+
+```js
+async function updateAccountData() {
+  const account = state.account;
+  if (!account) {
+    return logout();
+  }
+
+  const data = await getAccount(account.user);
+  if (data.error) {
+    return logout();
+  }
+
+  updateState('account', data);
+}
+```
+
+Този метод проверява дали в момента сме влезли, след което презарежда данните за акаунта от сървъра.
+
+Създайте друга функция, наречена `refresh`:
+
+```js
+async function refresh() {
+  await updateAccountData();
+  updateDashboard();
+}
+```
+
+Тази функция актуализира данните за акаунта, след което се грижи за актуализирането на HTML на страницата на таблото. Това е, което трябва да извикаме, когато маршрутът на таблото се зареди. Актуализирайте дефиницията на маршрута с:
+
+```js
+const routes = {
+  '/login': { templateId: 'login' },
+  '/dashboard': { templateId: 'dashboard', init: refresh }
+};
+```
+
+Опитайте да презаредите таблото с
+[Тест след лекцията](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/48)
+
+## Задача
+
+[Реализирайте диалогов прозорец "Добавяне на транзакция"](assignment.md)
+
+Ето примерен резултат след изпълнение на задачата:
+
+![Снимка на екрана, показваща примерен диалогов прозорец "Добавяне на транзакция"](../../../../translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.bg.png)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/4-state-management/assignment.md b/translations/bg/7-bank-project/4-state-management/assignment.md
new file mode 100644
index 00000000..549caee8
--- /dev/null
+++ b/translations/bg/7-bank-project/4-state-management/assignment.md
@@ -0,0 +1,38 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "f23a868536c07da991b1d4e773161e25",
+  "translation_date": "2025-08-28T07:38:54+00:00",
+  "source_file": "7-bank-project/4-state-management/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Реализиране на диалог "Добавяне на транзакция"
+
+## Инструкции
+
+Нашето банково приложение все още липсва една важна функция: възможността за въвеждане на нови транзакции. Използвайки всичко, което научихте в предишните четири урока, реализирайте диалог "Добавяне на транзакция":
+
+- Добавете бутон "Добавяне на транзакция" на страницата на таблото.
+- Или създайте нова страница с HTML шаблон, или използвайте JavaScript, за да покажете/скриете HTML на диалога, без да напускате страницата на таблото (можете да използвате свойството [`hidden`](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/hidden) за това, или CSS класове).
+- Уверете се, че обработвате [достъпността за клавиатура и екранни четци](https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/) за диалога.
+- Реализирайте HTML форма за получаване на входни данни.
+- Създайте JSON данни от данните на формата и ги изпратете към API.
+- Актуализирайте страницата на таблото с новите данни.
+
+Прегледайте [спецификациите на сървърния API](../api/README.md), за да видите кой API трябва да извикате и какъв е очакваният JSON формат.
+
+Ето примерен резултат след завършване на задачата:
+
+![Снимка на екран, показваща примерен диалог "Добавяне на транзакция"](../../../../translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.bg.png)
+
+## Критерии за оценка
+
+| Критерий | Отлично                                                                                          | Задоволително                                                                                                         | Нуждае се от подобрение                      |
+| -------- | ------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------- | --------------------------------------------|
+|          | Добавянето на транзакция е реализирано напълно, следвайки всички най-добри практики от уроците.   | Добавянето на транзакция е реализирано, но не следва най-добрите практики от уроците или работи само частично.        | Добавянето на транзакция изобщо не работи.  |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/README.md b/translations/bg/7-bank-project/README.md
new file mode 100644
index 00000000..076d5eb6
--- /dev/null
+++ b/translations/bg/7-bank-project/README.md
@@ -0,0 +1,35 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "830359535306594b448db6575ce5cdee",
+  "translation_date": "2025-08-28T07:30:43+00:00",
+  "source_file": "7-bank-project/README.md",
+  "language_code": "bg"
+}
+-->
+# :dollar: Създайте Банка
+
+В този проект ще научите как да създадете измислена банка. Тези уроци включват инструкции за това как да изградите уеб приложение, да създадете маршрути, да изградите форми, да управлявате състоянието и да извличате данни от API, от който можете да получите данните на банката.
+
+| ![Екран1](../../../translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.bg.png) | ![Екран2](../../../translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.bg.png) |
+|--------------------------------|--------------------------------|
+
+## Уроци
+
+1. [HTML шаблони и маршрути в уеб приложение](1-template-route/README.md)
+2. [Създаване на форма за вход и регистрация](2-forms/README.md)
+3. [Методи за извличане и използване на данни](3-data/README.md)
+4. [Концепции за управление на състоянието](4-state-management/README.md)
+
+### Кредити
+
+Тези уроци са написани с :hearts: от [Йоан Ласорса](https://twitter.com/sinedied).
+
+Ако се интересувате как да изградите [сървърния API](/7-bank-project/api/README.md), използван в тези уроци, можете да следвате [тази серия от видеа](https://aka.ms/NodeBeginner) (по-специално видеа от 17 до 21).
+
+Можете също така да разгледате [този интерактивен урок в Learn](https://aka.ms/learn/express-api).
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/api/README.md b/translations/bg/7-bank-project/api/README.md
new file mode 100644
index 00000000..67b13663
--- /dev/null
+++ b/translations/bg/7-bank-project/api/README.md
@@ -0,0 +1,48 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9884f8c8a61cf56214450f8b16a094ce",
+  "translation_date": "2025-08-28T07:33:31+00:00",
+  "source_file": "7-bank-project/api/README.md",
+  "language_code": "bg"
+}
+-->
+# Bank API
+
+> Bank API, създаден с [Node.js](https://nodejs.org) + [Express](https://expressjs.com/).
+
+API-то вече е създадено и не е част от упражнението.
+
+Ако обаче искате да научите как да създадете API като този, можете да следвате тази серия видеа: https://aka.ms/NodeBeginner (видеа от 17 до 21 обхващат точно този API).
+
+Можете също така да разгледате този интерактивен урок: https://aka.ms/learn/express-api
+
+## Стартиране на сървъра
+
+Уверете се, че имате инсталиран [Node.js](https://nodejs.org).
+
+1. Клонирайте този репозиторий [The Web-Dev-For-Beginners](https://github.com/microsoft/Web-Dev-For-Beginners).
+2. Отворете терминала си и навигирайте до папката `Web-Dev-For-Beginners/7-bank-project/api`.
+2. Изпълнете `npm install` и изчакайте пакетите да се инсталират (може да отнеме време в зависимост от качеството на интернет връзката ви).
+3. Когато инсталацията приключи, изпълнете `npm start` и сте готови.
+
+Сървърът трябва да започне да слуша на порт `5000`.
+*Този сървър ще работи заедно с основния сървър на приложението за банката (слушащ на порт `3000`), не го затваряйте.*
+
+> Забележка: всички записи се съхраняват в паметта и не се запазват, така че когато сървърът бъде спрян, всички данни се губят.
+
+## Детайли за API
+
+Път                                          | Описание
+---------------------------------------------|------------------------------------
+GET    /api/                                 | Получаване на информация за сървъра
+POST   /api/accounts/                        | Създаване на акаунт, например: `{ user: 'Yohan', description: 'My budget', currency: 'EUR', balance: 100 }`
+GET    /api/accounts/:user                   | Получаване на всички данни за конкретен акаунт
+DELETE /api/accounts/:user                   | Премахване на конкретен акаунт
+POST   /api/accounts/:user/transactions      | Добавяне на транзакция, например: `{ date: '2020-07-23T18:25:43.511Z', object: 'Bought a book', amount: -20 }`
+DELETE  /api/accounts/:user/transactions/:id | Премахване на конкретна транзакция
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/7-bank-project/solution/README.md b/translations/bg/7-bank-project/solution/README.md
new file mode 100644
index 00000000..beb3b1e6
--- /dev/null
+++ b/translations/bg/7-bank-project/solution/README.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "461aa4fc74c6b1789c3a13b5d82c0cd9",
+  "translation_date": "2025-08-28T07:33:49+00:00",
+  "source_file": "7-bank-project/solution/README.md",
+  "language_code": "bg"
+}
+-->
+# Банкова апликация
+
+> Примерно решение за проекта на банковата апликация, създадено с чист HTML5, CSS и JavaScript (без използване на рамки или библиотеки).
+
+## Стартиране на апликацията
+
+Първо се уверете, че [API сървърът](../api/README.md) работи.
+
+Може да използвате всеки уеб сървър за стартиране на апликацията, но тъй като трябва да имате инсталиран [Node.js](https://nodejs.org), за да стартирате API, можете:
+
+1. Клонирайте този репозиторий с Git.
+2. Отворете терминал, навигирайте до тази директория и изпълнете `npx lite-server .`. Това ще стартира уеб сървър за разработка на порт `3000`.
+3. Отворете `http://localhost:3000` в браузър, за да стартирате апликацията.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/8-code-editor/1-using-a-code-editor/README.md b/translations/bg/8-code-editor/1-using-a-code-editor/README.md
new file mode 100644
index 00000000..417b6a02
--- /dev/null
+++ b/translations/bg/8-code-editor/1-using-a-code-editor/README.md
@@ -0,0 +1,158 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "7aa6e4f270d38d9cb17f2b5bd86b863d",
+  "translation_date": "2025-08-28T08:18:59+00:00",
+  "source_file": "8-code-editor/1-using-a-code-editor/README.md",
+  "language_code": "bg"
+}
+-->
+# Използване на редактор за код
+
+Този урок обхваща основите на използването на [VSCode.dev](https://vscode.dev), уеб-базиран редактор за код, за да можете да правите промени в кода си и да допринасяте към проект, без да инсталирате нищо на компютъра си.
+
+## Цели на обучението
+
+В този урок ще научите как да:
+
+- Използвате редактор за код в проект с код
+- Следите промените с контрол на версиите
+- Персонализирате редактора за разработка
+
+### Предпоставки
+
+Преди да започнете, ще трябва да създадете акаунт в [GitHub](https://github.com). Отидете на [GitHub](https://github.com/) и създайте акаунт, ако все още нямате такъв.
+
+### Въведение
+
+Редакторът за код е основен инструмент за писане на програми и сътрудничество по съществуващи проекти с код. След като разберете основите на редактора и как да използвате неговите функции, ще можете да ги прилагате при писане на код.
+
+## Започване с VSCode.dev
+
+[VSCode.dev](https://vscode.dev) е редактор за код в уеб. Не е необходимо да инсталирате нищо, за да го използвате – просто го отворете като всеки друг уебсайт. За да започнете с редактора, отворете следния линк: [https://vscode.dev](https://vscode.dev). Ако не сте влезли в [GitHub](https://github.com/), следвайте указанията, за да влезете или да създадете нов акаунт и след това да влезете.
+
+След като се зареди, трябва да изглежда подобно на този образ:
+
+![Default VSCode.dev](../../../../translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.bg.png)
+
+Има три основни секции, започвайки от най-ляво и преминавайки надясно:
+
+1. _Лентата за активност_, която включва някои икони, като лупа 🔎, зъбно колело ⚙️ и няколко други.
+2. Разширената лента за активност, която по подразбиране е _Explorer_, наречена _странична лента_.
+3. И накрая, зоната за код вдясно.
+
+Кликнете върху всяка от иконите, за да покажете различно меню. След като приключите, кликнете върху _Explorer_, за да се върнете там, откъдето сте започнали.
+
+Когато започнете да създавате код или да модифицирате съществуващ код, това ще се случи в най-голямата зона вдясно. Ще използвате тази зона и за визуализиране на съществуващ код, което ще направите следващо.
+
+## Отваряне на GitHub хранилище
+
+Първото нещо, което ще трябва да направите, е да отворите GitHub хранилище. Има няколко начина за отваряне на хранилище. В този раздел ще видите два различни начина, по които можете да отворите хранилище, за да започнете работа по промените.
+
+### 1. С редактора
+
+Използвайте самия редактор, за да отворите отдалечено хранилище. Ако отидете на [VSCode.dev](https://vscode.dev), ще видите бутон _"Open Remote Repository"_:
+
+![Open remote repository](../../../../translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.bg.png)
+
+Можете също да използвате палитрата с команди. Палитрата с команди е поле за въвеждане, където можете да напишете всяка дума, която е част от команда или действие, за да намерите правилната команда за изпълнение. Използвайте менюто в горния ляв ъгъл, след това изберете _View_, и след това изберете _Command Palette_, или използвайте следния клавишен пряк път: Ctrl-Shift-P (на MacOS това би било Command-Shift-P).
+
+![Palette Menu](../../../../translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.bg.png)
+
+След като менюто се отвори, напишете _open remote repository_, и след това изберете първата опция. Ще се покажат множество хранилища, на които сте част или които сте отваряли наскоро. Можете също да използвате пълен GitHub URL, за да изберете едно. Използвайте следния URL и го поставете в полето:
+
+```
+https://github.com/microsoft/Web-Dev-For-Beginners
+```
+
+✅ Ако е успешно, ще видите всички файлове за това хранилище, заредени в текстовия редактор.
+
+### 2. Използване на URL
+
+Можете също да използвате URL директно, за да заредите хранилище. Например, пълният URL за текущото хранилище е [https://github.com/microsoft/Web-Dev-For-Beginners](https://github.com/microsoft/Web-Dev-For-Beginners), но можете да замените домейна на GitHub с `VSCode.dev/github` и да заредите хранилището директно. Полученият URL би бил [https://vscode.dev/github/microsoft/Web-Dev-For-Beginners](https://vscode.dev/github/microsoft/Web-Dev-For-Beginners).
+
+## Редактиране на файлове
+
+След като сте отворили хранилището в браузъра/vscode.dev, следващата стъпка е да направите актуализации или промени в проекта.
+
+### 1. Създаване на нов файл
+
+Можете да създадете файл вътре в съществуваща папка или да го създадете в основната директория/папка. За да създадете нов файл, отворете местоположение/директория, в която искате файлът да бъде запазен, и изберете иконата _'New file ...'_ на лентата за активност _(вляво)_, дайте му име и натиснете Enter.
+
+![Create a new file](../../../../translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.bg.png)
+
+### 2. Редактиране и запазване на файл в хранилището
+
+Използването на vscode.dev е полезно, когато искате да направите бързи актуализации на проекта си, без да зареждате никакъв софтуер локално.  
+За да актуализирате кода си, кликнете върху иконата 'Explorer', също разположена на лентата за активност, за да видите файловете и папките в хранилището.  
+Изберете файл, за да го отворите в зоната за код, направете промените си и запазете.
+
+![Edit a file](../../../../translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.bg.png)
+
+След като приключите с актуализирането на проекта си, изберете иконата _`source control`_, която съдържа всички нови промени, които сте направили в хранилището си.
+
+За да видите промените, които сте направили в проекта си, изберете файла(ите) в папката `Changes` в разширената лента за активност. Това ще отвори 'Работно дърво', за да визуализирате промените, които сте направили във файла. Червеното показва премахване от проекта, докато зеленото означава добавяне.
+
+![View changes](../../../../translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.bg.png)
+
+Ако сте доволни от промените, които сте направили, задръжте курсора върху папката `Changes` и кликнете върху бутона `+`, за да подготвите промените. Подготовката означава просто да подготвите промените си за комитване към GitHub.
+
+Ако обаче не сте доволни от някои промени и искате да ги отмените, задръжте курсора върху папката `Changes` и изберете иконата `undo`.
+
+След това напишете `commit message` _(Описание на промяната, която сте направили в проекта)_, кликнете върху иконата `check`, за да комитнете и изпратите промените си.
+
+След като приключите с работата по проекта си, изберете иконата `hamburger menu` в горния ляв ъгъл, за да се върнете към хранилището на github.com.
+
+![Stage & commit changes](../../../../8-code-editor/images/edit-vscode.dev.gif)
+
+## Използване на разширения
+
+Инсталирането на разширения в VSCode ви позволява да добавяте нови функции и опции за персонализирана среда за разработка в редактора си, за да подобрите работния си процес. Тези разширения също ви помагат да добавите поддръжка за множество програмни езици и често са или общи разширения, или базирани на език.
+
+За да разгледате списъка с всички налични разширения, кликнете върху иконата _`Extensions`_ на лентата за активност и започнете да пишете името на разширението в текстовото поле, обозначено _'Search Extensions in Marketplace'_.  
+Ще видите списък с разширения, всяко от които съдържа **името на разширението, името на издателя, едно изречение описание, броя на изтеглянията** и **оценка със звезди**.
+
+![Extension details](../../../../translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.bg.png)
+
+Можете също да видите всички предварително инсталирани разширения, като разширите папката _`Installed`_, популярни разширения, използвани от повечето разработчици, в папката _`Popular`_ и препоръчани разширения за вас, или от потребители в същото работно пространство, или въз основа на наскоро отворените ви файлове, в папката _`Recommended`_.
+
+![View extensions](../../../../translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.bg.png)
+
+### 1. Инсталиране на разширения
+
+За да инсталирате разширение, напишете името на разширението в полето за търсене и кликнете върху него, за да видите допълнителна информация за разширението в зоната за код, след като се появи в разширената лента за активност.
+
+Можете или да кликнете върху _синия бутон за инсталиране_ в разширената лента за активност, за да го инсталирате, или да използвате бутона за инсталиране, който се появява в зоната за код, след като изберете разширението, за да заредите допълнителна информация.
+
+![Install extensions](../../../../8-code-editor/images/install-extension.gif)
+
+### 2. Персонализиране на разширения
+
+След като инсталирате разширението, може да се наложи да модифицирате неговото поведение и да го персонализирате според вашите предпочитания. За да направите това, изберете иконата Extensions, и този път вашето разширение ще се появи в папката _Installed_, кликнете върху _**Gear icon**_ и навигирайте до _Extensions Setting_.
+
+![Modify extension settings](../../../../translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.bg.png)
+
+### 3. Управление на разширения
+
+След като инсталирате и използвате разширението си, vscode.dev предлага опции за управление на разширението според различни нужди. Например, можете да изберете да:
+
+- **Деактивирате:** _(Можете временно да деактивирате разширение, когато вече не ви е необходимо, но не искате да го деинсталирате напълно)_
+
+    Изберете инсталираното разширение в разширената лента за активност > кликнете върху иконата Gear > изберете 'Disable' или 'Disable (Workspace)' **ИЛИ** Отворете разширението в зоната за код и кликнете върху синия бутон Disable.
+
+- **Деинсталирате:** Изберете инсталираното разширение в разширената лента за активност > кликнете върху иконата Gear > изберете 'Uninstall' **ИЛИ** Отворете разширението в зоната за код и кликнете върху синия бутон Uninstall.
+
+---
+
+## Задача
+
+[Създайте уебсайт за автобиография, използвайки vscode.dev](https://github.com/microsoft/Web-Dev-For-Beginners/blob/main/8-code-editor/1-using-a-code-editor/assignment.md)
+
+## Преглед и самостоятелно обучение
+
+Прочетете повече за [VSCode.dev](https://code.visualstudio.com/docs/editor/vscode-web?WT.mc_id=academic-0000-alfredodeza) и някои от неговите други функции.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/8-code-editor/1-using-a-code-editor/assignment.md b/translations/bg/8-code-editor/1-using-a-code-editor/assignment.md
new file mode 100644
index 00000000..b928d24e
--- /dev/null
+++ b/translations/bg/8-code-editor/1-using-a-code-editor/assignment.md
@@ -0,0 +1,247 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "2fcb983b8dbadadb1bc2e97f8c12dac5",
+  "translation_date": "2025-08-28T08:20:10+00:00",
+  "source_file": "8-code-editor/1-using-a-code-editor/assignment.md",
+  "language_code": "bg"
+}
+-->
+# Създайте уебсайт за автобиография с помощта на vscode.dev
+
+_Колко готино би било, ако рекрутер поиска вашата автобиография и вие му изпратите линк?_ 😎
+
+## Цели
+
+След това задание ще научите как да:
+
+- Създадете уебсайт, който да представя вашата автобиография
+
+### Предварителни изисквания
+
+1. Акаунт в GitHub. Посетете [GitHub](https://github.com/) и създайте акаунт, ако все още нямате такъв.
+
+## Стъпки
+
+**Стъпка 1:** Създайте ново GitHub хранилище и му дайте име `my-resume`.
+
+**Стъпка 2:** Създайте файл `index.html` във вашето хранилище. Ще добавим поне един файл директно в github.com, защото не можете да отворите празно хранилище във vscode.dev.
+
+Кликнете върху линка `creating a new file`, въведете името `index.html` и изберете бутона `Commit new file`.
+
+![Създаване на нов файл в github.com](../../../../translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.bg.png)
+
+**Стъпка 3:** Отворете [VSCode.dev](https://vscode.dev) и изберете бутона `Open Remote Repository`.
+
+Копирайте URL адреса на хранилището, което току-що създадохте за вашия уебсайт с автобиография, и го поставете в полето за въвеждане:
+
+_Заменете `your-username` с вашето потребителско име в GitHub._
+
+```
+https://github.com/your-username/my-resume
+```
+
+✅ Ако всичко е успешно, ще видите вашия проект и файла index.html, отворени в текстовия редактор в браузъра.
+
+![Създаване на нов файл](../../../../translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.bg.png)
+
+**Стъпка 4:** Отворете файла `index.html`, поставете кода по-долу в кода си и запазете.
+
+<details>
+    <summary><b>HTML код, отговорен за съдържанието на вашия уебсайт с автобиография.</b></summary>
+    
+        <html>
+
+            <head>
+                <link href="style.css" rel="stylesheet">
+                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
+                <title>Вашето име тук!</title>
+            </head>
+            <body>
+                <header id="header">
+                    <!-- заглавие на автобиографията с вашето име и длъжност -->
+                    <h1>Вашето име тук!</h1>
+                    <hr>
+                    Вашата роля!
+                    <hr>
+                </header>
+                <main>
+                    <article id="mainLeft">
+                        <section>
+                            <h2>КОНТАКТИ</h2>
+                            <!-- информация за контакт, включително социални мрежи -->
+                            <p>
+                                <i class="fa fa-envelope" aria-hidden="true"></i>
+                                <a href="mailto:username@domain.top-level domain">Напишете вашия имейл тук</a>
+                            </p>
+                            <p>
+                                <i class="fab fa-github" aria-hidden="true"></i>
+                                <a href="github.com/yourGitHubUsername">Напишете вашето потребителско име тук!</a>
+                            </p>
+                            <p>
+                                <i class="fab fa-linkedin" aria-hidden="true"></i>
+                                <a href="linkedin.com/yourLinkedInUsername">Напишете вашето потребителско име тук!</a>
+                            </p>
+                        </section>
+                        <section>
+                            <h2>УМЕНИЯ</h2>
+                            <!-- вашите умения -->
+                            <ul>
+                                <li>Умение 1!</li>
+                                <li>Умение 2!</li>
+                                <li>Умение 3!</li>
+                                <li>Умение 4!</li>
+                            </ul>
+                        </section>
+                        <section>
+                            <h2>ОБРАЗОВАНИЕ</h2>
+                            <!-- вашето образование -->
+                            <h3>Напишете вашата специалност тук!</h3>
+                            <p>
+                                Напишете вашето учебно заведение тук!
+                            </p>
+                            <p>
+                                Начална - Крайна дата
+                            </p>
+                        </section>            
+                    </article>
+                    <article id="mainRight">
+                        <section>
+                            <h2>ЗА МЕН</h2>
+                            <!-- информация за вас -->
+                            <p>Напишете кратко описание за себе си!</p>
+                        </section>
+                        <section>
+                            <h2>ПРОФЕСИОНАЛЕН ОПИТ</h2>
+                            <!-- вашият професионален опит -->
+                            <h3>Длъжност</h3>
+                            <p>
+                                Име на организацията | Начален месец – Краен месец
+                            </p>
+                            <ul>
+                                    <li>Задача 1 - Опишете какво сте правили!</li>
+                                    <li>Задача 2 - Опишете какво сте правили!</li>
+                                    <li>Опишете резултатите/влиянието от вашия принос</li>
+                                    
+                            </ul>
+                            <h3>Длъжност 2</h3>
+                            <p>
+                                Име на организацията | Начален месец – Краен месец
+                            </p>
+                            <ul>
+                                    <li>Задача 1 - Опишете какво сте правили!</li>
+                                    <li>Задача 2 - Опишете какво сте правили!</li>
+                                    <li>Опишете резултатите/влиянието от вашия принос</li>
+                                    
+                            </ul>
+                        </section>
+                    </article>
+                </main>
+            </body>
+        </html>
+</details>
+
+Добавете детайлите на вашата автобиография, като замените _текста за попълване_ в HTML кода.
+
+**Стъпка 5:** Задръжте курсора върху папката My-Resume, кликнете върху иконата `New File ...` и създайте 2 нови файла във вашия проект: `style.css` и `codeswing.json`.
+
+**Стъпка 6:** Отворете файла `style.css`, поставете кода по-долу и запазете.
+
+<details>
+        <summary><b>CSS код за форматиране на оформлението на сайта.</b></summary>
+            
+            body {
+                font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+                font-size: 16px;
+                max-width: 960px;
+                margin: auto;
+            }
+            h1 {
+                font-size: 3em;
+                letter-spacing: .6em;
+                padding-top: 1em;
+                padding-bottom: 1em;
+            }
+
+            h2 {
+                font-size: 1.5em;
+                padding-bottom: 1em;
+            }
+
+            h3 {
+                font-size: 1em;
+                padding-bottom: 1ем;
+            }
+            main { 
+                display: grid;
+                grid-template-columns: 40% 60%;
+                margin-top: 3em;
+            }
+            header {
+                text-align: center;
+                margin: auto 2em;
+            }
+
+            section {
+                margin: auto 1em 4em 2em;
+            }
+
+            i {
+                margin-right: .5em;
+            }
+
+            p {
+                margin: .2em auto
+            }
+
+            hr {
+                border: none;
+                background-color: lightgray;
+                height: 1px;
+            }
+
+            h1, h2, h3 {
+                font-weight: 100;
+                margin-bottom: 0;
+            }
+            #mainLeft {
+                border-right: 1px solid lightgray;
+            }
+            
+</details>
+
+**Стъпка 6:** Отворете файла `codeswing.json`, поставете кода по-долу и запазете.
+
+    {
+    "scripts": [],
+    "styles": []
+    }
+
+**Стъпка 7:** Инсталирайте разширението `Codeswing`, за да визуализирате уебсайта с автобиография в кода.
+
+Кликнете върху иконата _`Extensions`_ в лентата с инструменти и въведете Codeswing. Или кликнете върху _синия бутон за инсталиране_ в разширената лента с инструменти, за да инсталирате, или използвайте бутона за инсталиране, който се появява в кода, след като изберете разширението, за да заредите допълнителна информация. Веднага след инсталирането на разширението, наблюдавайте промените във вашия проект 😃.
+
+![Инсталиране на разширения](../../../../8-code-editor/images/install-extension.gif)
+
+Това е, което ще видите на екрана си след инсталирането на разширението.
+
+![Codeswing разширение в действие](../../../../translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.bg.png)
+
+Ако сте доволни от направените промени, задръжте курсора върху папката `Changes` и кликнете върху бутона `+`, за да добавите промените.
+
+Въведете съобщение за комит _(Описание на промените, които сте направили в проекта)_ и комитнете промените, като кликнете върху `check`. След като приключите с работата по проекта, изберете иконата на менюто в горния ляв ъгъл, за да се върнете към хранилището в GitHub.
+
+Поздравления 🎉 Току-що създадохте вашия уебсайт за автобиография с помощта на vscode.dev само за няколко стъпки.
+
+## 🚀 Предизвикателство
+
+Отворете отдалечено хранилище, за което имате разрешение да правите промени, и актуализирайте някои файлове. След това опитайте да създадете нов клон с вашите промени и направете Pull Request.
+
+## Преглед и самостоятелно обучение
+
+Прочетете повече за [VSCode.dev](https://code.visualstudio.com/docs/editor/vscode-web?WT.mc_id=academic-0000-alfredodeza) и някои от другите му функции.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/CODE_OF_CONDUCT.md b/translations/bg/CODE_OF_CONDUCT.md
new file mode 100644
index 00000000..f428ae7a
--- /dev/null
+++ b/translations/bg/CODE_OF_CONDUCT.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b0a9b4cccd918195f58224d5793da1a6",
+  "translation_date": "2025-08-28T07:30:25+00:00",
+  "source_file": "CODE_OF_CONDUCT.md",
+  "language_code": "bg"
+}
+-->
+# Кодекс за поведение на Microsoft за отворен код
+
+Този проект е приел [Кодекса за поведение на Microsoft за отворен код](https://opensource.microsoft.com/codeofconduct/?WT.mc_id=academic-77807-sagibbon).
+
+Ресурси:
+
+- [Кодекс за поведение на Microsoft за отворен код](https://opensource.microsoft.com/codeofconduct/?WT.mc_id=academic-77807-sagibbon)
+- [Често задавани въпроси за Кодекса за поведение на Microsoft](https://opensource.microsoft.com/codeofconduct/faq/?WT.mc_id=academic-77807-sagibbon)
+- Свържете се с [opencode@microsoft.com](mailto:opencode@microsoft.com) за въпроси или притеснения
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/CONTRIBUTING.md b/translations/bg/CONTRIBUTING.md
new file mode 100644
index 00000000..ef55809b
--- /dev/null
+++ b/translations/bg/CONTRIBUTING.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "777400e9f0336c7ee2f9a1200a88478f",
+  "translation_date": "2025-08-28T07:29:07+00:00",
+  "source_file": "CONTRIBUTING.md",
+  "language_code": "bg"
+}
+-->
+# Принос
+
+Този проект приветства приноси и предложения. Повечето приноси изискват от вас да се съгласите с Лицензионно споразумение за приносител (CLA), което декларира, че имате правото и наистина предоставяте ни правата да използваме вашия принос. За повече подробности посетете [https://cla.microsoft.com](https://cla.microsoft.com/?WT.mc_id=academic-77807-sagibbon).
+
+Когато изпратите pull заявка, CLA-бот автоматично ще определи дали трябва да предоставите CLA и ще отбележи PR съответно (например, с етикет, коментар). Просто следвайте инструкциите, предоставени от бота. Ще трябва да направите това само веднъж за всички хранилища, които използват нашия CLA. Моля, също така се опитайте да ни обясните защо сте направили тази промяна, за да разберем по-добре вашата заявка.
+
+Този проект е приел [Кодекса за поведение на Microsoft за отворен код](https://opensource.microsoft.com/codeofconduct/?WT.mc_id=academic-77807-sagibbon).  
+За повече информация вижте [Често задавани въпроси за Кодекса за поведение](https://opensource.microsoft.com/codeofconduct/faq/?WT.mc_id=academic-77807-sagibbon)  
+или се свържете с [opencode@microsoft.com](mailto:opencode@microsoft.com) за допълнителни въпроси или коментари.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/README.md b/translations/bg/README.md
new file mode 100644
index 00000000..8bd628f7
--- /dev/null
+++ b/translations/bg/README.md
@@ -0,0 +1,209 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "efa251c5fc089367f0a81c572874afca",
+  "translation_date": "2025-08-28T07:26:56+00:00",
+  "source_file": "README.md",
+  "language_code": "bg"
+}
+-->
+[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE)  
+[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)  
+[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)  
+[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)  
+[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)  
+
+[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)  
+[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)  
+[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)  
+
+[![](https://dcbadge.vercel.app/api/server/ByRwuEEgH4)](https://discord.gg/zxKYvhSnVp?WT.mc_id=academic-000002-leestott)  
+
+[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)  
+
+[![Microsoft Azure AI Foundry Discord](https://dcbadge.limes.pink/api/server/ByRwuEEgH4)](https://discord.com/invite/ByRwuEEgH4)  
+
+Следвайте тези стъпки, за да започнете да използвате тези ресурси:  
+1. **Направете Fork на хранилището**: Кликнете [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)  
+2. **Клонирайте хранилището**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`  
+3. [**Присъединете се към Azure AI Foundry Discord и се срещнете с експерти и други разработчици**](https://discord.com/invite/ByRwuEEgH4)  
+
+# Уеб разработка за начинаещи - учебна програма  
+
+Научете основите на уеб разработката с нашия 12-седмичен курс, създаден от Microsoft Cloud Advocates. Всяка от 24-те лекции разглежда JavaScript, CSS и HTML чрез практически проекти като терариуми, разширения за браузъри и космически игри. Участвайте в тестове, дискусии и практически задачи. Подобрете уменията си и оптимизирайте запазването на знания с нашата ефективна проектно-базирана методология. Започнете своето кодиращо пътешествие още днес!  
+
+#### 🧑‍🎓 _Студент ли сте?_  
+
+Посетете [**страницата Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), където ще намерите ресурси за начинаещи, студентски пакети и дори начини да получите безплатен ваучер за сертификат. Това е страницата, която трябва да запазите и проверявате периодично, тъй като съдържанието се обновява ежемесечно.  
+
+### 📣 Съобщение - _Нова учебна програма_ за Генеративен AI за JavaScript току-що беше пусната  
+
+Не пропускайте нашата нова учебна програма за Генеративен AI!  
+
+Посетете [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), за да започнете!  
+
+![Фон](../../translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.bg.png)  
+
+- Уроци, обхващащи всичко от основите до RAG.  
+- Взаимодействие с исторически личности чрез GenAI и нашето придружаващо приложение.  
+- Забавен и ангажиращ разказ, ще пътувате във времето!  
+
+![персонаж](../../translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.bg.png)  
+
+Всеки урок включва задача за изпълнение, проверка на знанията и предизвикателство, които ще ви насочат към изучаване на теми като:  
+- Създаване на заявки и инженеринг на заявки  
+- Генериране на текстови и визуални приложения  
+- Приложения за търсене  
+
+Посетете [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), за да започнете!  
+
+## 🌱 Започнете  
+
+> **Учители**, ние [включихме някои предложения](for-teachers.md) за това как да използвате тази учебна програма. Ще се радваме на вашата обратна връзка [в нашия форум за дискусии](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!  
+
+**[Ученици](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, за всеки урок започнете с предварителен тест и продължете с четене на учебния материал, изпълнение на различните дейности и проверете разбирането си с тест след лекцията.  
+
+За да подобрите учебния си опит, свържете се с вашите връстници, за да работите заедно по проектите! Дискусиите са насърчени в нашия [форум за дискусии](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), където нашият екип от модератори ще бъде на разположение да отговори на вашите въпроси.  
+
+За да продължите образованието си, силно препоръчваме да разгледате [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) за допълнителни учебни материали.  
+
+### 📋 Настройка на вашата среда  
+
+Тази учебна програма има готова за използване среда за разработка! Когато започнете, можете да изберете да изпълните учебната програма в [Codespace](https://github.com/features/codespaces/) (_среда, базирана на браузър, без нужда от инсталации_), или локално на вашия компютър, използвайки текстов редактор като [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).  
+
+#### Създайте вашето хранилище  
+За да запазите лесно работата си, препоръчваме да създадете свое собствено копие на това хранилище. Можете да направите това, като кликнете върху бутона **Use this template** в горната част на страницата. Това ще създаде ново хранилище във вашия GitHub акаунт с копие на учебната програма.  
+
+Следвайте тези стъпки:  
+1. **Направете Fork на хранилището**: Кликнете върху бутона "Fork" в горния десен ъгъл на тази страница.  
+2. **Клонирайте хранилището**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`  
+
+#### Изпълнение на учебната програма в Codespace  
+
+В копието на хранилището, което създадохте, кликнете върху бутона **Code** и изберете **Open with Codespaces**. Това ще създаде нов Codespace, в който да работите.  
+
+[!Codespace](../..)./images/createcodespace.png)  
+
+#### Изпълнение на учебната програма локално на вашия компютър  
+
+За да изпълните тази учебна програма локално на вашия компютър, ще ви е необходим текстов редактор, браузър и инструмент за команден ред. Нашият първи урок, [Въведение в програмните езици и инструменти](../../1-getting-started-lessons/1-intro-to-programming-languages), ще ви преведе през различни опции за всеки от тези инструменти, за да изберете това, което работи най-добре за вас.  
+
+Нашата препоръка е да използвате [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) като ваш редактор, който също има вграден [Терминал](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Можете да изтеглите Visual Studio Code [тук](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).  
+
+1. Клонирайте вашето хранилище на вашия компютър. Можете да направите това, като кликнете върху бутона **Code** и копирате URL адреса:  
+
+    [!CodeSpace](./images/createcodespace.png)  
+
+    След това отворете [Терминал](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) в [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) и изпълнете следната команда, заменяйки `<your-repository-url>` с URL адреса, който току-що копирахте:  
+
+    ```bash 
+    git clone <your-repository-url>
+    ```  
+
+2. Отворете папката във Visual Studio Code. Можете да направите това, като кликнете **File** > **Open Folder** и изберете папката, която току-що клонирахте.  
+
+>  Препоръчани разширения за Visual Studio Code:  
+>  
+> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - за преглед на HTML страници във Visual Studio Code  
+> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - за да ви помогне да пишете код по-бързо  
+
+## 📂 Всеки урок включва:  
+
+- опционална скица  
+- опционално допълнително видео  
+- предварителен тест  
+- писмен урок  
+- за проектно-базирани уроци, ръководства стъпка по стъпка за изграждане на проекта  
+- проверки на знанията  
+- предизвикателство  
+- допълнително четене  
+- задача  
+- [тест след урока](https://ff-quizzes.netlify.app/)  
+
+> **Бележка относно тестовете**: Всички тестове са в папката Quiz-app, общо 48 теста с по три въпроса всеки. Те са достъпни [тук](https://ff-quizzes.netlify.app/) и приложението за тестове може да се изпълнява локално или да се разположи в Azure; следвайте инструкциите в папката `quiz-app`.  
+
+## 🗃️ Уроци  
+
+|     |                       Име на проекта                       |                            Преподавани концепции                             | Цели на обучението                                                                                                                 |                                                         Свързан урок                                                          |         Автор          |  
+| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |  
+| 01  |                     Започваме                      |           Въведение в програмирането и инструментите на професията           | Научете основите на повечето програмни езици и за софтуера, който помага на професионалните разработчици да вършат работата си | [Въведение в програмните езици и инструментите на професията](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) |         Jasmine         |  
+| 02  |                     Започваме                      |             Основи на GitHub, включително работа в екип             | Как да използвате GitHub във вашия проект, как да си сътрудничите с други върху кодова база                                                    |                            [Въведение в GitHub](./1-getting-started-lessons/2-github-basics/README.md)                             |          Floor          |  
+| 03  |                     Започваме                      |                             Достъпност                              | Научете основите на уеб достъпността                                                                                               |                       [Основи на достъпността](./1-getting-started-lessons/3-accessibility/README.md)                       |       Christopher       |  
+| 04  |                        Основи на JS                         |                         Типове данни в JavaScript                          | Основите на типовете данни в JavaScript                                                                                                 |                                       [Типове данни](./2-js-basics/1-data-types/README.md)                                        |         Jasmine         |  
+| 05  |                        Основи на JS                         |                         Функции и методи                          | Научете за функциите и методите за управление на логическия поток на приложението                                                             |                              [Функции и методи](./2-js-basics/2-functions-methods/README.md)                               | Jasmine и Christopher |  
+| 06  |                        Основи на JS                         |                        Вземане на решения с JS                        | Научете как да създавате условия в кода си, използвайки методи за вземане на решения                                                           |                                 [Вземане на решения](./2-js-basics/3-making-decisions/README.md)                                  |         Jasmine         |  
+| 07  |                        Основи на JS                         |                            Масиви и цикли                            | Работа с данни, използвайки масиви и цикли в JavaScript                                                                                 |                                   [Масиви и цикли](./2-js-basics/4-arrays-loops/README.md)                                    |         Jasmine         |  
+| 08  |       [Терариум](./3-terrarium/solution/README.md)       |                            HTML на практика                            | Създайте HTML за онлайн терариум, фокусирайки се върху изграждането на оформление                                                         |                                 [Въведение в HTML](./3-terrarium/1-intro-to-html/README.md)                                 |           Jen           |  
+| 09  |       [Терариум](./3-terrarium/solution/README.md)       |                            CSS на практика                             | Създайте CSS за стилизиране на онлайн терариум, фокусирайки се върху основите на CSS, включително правене на страницата отзивчива                     |                                  [Въведение в CSS](./3-terrarium/2-intro-to-css/README.md)                                  |           Jen           |  
+| 10  |            [Терариум](./3-terrarium/solution/README.md)            |                 JavaScript затваряния, манипулация на DOM                  | Създайте JavaScript, за да направите терариума функционален като интерфейс за влачене/пускане, съсредоточавайки се върху затваряния и манипулация на DOM             |                  [JavaScript затваряния, манипулация на DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md)                   |           Джен           |
+| 11  |          [Игра за писане](./4-typing-game/solution/README.md)          |                          Създаване на игра за писане                           | Научете как да използвате събития от клавиатурата, за да управлявате логиката на вашето JavaScript приложение                                                          |                                [Програмиране, базирано на събития](./4-typing-game/typing-game/README.md)                                |       Кристофър       |
+| 12  | [Еко браузърно разширение](./5-browser-extension/solution/README.md) |                         Работа с браузъри                          | Научете как работят браузърите, тяхната история и как да създадете първите елементи на браузърно разширение                               |                               [За браузърите](./5-browser-extension/1-about-browsers/README.md)                                |           Джен           |
+| 13  | [Еко браузърно разширение](./5-browser-extension/solution/README.md) | Създаване на форма, извикване на API и съхраняване на променливи в локално хранилище | Създайте JavaScript елементите на вашето браузърно разширение, за да извикате API, използвайки променливи, съхранени в локално хранилище                      |                [API, форми и локално хранилище](./5-browser-extension/2-forms-browsers-local-storage/README.md)                 |           Джен           |
+| 14  | [Еко браузърно разширение](./5-browser-extension/solution/README.md) |          Фонови процеси в браузъра, уеб производителност          | Използвайте фоновите процеси на браузъра, за да управлявате иконата на разширението; научете за уеб производителността и някои оптимизации   |             [Фонови задачи и производителност](./5-browser-extension/3-background-tasks-and-performance/README.md)              |           Джен           |
+| 15  |           [Космическа игра](./6-space-game/solution/README.md)           |             По-напреднало разработване на игри с JavaScript             | Научете за наследяване, използвайки както класове, така и композиция, както и модела Pub/Sub, като подготовка за създаване на игра              |                      [Въведение в напреднало разработване на игри](./6-space-game/1-introduction/README.md)                       |          Крис          |
+| 16  |           [Космическа игра](./6-space-game/solution/README.md)           |                           Рисуване върху canvas                            | Научете за Canvas API, използван за рисуване на елементи на екрана                                                                       |                                [Рисуване върху canvas](./6-space-game/2-drawing-to-canvas/README.md)                                |          Крис          |
+| 17  |           [Космическа игра](./6-space-game/solution/README.md)           |                   Придвижване на елементи по екрана                    | Открийте как елементите могат да се движат, използвайки декартови координати и Canvas API                                            |                           [Придвижване на елементи](./6-space-game/3-moving-elements-around/README.md)                           |          Крис          |
+| 18  |           [Космическа игра](./6-space-game/solution/README.md)           |                          Откриване на сблъсъци                           | Направете елементите да се сблъскват и реагират един на друг, използвайки натискания на клавиши, и осигурете функция за охлаждане за производителност на играта    |                              [Откриване на сблъсъци](./6-space-game/4-collision-detection/README.md)                              |          Крис          |
+| 19  |           [Космическа игра](./6-space-game/solution/README.md)           |                             Поддържане на резултат                              | Извършвайте математически изчисления въз основа на състоянието и производителността на играта                                                                |                                    [Поддържане на резултат](./6-space-game/5-keeping-score/README.md)                                    |          Крис          |
+| 20  |           [Космическа игра](./6-space-game/solution/README.md)           |                     Завършване и рестартиране на играта                     | Научете за завършване и рестартиране на играта, включително почистване на ресурси и нулиране на стойности на променливи                              |                                [Условие за край](./6-space-game/6-end-condition/README.md)                                 |          Крис          |
+| 21  |         [Банкова апликация](./7-bank-project/solution/README.md)          |                 HTML шаблони и маршрути в уеб приложение                 | Научете как да създадете структурата на многостраничен уебсайт, използвайки маршрутизация и HTML шаблони                             |                            [HTML шаблони и маршрути](./7-bank-project/1-template-route/README.md)                             |          Йохан          |
+| 22  |         [Банкова апликация](./7-bank-project/solution/README.md)          |                  Създаване на форма за вход и регистрация                   | Научете за създаване на форми и обработка на процедури за валидация                                                                          |                                           [Форми](./7-bank-project/2-forms/README.md)                                           |          Йохан          |
+| 23  |         [Банкова апликация](./7-bank-project/solution/README.md)          |                   Методи за извличане и използване на данни                   | Как данните се движат в и извън вашето приложение, как да ги извличате, съхранявате и изтривате                                                 |                                            [Данни](./7-bank-project/3-data/README.md)                                            |          Йохан          |
+| 24  |         [Банкова апликация](./7-bank-project/solution/README.md)          |                      Концепции за управление на състояние                      | Научете как вашето приложение запазва състояние и как да го управлявате програмно                                                              |                                [Управление на състояние](./7-bank-project/4-state-management/README.md)                                |          Йохан          |
+
+
+## 🏫 Педагогика
+
+Нашата учебна програма е проектирана с две ключови педагогически принципа:
+* обучение, базирано на проекти
+* чести тестове
+
+Програмата учи основите на JavaScript, HTML и CSS, както и най-новите инструменти и техники, използвани от съвременните уеб разработчици. Студентите ще имат възможност да придобият практически опит, като създадат игра за писане, виртуален терариум, екологично браузърно разширение, игра в стил космически нашественици и банкова апликация за бизнеси. До края на серията студентите ще са придобили солидно разбиране за уеб разработката.
+
+> 🎓 Можете да вземете първите няколко урока от тази учебна програма като [Учебен път](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) в Microsoft Learn!
+
+Чрез осигуряване на съдържание, което се съгласува с проекти, процесът става по-ангажиращ за студентите, а задържането на концепции се увеличава. Също така написахме няколко начални урока по основи на JavaScript за въвеждане на концепции, съчетани с видео от "[Серия за начинаещи: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" колекция от видео уроци, някои от чиито автори допринесоха за тази учебна програма.
+
+Освен това, тест с нисък риск преди час задава намерението на студента към изучаване на тема, докато втори тест след час осигурява по-нататъшно задържане. Тази учебна програма е проектирана да бъде гъвкава и забавна и може да бъде взета изцяло или частично. Проектите започват малки и стават все по-сложни до края на 12-седмичния цикъл.
+
+Докато умишлено избягвахме въвеждането на JavaScript рамки, за да се концентрираме върху основните умения, необходими на уеб разработчик преди приемането на рамка, добра следваща стъпка след завършване на тази учебна програма би било изучаването на Node.js чрез друга колекция от видеа: "[Серия за начинаещи: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
+
+> Посетете нашите [Правила за поведение](CODE_OF_CONDUCT.md) и [Насоки за принос](CONTRIBUTING.md). Очакваме вашата конструктивна обратна връзка!
+
+
+## 🧭 Офлайн достъп
+
+Можете да стартирате тази документация офлайн, използвайки [Docsify](https://docsify.js.org/#/). Форкнете това хранилище, [инсталирайте Docsify](https://docsify.js.org/#/quickstart) на вашата локална машина и след това в основната папка на това хранилище въведете `docsify serve`. Уебсайтът ще бъде достъпен на порт 3000 на вашия localhost: `localhost:3000`.
+
+## 📘 PDF
+
+PDF с всички уроци може да бъде намерен [тук](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
+
+
+## 🎒 Други курсове
+
+Нашият екип създава и други курсове! Разгледайте:
+
+- [Генеративен AI за начинаещи](https://aka.ms/genai-beginners)
+- [Генеративен AI за начинаещи .NET](https://github.com/microsoft/Generative-AI-for-beginners-dotnet)
+- [Генеративен AI с JavaScript](https://github.com/microsoft/generative-ai-with-javascript)
+- [Генеративен AI с Java](https://github.com/microsoft/Generative-AI-for-beginners-java)
+- [AI за начинаещи](https://aka.ms/ai-beginners)
+- [Наука за данни за начинаещи](https://aka.ms/datascience-beginners)
+- [Машинно обучение за начинаещи](https://aka.ms/ml-beginners)
+- [Киберсигурност за начинаещи](https://github.com/microsoft/Security-101)
+- [Уеб разработка за начинаещи](https://aka.ms/webdev-beginners)
+- [IoT за начинаещи](https://aka.ms/iot-beginners)
+- [XR разработка за начинаещи](https://github.com/microsoft/xr-development-for-beginners)
+- [Майсторство на GitHub Copilot за агентно използване](https://github.com/microsoft/Mastering-GitHub-Copilot-for-Paired-Programming)
+- [Майсторство на GitHub Copilot за C#/.NET разработчици](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers)
+- [Избери своето приключение с Copilot](https://github.com/microsoft/CopilotAdventures)
+
+## Лиценз
+
+Това хранилище е лицензирано под MIT лиценза. Вижте файла [LICENSE](../../LICENSE) за повече информация.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/SECURITY.md b/translations/bg/SECURITY.md
new file mode 100644
index 00000000..b5aa6ef2
--- /dev/null
+++ b/translations/bg/SECURITY.md
@@ -0,0 +1,51 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
+  "translation_date": "2025-08-28T07:29:32+00:00",
+  "source_file": "SECURITY.md",
+  "language_code": "bg"
+}
+-->
+## Сигурност
+
+Microsoft приема сигурността на своите софтуерни продукти и услуги сериозно, включително всички хранилища с изходен код, управлявани чрез нашите GitHub организации, които включват [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin) и [нашите GitHub организации](https://opensource.microsoft.com/?WT.mc_id=academic-77807-sagibbon).
+
+Ако смятате, че сте открили уязвимост в сигурността в някое хранилище, притежавано от Microsoft, която отговаря на [определението на Microsoft за уязвимост в сигурността](https://docs.microsoft.com/previous-versions/tn-archive/cc751383(v=technet.10)/?WT.mc_id=academic-77807-sagibbon), моля, докладвайте я, както е описано по-долу.
+
+## Докладване на проблеми със сигурността
+
+**Моля, не докладвайте уязвимости в сигурността чрез публични GitHub въпроси.**
+
+Вместо това, докладвайте ги на Центъра за отговор на сигурността на Microsoft (MSRC) на [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report/?WT.mc_id=academic-77807-sagibbon).
+
+Ако предпочитате да изпратите доклад без да влизате в системата, изпратете имейл на [secure@microsoft.com](mailto:secure@microsoft.com). Ако е възможно, криптирайте съобщението си с нашия PGP ключ; моля, изтеглете го от [страницата за PGP ключ на Центъра за отговор на сигурността на Microsoft](https://www.microsoft.com/msrc/pgp-key-msrc/?WT.mc_id=academic-77807-sagibbon).
+
+Трябва да получите отговор в рамките на 24 часа. Ако по някаква причина не го получите, моля, последвайте с имейл, за да се уверите, че сме получили първоначалното ви съобщение. Допълнителна информация можете да намерите на [microsoft.com/msrc](https://www.microsoft.com/msrc/?WT.mc_id=academic-77807-sagibbon).
+
+Моля, включете исканата информация, изброена по-долу (доколкото можете да я предоставите), за да ни помогнете да разберем по-добре естеството и обхвата на възможния проблем:
+
+  * Тип на проблема (например препълване на буфер, SQL инжекция, cross-site scripting и др.)
+  * Пълни пътища на изходния файл(ове), свързани с проявата на проблема
+  * Местоположението на засегнатия изходен код (таг/клон/комит или директен URL)
+  * Всяка специална конфигурация, необходима за възпроизвеждане на проблема
+  * Стъпка по стъпка инструкции за възпроизвеждане на проблема
+  * Доказателство за концепция или експлойт код (ако е възможно)
+  * Въздействие на проблема, включително как нападател може да го експлоатира
+
+Тази информация ще ни помогне да обработим вашия доклад по-бързо.
+
+Ако докладвате за програма за награди за грешки, по-пълните доклади могат да допринесат за по-висока награда. Моля, посетете страницата на [Програмата за награди за грешки на Microsoft](https://microsoft.com/msrc/bounty/?WT.mc_id=academic-77807-sagibbon) за повече подробности относно активните ни програми.
+
+## Предпочитани езици
+
+Предпочитаме всички комуникации да бъдат на английски.
+
+## Политика
+
+Microsoft следва принципа на [Координирано разкриване на уязвимости](https://www.microsoft.com/msrc/cvd/?WT.mc_id=academic-77807-sagibbon).
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/SUPPORT.md b/translations/bg/SUPPORT.md
new file mode 100644
index 00000000..397d40ff
--- /dev/null
+++ b/translations/bg/SUPPORT.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "c9d207ff77b4bb46e46dc2b607a8ec1a",
+  "translation_date": "2025-08-28T07:28:39+00:00",
+  "source_file": "SUPPORT.md",
+  "language_code": "bg"
+}
+-->
+# Поддръжка
+
+## Как да съобщите за проблеми и да получите помощ  
+
+Този проект използва GitHub Issues за проследяване на грешки и заявки за нови функции. Моля, потърсете съществуващите проблеми, преди да създадете нови, за да избегнете дублиране. За нови проблеми, подайте вашата грешка или заявка за функция като нов Issue.
+
+За помощ и въпроси относно използването на този проект, моля, вижте [нашите насоки за принос](CONTRIBUTING.md).
+
+## Политика за поддръжка на Microsoft  
+
+Поддръжката за този проект е ограничена до изброените по-горе ресурси.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/_404.md b/translations/bg/_404.md
new file mode 100644
index 00000000..7ce27cfb
--- /dev/null
+++ b/translations/bg/_404.md
@@ -0,0 +1,21 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "ea9f0804bd62f46d9808e953ec7fc459",
+  "translation_date": "2025-08-28T07:28:52+00:00",
+  "source_file": "_404.md",
+  "language_code": "bg"
+}
+-->
+# Работим по въпроса
+
+Работим върху тази страница. Моля, проверете отново по-късно.
+
+Отворете [issue](https://github.com/microsoft/Web-Dev-For-Beginners/issues/new/choose), ако имате някакви въпроси.
+
+**[Обратно към началото](../../../../../../..)**
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/docs/_navbar.md b/translations/bg/docs/_navbar.md
new file mode 100644
index 00000000..de3d6a76
--- /dev/null
+++ b/translations/bg/docs/_navbar.md
@@ -0,0 +1,34 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3bd2f51ecf4ac9b39277cba748943793",
+  "translation_date": "2025-08-28T08:10:29+00:00",
+  "source_file": "docs/_navbar.md",
+  "language_code": "bg"
+}
+-->
+- Преводи
+  - [English (United States)](../../../docs/README)
+  - [বাংলা](../../../docs/README.bn)
+  - [中文(中国)](../../../docs/README.zh-cn)
+  - [中文(台湾)](../../../docs/README.zh-tw)
+  - [Español](../../../docs/README.es)
+  - [Français](../../../docs/README.fr)
+  - [Ελληνικά](../../../docs/README.el)
+  - [हिन्दी](../../../docs/README.hi)
+  - [Bahasa Melayu](../../../docs/README.ms)
+  - [മലയാളം](../../../docs/README.ml)
+  - [தமிழ்](../../../docs/README.ta)
+  - [తెలుగు](../../../docs/README.te)
+  - [Bahasa Indonesia](../../../docs/README.id)
+  - [Italiano](../../../docs/README.it)
+  - [日本語](../../../docs/README.ja)
+  - [Nederlands](../../../docs/README.nl)
+  - [नेपाली](../../../docs/README.np)
+  - [Português](../../../docs/README.pt)
+  - [Русский](../../../docs/README.ru)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/docs/_sidebar.md b/translations/bg/docs/_sidebar.md
new file mode 100644
index 00000000..23983527
--- /dev/null
+++ b/translations/bg/docs/_sidebar.md
@@ -0,0 +1,51 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "655c91b5979de46f1d70d97f0c5f1d14",
+  "translation_date": "2025-08-28T08:10:08+00:00",
+  "source_file": "docs/_sidebar.md",
+  "language_code": "bg"
+}
+-->
+- Въведение
+  - [1](../1-getting-started-lessons/1-intro-to-programming-languages/README.md)
+  - [2](../1-getting-started-lessons/2-github-basics/README.md)
+  - [3](../1-getting-started-lessons/3-accessibility/README.md)
+  
+- Основи на JS
+  - [4](../2-js-basics/1-data-types/README.md)
+  - [5](../2-js-basics/2-functions-methods/README.md)
+  - [6](../2-js-basics/3-making-decisions/README.md)
+  - [7](../2-js-basics/4-arrays-loops/README.md)
+
+- HTML, CSS, JS
+  - [8](../3-terrarium/1-intro-to-html/README.md)
+  - [9](../3-terrarium/2-intro-to-css/README.md)
+  - [10](../3-terrarium/3-intro-to-DOM-and-closures/README.md)
+
+- Игра за писане
+  - [11](../4-typing-game/typing-game/README.md)
+  
+- Разширение за браузър
+  - [12](../5-browser-extension/1-about-browsers/README.md)
+  - [13](../5-browser-extension/2-forms-browsers-local-storage/README.md)
+  - [14](../5-browser-extension/3-background-tasks-and-performance/README.md)
+
+- Космическа игра
+  - [15](../6-space-game/1-introduction/README.md)
+  - [16](../6-space-game/2-drawing-to-canvas/README.md)
+  - [17](../6-space-game/3-moving-elements-around/README.md)
+  - [18](../6-space-game/4-collision-detection/README.md)
+  - [19](../6-space-game/5-keeping-score/README.md)
+  - [20](../6-space-game/6-end-condition/README.md)
+
+- Банков проект
+  - [21](../7-bank-project/1-template-route/README.md)
+  - [22](../7-bank-project/2-forms/README.md)
+  - [23](../7-bank-project/3-data/README.md)
+  - [24](../7-bank-project/4-state-management/README.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/for-teachers.md b/translations/bg/for-teachers.md
new file mode 100644
index 00000000..1fdf163c
--- /dev/null
+++ b/translations/bg/for-teachers.md
@@ -0,0 +1,47 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "75cb51f7ca9ea0b097ef4a1287e9290c",
+  "translation_date": "2025-08-28T07:30:02+00:00",
+  "source_file": "for-teachers.md",
+  "language_code": "bg"
+}
+-->
+## За преподаватели
+
+Искате ли да използвате тази учебна програма във вашата класна стая? Чувствайте се свободни да го направите!
+
+Всъщност, можете да я използвате директно в GitHub, като използвате GitHub Classroom.
+
+За да го направите, клонирайте това хранилище. Ще трябва да създадете отделно хранилище за всяка лекция, така че ще трябва да извлечете всяка папка в отделно хранилище. По този начин [GitHub Classroom](https://classroom.github.com/classrooms) ще може да разпознае всяка лекция поотделно.
+
+Тези [пълни инструкции](https://github.blog/2020-03-18-set-up-your-digital-classroom-with-github-classroom/) ще ви дадат представа как да настроите вашата класна стая.
+
+## Използване в Moodle, Canvas или Blackboard
+
+Тази учебна програма работи добре в тези системи за управление на обучението! Използвайте [файла за качване в Moodle](../../../../../../../teaching-files/webdev-moodle.mbz) за пълното съдържание или опитайте [файла Common Cartridge](../../../../../../../teaching-files/webdev-common-cartridge.imscc), който съдържа част от съдържанието. Moodle Cloud не поддържа пълни експорти на Common Cartridge, затова е за предпочитане да използвате файла за изтегляне на Moodle, който може да бъде качен в Canvas. Моля, уведомете ни как можем да подобрим този процес.
+
+![Moodle](../../translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.bg.png)
+> Учебната програма в класна стая на Moodle
+
+![Canvas](../../translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.bg.png)
+> Учебната програма в Canvas
+
+## Използване на хранилището в текущия му вид
+
+Ако искате да използвате това хранилище в текущия му вид, без да използвате GitHub Classroom, това също е възможно. Ще трябва да информирате вашите ученици коя лекция да разгледат заедно.
+
+В онлайн формат (Zoom, Teams или друг) можете да създадете групи за дискусии за тестовете и да наставлявате учениците, за да ги подготвите за учене. След това поканете учениците да участват в тестовете и да изпратят своите отговори като 'issues' в определено време. Можете да направите същото и със задачите, ако искате учениците да работят съвместно и открито.
+
+Ако предпочитате по-личен формат, помолете учениците си да клонират учебната програма, лекция по лекция, в свои собствени частни хранилища в GitHub и да ви дадат достъп. Така те могат да завършват тестовете и задачите насаме и да ви ги изпращат чрез 'issues' в хранилището на вашата класна стая.
+
+Има много начини да направите това работещо в онлайн класна стая. Моля, уведомете ни кой начин работи най-добре за вас!
+
+## Моля, споделете вашите мисли!
+
+Искаме да направим тази учебна програма полезна за вас и вашите ученици. Свържете се с нас в [Teacher corner](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) и отворете [**ново issue**](https://github.com/microsoft/Web-Dev-For-Beginners/issues/new/choose) за всякакви заявки, грешки и обратна връзка.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/lesson-template/README.md b/translations/bg/lesson-template/README.md
new file mode 100644
index 00000000..88dc7160
--- /dev/null
+++ b/translations/bg/lesson-template/README.md
@@ -0,0 +1,65 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "0494be70ad7fadd13a8c3d549c23e355",
+  "translation_date": "2025-08-28T08:10:46+00:00",
+  "source_file": "lesson-template/README.md",
+  "language_code": "bg"
+}
+-->
+# [Тема на урока]
+
+![Вградете видео тук](../../../lesson-template/video-url)
+
+## [Тест преди лекцията](../../../lesson-template/quiz-url)
+
+[Опишете какво ще научим]
+
+### Въведение
+
+Опишете какво ще бъде разгледано
+
+> Бележки
+
+### Предпоставки
+
+Какви стъпки трябва да са изпълнени преди този урок?
+
+### Подготовка
+
+Подготвителни стъпки за започване на урока
+
+---
+
+[Разгледайте съдържанието на части]
+
+## [Тема 1]
+
+### Задача:
+
+Работете заедно, за да подобрите постепенно вашата кодова база и да изградите проекта със споделен код:
+
+```html
+code blocks
+```
+
+✅ Проверка на знанията - използвайте този момент, за да разширите знанията на учениците с отворени въпроси
+
+## [Тема 2]
+
+## [Тема 3]
+
+🚀 Предизвикателство: Добавете предизвикателство за учениците, върху което да работят съвместно в клас, за да подобрят проекта
+
+По избор: добавете екранна снимка на потребителския интерфейс на завършения урок, ако е подходящо
+
+## [Тест след лекцията](../../../lesson-template/quiz-url)
+
+## Преглед и самостоятелно обучение
+
+**Краен срок за задание [MM/YY]**: [Име на заданието](assignment.md)
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/lesson-template/assignment.md b/translations/bg/lesson-template/assignment.md
new file mode 100644
index 00000000..b03d07b9
--- /dev/null
+++ b/translations/bg/lesson-template/assignment.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b5f62ec256c7e43e771f0d3b4e1a9130",
+  "translation_date": "2025-08-28T08:11:05+00:00",
+  "source_file": "lesson-template/assignment.md",
+  "language_code": "bg"
+}
+-->
+# [Име на заданието]
+
+## Инструкции
+
+## Критерии за оценка
+
+| Критерий | Отлично | Задоволително | Нуждае се от подобрение |
+| -------- | --------- | -------- | ----------------- |
+|          |           |          |                   |
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматичните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/bg/quiz-app/README.md b/translations/bg/quiz-app/README.md
new file mode 100644
index 00000000..c52b5c3a
--- /dev/null
+++ b/translations/bg/quiz-app/README.md
@@ -0,0 +1,191 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "5301875c55bb305e6046bed3a4fd06d2",
+  "translation_date": "2025-08-28T08:17:50+00:00",
+  "source_file": "quiz-app/README.md",
+  "language_code": "bg"
+}
+-->
+# Приложение за тестове
+
+Тези тестове са предварителни и последващи тестове към лекциите от учебната програма за наука за данни на https://aka.ms/webdev-beginners
+
+## Добавяне на преведен набор от тестове
+
+Добавете превод на тестовете, като създадете съответстващи структури на тестовете в папката `assets/translations`. Оригиналните тестове се намират в `assets/translations/en`. Тестовете са разделени на няколко групи. Уверете се, че номерацията съответства на правилния раздел от тестовете. В тази учебна програма има общо 40 теста, като броенето започва от 0.
+
+  
+<details>
+<summary>Ето как изглежда файлът за превод:</summary>
+
+```
+[
+    {
+        "title": "A title",
+        "complete": "A complete button title",
+        "error": "An error message upon selecting the wrong answer",
+        "quizzes": [
+            {
+                "id": 1,
+                "title": "Title",
+                "quiz": [
+                    {
+                        "questionText": "The question asked",
+                        "answerOptions": [
+                            {
+                                "answerText": "Option 1 title",
+                                "isCorrect": true
+                            },
+                            {
+                                "answerText": "Option 2 title",
+                                "isCorrect": false
+                            }
+                        ]
+                    }
+                ]
+            }
+        ]
+    }
+]
+```
+</details>
+
+След като редактирате преводите, редактирайте файла `index.js` в папката за преводи, за да импортирате всички файлове, следвайки конвенциите в `en`.
+
+Редактирайте файла `index.js` в `assets/translations`, за да импортирате новите преведени файлове.
+
+Например, ако вашият JSON файл за превод е `ex.json`, направете 'ex' ключ за локализация, след което го въведете, както е показано по-долу, за да го импортирате:
+
+<details>
+<summary>index.js</summary>
+
+```
+import ex from "./ex.json";
+
+// if 'ex' is localization key then enter it like so in `messages` to expose it 
+
+const messages = {
+  ex: ex[0],
+};
+
+export default messages;
+```
+
+</details>
+
+## Стартиране на приложението за тестове локално
+
+### Предварителни условия
+
+- Акаунт в GitHub
+- [Node.js и Git](https://nodejs.org/)
+
+### Инсталиране и настройка
+
+1. Създайте хранилище от този [шаблон](https://github.com/new?template_name=Web-Dev-For-Beginners&template_owner=microsoft) 
+
+1. Клонирайте новото си хранилище и навигирайте до папката quiz-app
+
+   ```bash
+   git clone https://github.com/your-github-organization/repo-name
+   cd repo-name/quiz-app
+   ```
+
+1. Инсталирайте npm пакетите и зависимостите
+
+   ```bash
+   npm install
+   ```
+
+### Създаване на приложението
+
+1. За да създадете решението, изпълнете:
+
+   ```bash
+   npm run build
+   ```
+
+### Стартиране на приложението
+
+1. За да стартирате решението, изпълнете:
+
+    ```bash
+    npm run dev
+    ```
+
+### [Опционално] Линтинг
+
+1. За да се уверите, че кодът е проверен, изпълнете:
+
+    ```bash
+    npm run lint
+    ```
+
+## Деплой на приложението за тестове в Azure 
+
+### Предварителни условия
+- Абонамент за Azure. Регистрирайте се за безплатен [тук](https://aka.ms/azure-free).
+
+    _Оценка на разходите за деплой на това приложение за тестове: БЕЗПЛАТНО_
+
+[![Deploy to Azure](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/#create/Microsoft.StaticApp)
+
+След като влезете в Azure чрез горния линк, изберете абонамент и ресурсна група, след това:
+
+- Детайли за статичното уеб приложение: Въведете име и изберете хостинг план
+- Вход в GitHub: Задайте източника на деплой като GitHub, след това влезте и попълнете необходимите полета във формуляра:
+    - *Организация* – Изберете вашата организация.
+    - *Хранилище* – Изберете хранилището за учебната програма Web Dev for Beginners. 
+    - *Клон* - Изберете клон (main) 
+- Предварителни настройки за създаване: Azure Static Web Apps използва алгоритъм за откриване на рамката, използвана във вашето приложение. 
+    - *Местоположение на приложението* - ./quiz-app
+    - *Местоположение на API* -
+    - *Местоположение на изхода* - dist
+- Деплой: Кликнете 'Review + Create', след това 'Create'
+
+    След като деплойът е завършен, файл за работен процес ще бъде създаден в директорията *.github* на вашето хранилище. Този файл за работен процес съдържа инструкции за събития, които ще задействат повторен деплой на приложението в Azure, например _**push** на клон **main**_ и др.
+
+    <details>
+    <summary>Примерен файл за работен процес</summary>
+    Ето как може да изглежда файлът за работен процес на GitHub Actions:
+    name: Azure Static Web Apps CI/CD
+
+    ```
+    on:
+    push:
+        branches:
+        - main
+    pull_request:
+        types: [opened, synchronize, reopened, closed]
+        branches:
+        - main
+
+    jobs:
+    build_and_deploy_job:
+        runs-on: ubuntu-latest
+        name: Build and Deploy Job
+        steps:
+        - uses: actions/checkout@v2
+        - name: Build And Deploy
+            id: builddeploy
+            uses: Azure/static-web-apps-deploy@v1
+            with:
+            azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
+            repo_token: ${{ secrets.GITHUB_TOKEN }}
+            action: "upload"
+            app_location: "quiz-app" # App source code path
+            api_location: ""API source code path optional
+            output_location: "dist" #Built app content directory - optional
+    ```
+
+    </details>
+
+- След деплой: След като деплойът е завършен, кликнете върху 'Go to Deployment', след това 'View app in browser'.
+
+След като GitHub Action (работен процес) бъде успешно изпълнен, обновете страницата на живо, за да видите вашето приложение.
+
+---
+
+**Отказ от отговорност**:  
+Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия изходен език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален превод от човек. Ние не носим отговорност за каквито и да е недоразумения или погрешни интерпретации, произтичащи от използването на този превод.
\ No newline at end of file
diff --git a/translations/ro/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/ro/1-getting-started-lessons/1-intro-to-programming-languages/README.md
new file mode 100644
index 00000000..11d21337
--- /dev/null
+++ b/translations/ro/1-getting-started-lessons/1-intro-to-programming-languages/README.md
@@ -0,0 +1,217 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "c63675cfaf1d223b37bb9fecbfe7c252",
+  "translation_date": "2025-08-28T08:24:06+00:00",
+  "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md",
+  "language_code": "ro"
+}
+-->
+# Introducere în Limbaje de Programare și Instrumente Esențiale
+
+Această lecție acoperă elementele de bază ale limbajelor de programare. Subiectele discutate aici se aplică majorității limbajelor de programare moderne. În secțiunea „Instrumente Esențiale”, vei învăța despre software util care te ajută ca dezvoltator.
+
+![Intro Programming](../../../../translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar Pre-Lecție
+[Chestionar pre-lecție](https://forms.office.com/r/dru4TE0U9n?origin=lprLink)
+
+## Introducere
+
+În această lecție, vom acoperi:
+
+- Ce este programarea?
+- Tipuri de limbaje de programare
+- Elemente de bază ale unui program
+- Software și instrumente utile pentru dezvoltatorii profesioniști
+
+> Poți parcurge această lecție pe [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon)!
+
+## Ce este Programarea?
+
+Programarea (cunoscută și sub numele de codare) este procesul de scriere a instrucțiunilor pentru un dispozitiv, cum ar fi un computer sau un dispozitiv mobil. Scriem aceste instrucțiuni folosind un limbaj de programare, care este apoi interpretat de dispozitiv. Aceste seturi de instrucțiuni pot fi denumite în diverse moduri, dar *program*, *program de computer*, *aplicație (app)* și *executabil* sunt câteva denumiri populare.
+
+Un *program* poate fi orice este scris cu cod; site-uri web, jocuri și aplicații pentru telefon sunt programe. Deși este posibil să creezi un program fără a scrie cod, logica de bază este interpretată de dispozitiv, iar acea logică a fost cel mai probabil scrisă cu cod. Un program care *rulează* sau *execută* cod îndeplinește instrucțiuni. Dispozitivul pe care citești această lecție rulează un program pentru a o afișa pe ecran.
+
+✅ Fă puțină cercetare: cine este considerat primul programator de computer din lume?
+
+## Limbaje de Programare
+
+Limbajele de programare permit dezvoltatorilor să scrie instrucțiuni pentru un dispozitiv. Dispozitivele pot înțelege doar binar (1 și 0), iar pentru *majoritatea* dezvoltatorilor aceasta nu este o modalitate eficientă de comunicare. Limbajele de programare sunt vehiculul de comunicare între oameni și computere.
+
+Limbajele de programare vin în diferite formate și pot servi scopuri diferite. De exemplu, JavaScript este utilizat în principal pentru aplicații web, în timp ce Bash este utilizat în principal pentru sisteme de operare.
+
+*Limbajele de nivel scăzut* necesită, de obicei, mai puțini pași decât *limbajele de nivel înalt* pentru ca un dispozitiv să interpreteze instrucțiunile. Totuși, ceea ce face limbajele de nivel înalt populare este lizibilitatea și suportul lor. JavaScript este considerat un limbaj de nivel înalt.
+
+Următorul cod ilustrează diferența dintre un limbaj de nivel înalt, cum ar fi JavaScript, și un limbaj de nivel scăzut, cum ar fi codul de asamblare ARM.
+
+```javascript
+let number = 10
+let n1 = 0, n2 = 1, nextTerm;
+
+for (let i = 1; i <= number; i++) {
+    console.log(n1);
+    nextTerm = n1 + n2;
+    n1 = n2;
+    n2 = nextTerm;
+}
+```
+
+```c
+ area ascen,code,readonly
+ entry
+ code32
+ adr r0,thumb+1
+ bx r0
+ code16
+thumb
+ mov r0,#00
+ sub r0,r0,#01
+ mov r1,#01
+ mov r4,#10
+ ldr r2,=0x40000000
+back add r0,r1
+ str r0,[r2]
+ add r2,#04
+ mov r3,r0
+ mov r0,r1
+ mov r1,r3
+ sub r4,#01
+ cmp r4,#00
+ bne back
+ end
+```
+
+Crezi sau nu, *ambele fac același lucru*: afișează o secvență Fibonacci până la 10.
+
+✅ O secvență Fibonacci este [definită](https://en.wikipedia.org/wiki/Fibonacci_number) ca un set de numere în care fiecare număr este suma celor două precedente, începând de la 0 și 1. Primele 10 numere din secvența Fibonacci sunt 0, 1, 1, 2, 3, 5, 8, 13, 21 și 34.
+
+## Elemente ale unui Program
+
+O singură instrucțiune într-un program se numește *declarație* și, de obicei, are un caracter sau un spațiu care marchează unde se termină instrucțiunea, sau *se termină*. Modul în care o instrucțiune se termină variază în funcție de limbaj.
+
+Declarațiile dintr-un program pot depinde de date furnizate de un utilizator sau din altă parte pentru a îndeplini instrucțiuni. Datele pot schimba modul în care un program se comportă, astfel încât limbajele de programare vin cu o modalitate de a stoca temporar datele pentru a fi utilizate mai târziu. Acestea se numesc *variabile*. Variabilele sunt declarații care instruiesc un dispozitiv să salveze datele în memoria sa. Variabilele din programe sunt similare cu variabilele din algebră, unde au un nume unic și valoarea lor poate varia în timp.
+
+Există șansa ca unele declarații să nu fie executate de un dispozitiv. Acest lucru se întâmplă, de obicei, intenționat, atunci când sunt scrise de dezvoltator, sau accidental, când apare o eroare neașteptată. Acest tip de control asupra unei aplicații o face mai robustă și mai ușor de întreținut. De obicei, aceste schimbări de control au loc atunci când anumite condiții sunt îndeplinite. O declarație comună utilizată în programarea modernă pentru a controla modul în care un program rulează este declarația `if..else`.
+
+✅ Vei învăța mai multe despre acest tip de declarație în lecțiile următoare.
+
+## Instrumente Esențiale
+
+[![Tools of the Trade](https://img.youtube.com/vi/69WJeXGBdxg/0.jpg)](https://youtube.com/watch?v=69WJeXGBdxg "Tools of the Trade")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre instrumente
+
+În această secțiune, vei învăța despre câteva software-uri pe care le vei găsi foarte utile pe măsură ce începi călătoria ta ca dezvoltator profesionist.
+
+Un **mediu de dezvoltare** este un set unic de instrumente și funcții pe care un dezvoltator le folosește frecvent atunci când scrie software. Unele dintre aceste instrumente au fost personalizate pentru nevoile specifice ale unui dezvoltator și pot evolua în timp dacă acel dezvoltator își schimbă prioritățile în muncă, proiecte personale sau când folosește un alt limbaj de programare. Mediile de dezvoltare sunt la fel de unice ca dezvoltatorii care le folosesc.
+
+### Editoare
+
+Unul dintre cele mai importante instrumente pentru dezvoltarea software este editorul. Editoarele sunt locul unde scrii codul și, uneori, unde îl rulezi.
+
+Dezvoltatorii se bazează pe editoare din câteva motive suplimentare:
+
+- *Debugging* ajută la descoperirea bug-urilor și erorilor prin parcurgerea codului, linie cu linie. Unele editoare au capacități de debugging; acestea pot fi personalizate și adăugate pentru limbaje de programare specifice.
+- *Syntax highlighting* adaugă culori și formatare textului codului, făcându-l mai ușor de citit. Majoritatea editorilor permit personalizarea syntax highlighting.
+- *Extensii și Integrări* sunt instrumente specializate pentru dezvoltatori, create de dezvoltatori. Aceste instrumente nu au fost incluse în editorul de bază. De exemplu, mulți dezvoltatori își documentează codul pentru a explica cum funcționează. Ei pot instala o extensie de verificare ortografică pentru a găsi greșeli în documentație. Majoritatea extensiilor sunt destinate utilizării într-un editor specific, iar majoritatea editorilor vin cu o modalitate de a căuta extensii disponibile.
+- *Personalizare* permite dezvoltatorilor să creeze un mediu de dezvoltare unic pentru nevoile lor. Majoritatea editorilor sunt extrem de personalizabili și pot permite dezvoltatorilor să creeze extensii personalizate.
+
+#### Editoare Populare și Extensii pentru Dezvoltare Web
+
+- [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)
+  - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)
+  - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare)
+  - [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
+- [Atom](https://atom.io/)
+  - [spell-check](https://atom.io/packages/spell-check)
+  - [teletype](https://atom.io/packages/teletype)
+  - [atom-beautify](https://atom.io/packages/atom-beautify)
+  
+- [Sublimetext](https://www.sublimetext.com/)
+  - [emmet](https://emmet.io/)
+  - [SublimeLinter](http://www.sublimelinter.com/en/stable/)
+
+### Browsere
+
+Un alt instrument crucial este browserul. Dezvoltatorii web se bazează pe browser pentru a vedea cum rulează codul lor pe web. Este, de asemenea, utilizat pentru a afișa elementele vizuale ale unei pagini web scrise în editor, cum ar fi HTML.
+
+Multe browsere vin cu *instrumente pentru dezvoltatori* (DevTools) care conțin un set de funcții utile și informații pentru a ajuta dezvoltatorii să colecteze și să capteze informații importante despre aplicația lor. De exemplu: Dacă o pagină web are erori, este uneori util să știi când au apărut. DevTools dintr-un browser pot fi configurate pentru a capta aceste informații.
+
+#### Browsere Populare și DevTools
+
+- [Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)
+- [Chrome](https://developers.google.com/web/tools/chrome-devtools/)
+- [Firefox](https://developer.mozilla.org/docs/Tools)
+
+### Instrumente de Linie de Comandă
+
+Unii dezvoltatori preferă o vizualizare mai puțin grafică pentru sarcinile lor zilnice și se bazează pe linia de comandă pentru a realiza acest lucru. Scrierea codului necesită o cantitate semnificativă de tastare, iar unii dezvoltatori preferă să nu își întrerupă fluxul pe tastatură. Ei vor folosi scurtături de tastatură pentru a comuta între ferestrele desktop, a lucra la diferite fișiere și a utiliza instrumente. Majoritatea sarcinilor pot fi realizate cu un mouse, dar un beneficiu al utilizării liniei de comandă este că multe pot fi realizate cu instrumente de linie de comandă fără a fi nevoie să comuți între mouse și tastatură. Un alt beneficiu al liniei de comandă este că aceasta poate fi configurată și poți salva o configurație personalizată, o poți schimba mai târziu și o poți importa pe alte mașini de dezvoltare. Deoarece mediile de dezvoltare sunt atât de unice pentru fiecare dezvoltator, unii vor evita utilizarea liniei de comandă, alții se vor baza complet pe ea, iar unii preferă un mix între cele două.
+
+### Opțiuni Populare pentru Linia de Comandă
+
+Opțiunile pentru linia de comandă vor diferi în funcție de sistemul de operare pe care îl folosești.
+
+*💻 = vine preinstalat pe sistemul de operare.*
+
+#### Windows
+
+- [Powershell](https://docs.microsoft.com/powershell/scripting/overview?view=powershell-7/?WT.mc_id=academic-77807-sagibbon) 💻
+- [Command Line](https://docs.microsoft.com/windows-server/administration/windows-commands/windows-commands/?WT.mc_id=academic-77807-sagibbon) (cunoscut și sub numele de CMD) 💻
+- [Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)
+- [mintty](https://mintty.github.io/)
+  
+#### MacOS
+
+- [Terminal](https://support.apple.com/guide/terminal/open-or-quit-terminal-apd5265185d-f365-44cb-8b09-71a064a42125/mac) 💻
+- [iTerm](https://iterm2.com/)
+- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-macos?view=powershell-7/?WT.mc_id=academic-77807-sagibbon)
+
+#### Linux
+
+- [Bash](https://www.gnu.org/software/bash/manual/html_node/index.html) 💻
+- [KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)
+- [Powershell](https://docs.microsoft.com/powershell/scripting/install/installing-powershell-core-on-linux?view=powershell-7/?WT.mc_id=academic-77807-sagibbon)
+
+#### Instrumente Populare de Linie de Comandă
+
+- [Git](https://git-scm.com/) (💻 pe majoritatea sistemelor de operare)
+- [NPM](https://www.npmjs.com/)
+- [Yarn](https://classic.yarnpkg.com/en/docs/cli/)
+
+### Documentație
+
+Când un dezvoltator dorește să învețe ceva nou, cel mai probabil va apela la documentație pentru a învăța cum să o folosească. Dezvoltatorii se bazează adesea pe documentație pentru a-i ghida în utilizarea corectă a instrumentelor și limbajelor și pentru a dobândi cunoștințe mai profunde despre cum funcționează.
+
+#### Documentație Populară despre Dezvoltarea Web
+
+- [Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web), de la Mozilla, editorii browserului [Firefox](https://www.mozilla.org/firefox/)
+- [Frontend Masters](https://frontendmasters.com/learn/)
+- [Web.dev](https://web.dev), de la Google, editorii browserului [Chrome](https://www.google.com/chrome/)
+- [Documentația pentru dezvoltatori Microsoft](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers), pentru [Microsoft Edge](https://www.microsoft.com/edge)
+- [W3 Schools](https://www.w3schools.com/where_to_start.asp)
+
+✅ Fă puțină cercetare: Acum că știi elementele de bază ale mediului unui dezvoltator web, compară și contrastează-l cu mediul unui designer web.
+
+---
+
+## 🚀 Provocare
+
+Compară câteva limbaje de programare. Care sunt unele dintre trăsăturile unice ale JavaScript față de Java? Dar COBOL față de Go?
+
+## Chestionar Post-Lecție
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/2)
+
+## Recapitulare și Studiu Individual
+
+Studiază puțin despre diferitele limbaje disponibile pentru programatori. Încearcă să scrii o linie într-un limbaj și apoi să o rescrii în alte două. Ce ai învățat?
+
+## Temă
+
+[Citirea Documentației](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/1-getting-started-lessons/1-intro-to-programming-languages/assignment.md b/translations/ro/1-getting-started-lessons/1-intro-to-programming-languages/assignment.md
new file mode 100644
index 00000000..c042235e
--- /dev/null
+++ b/translations/ro/1-getting-started-lessons/1-intro-to-programming-languages/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "1ce4deaec80130d3a0a3c906568459fc",
+  "translation_date": "2025-08-28T08:25:33+00:00",
+  "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Citirea Documentației
+
+## Instrucțiuni
+
+Există multe instrumente de care un dezvoltator web poate avea nevoie, disponibile în [documentația MDN pentru instrumente de partea clientului](https://developer.mozilla.org/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview). Selectați 3 instrumente care nu sunt acoperite în lecție, explicați de ce un dezvoltator web le-ar folosi și căutați un instrument care se încadrează în această categorie, împărtășind documentația acestuia. Nu folosiți același exemplu de instrument din documentația MDN.
+
+## Criterii de Evaluare
+
+Exemplar | Adecvat | Necesită Îmbunătățiri
+--- | --- | -- |
+|Explicat de ce un dezvoltator web ar folosi instrumentul| Explicat cum, dar nu de ce un dezvoltator ar folosi instrumentul| Nu a menționat cum sau de ce un dezvoltator ar folosi instrumentul  |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/1-getting-started-lessons/2-github-basics/README.md b/translations/ro/1-getting-started-lessons/2-github-basics/README.md
new file mode 100644
index 00000000..04cdb5de
--- /dev/null
+++ b/translations/ro/1-getting-started-lessons/2-github-basics/README.md
@@ -0,0 +1,339 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "05666cecb8983a72cf0ce1d18932b5b7",
+  "translation_date": "2025-08-28T08:29:10+00:00",
+  "source_file": "1-getting-started-lessons/2-github-basics/README.md",
+  "language_code": "ro"
+}
+-->
+# Introducere în GitHub
+
+Această lecție acoperă elementele de bază ale GitHub, o platformă pentru găzduirea și gestionarea modificărilor aduse codului tău.
+
+![Intro în GitHub](../../../../translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar înainte de lecție
+[Chestionar înainte de lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/3)
+
+## Introducere
+
+În această lecție, vom acoperi:
+
+- urmărirea muncii pe care o faci pe mașina ta
+- lucrul la proiecte împreună cu alții
+- cum să contribui la software open source
+
+### Cerințe preliminare
+
+Înainte de a începe, trebuie să verifici dacă Git este instalat. În terminal, tastează: 
+`git --version`
+
+Dacă Git nu este instalat, [descarcă Git](https://git-scm.com/downloads). Apoi, configurează profilul local Git în terminal:
+* `git config --global user.name "numele-tău"`
+* `git config --global user.email "emailul-tău"`
+
+Pentru a verifica dacă Git este deja configurat, poți tasta:
+`git config --list`
+
+De asemenea, vei avea nevoie de un cont GitHub, un editor de cod (cum ar fi Visual Studio Code) și trebuie să deschizi terminalul (sau: command prompt).
+
+Accesează [github.com](https://github.com/) și creează un cont dacă nu ai deja unul, sau autentifică-te și completează profilul tău. 
+
+✅ GitHub nu este singurul depozit de cod din lume; există și altele, dar GitHub este cel mai cunoscut.
+
+### Pregătire
+
+Vei avea nevoie de un folder cu un proiect de cod pe mașina ta locală (laptop sau PC) și de un depozit public pe GitHub, care va servi drept exemplu pentru cum să contribui la proiectele altora.  
+
+---
+
+## Gestionarea codului
+
+Să presupunem că ai un folder local cu un proiect de cod și vrei să începi să îți urmărești progresul folosind git - sistemul de control al versiunilor. Unii oameni compară utilizarea git cu scrierea unei scrisori de dragoste către sinele tău din viitor. Citind mesajele de commit după zile, săptămâni sau luni, vei putea să îți amintești de ce ai luat o anumită decizie sau să "revii" la o modificare - asta dacă scrii mesaje de commit bune.
+
+### Sarcină: Creează un depozit și comite cod  
+
+> Vezi videoclipul
+> 
+> [![Videoclip despre bazele Git și GitHub](https://img.youtube.com/vi/9R31OUPpxU4/0.jpg)](https://www.youtube.com/watch?v=9R31OUPpxU4)
+
+1. **Creează un depozit pe GitHub**. Pe GitHub.com, în fila de depozite sau din bara de navigare din dreapta sus, găsește butonul **new repo**.
+
+   1. Dă un nume depozitului tău (folderului)
+   1. Selectează **create repository**.
+
+1. **Navighează la folderul tău de lucru**. În terminal, schimbă directorul la folderul pe care vrei să începi să îl urmărești. Tastează:
+
+   ```bash
+   cd [name of your folder]
+   ```
+
+1. **Inițializează un depozit git**. În proiectul tău, tastează:
+
+   ```bash
+   git init
+   ```
+
+1. **Verifică statusul**. Pentru a verifica statusul depozitului, tastează:
+
+   ```bash
+   git status
+   ```
+
+   rezultatul poate arăta ceva de genul:
+
+   ```output
+   Changes not staged for commit:
+   (use "git add <file>..." to update what will be committed)
+   (use "git checkout -- <file>..." to discard changes in working directory)
+
+        modified:   file.txt
+        modified:   file2.txt
+   ```
+
+   De obicei, comanda `git status` îți spune lucruri precum ce fișiere sunt gata să fie _salvate_ în depozit sau ce fișiere au modificări pe care poate vrei să le păstrezi.
+
+1. **Adaugă toate fișierele pentru urmărire**
+   Acest proces este numit și "staging files"/adăugarea fișierelor în zona de staging.
+
+   ```bash
+   git add .
+   ```
+
+   Argumentul `git add` plus `.` indică faptul că toate fișierele și modificările tale sunt pregătite pentru urmărire. 
+
+1. **Adaugă fișiere selectate pentru urmărire**
+
+   ```bash
+   git add [file or folder name]
+   ```
+
+   Acest lucru ne ajută să adăugăm doar fișierele selectate în zona de staging atunci când nu dorim să comitem toate fișierele deodată.
+
+1. **Elimină toate fișierele din zona de staging**
+
+   ```bash
+   git reset
+   ```
+
+   Această comandă ne ajută să eliminăm toate fișierele din zona de staging deodată.
+
+1. **Elimină un fișier specific din zona de staging**
+
+   ```bash
+   git reset [file or folder name]
+   ```
+
+   Această comandă ne ajută să eliminăm doar un fișier specific din zona de staging pe care nu dorim să îl includem în următorul commit.
+
+1. **Persistă munca ta**. În acest moment, ai adăugat fișierele într-o zonă numită _staging area_. Un loc unde Git urmărește fișierele tale. Pentru a face modificarea permanentă, trebuie să _comitezi_ fișierele. Pentru a face acest lucru, creezi un _commit_ cu comanda `git commit`. Un _commit_ reprezintă un punct de salvare în istoricul depozitului tău. Tastează următoarele pentru a crea un _commit_:
+
+   ```bash
+   git commit -m "first commit"
+   ```
+
+   Acest lucru comite toate fișierele tale, adăugând mesajul "first commit". Pentru mesajele de commit viitoare, vei dori să fii mai descriptiv în descrierea ta pentru a transmite ce tip de modificare ai făcut.
+
+1. **Conectează depozitul local Git cu GitHub**. Un depozit Git este util pe mașina ta, dar la un moment dat vei dori să ai o copie de rezervă a fișierelor undeva și să inviți alte persoane să lucreze cu tine la depozitul tău. Un loc excelent pentru a face acest lucru este GitHub. Amintește-ți că am creat deja un depozit pe GitHub, așa că singurul lucru pe care trebuie să îl facem este să conectăm depozitul local Git cu GitHub. Comanda `git remote add` va face exact acest lucru. Tastează următoarea comandă:
+
+   > Notă, înainte de a tasta comanda, accesează pagina depozitului tău GitHub pentru a găsi URL-ul depozitului. Îl vei folosi în comanda de mai jos. Înlocuiește ```https://github.com/username/repository_name.git``` cu URL-ul GitHub.
+
+   ```bash
+   git remote add origin https://github.com/username/repository_name.git
+   ```
+
+   Aceasta creează o _remote_, sau conexiune, numită "origin", care indică spre depozitul GitHub pe care l-ai creat anterior.
+
+1. **Trimite fișierele locale pe GitHub**. Până acum, ai creat o _conexiune_ între depozitul local și depozitul GitHub. Să trimitem aceste fișiere pe GitHub cu următoarea comandă `git push`, astfel: 
+   
+   > Notă, numele ramurii tale poate fi diferit de ```main```.
+
+   ```bash
+   git push -u origin main
+   ```
+
+   Aceasta trimite commit-urile tale din ramura "main" pe GitHub.
+
+2. **Adaugă mai multe modificări**. Dacă vrei să continui să faci modificări și să le trimiți pe GitHub, va trebui doar să folosești următoarele trei comenzi:
+
+   ```bash
+   git add .
+   git commit -m "type your commit message here"
+   git push
+   ```
+
+   > Sfat, Poate vei dori să adopți un fișier `.gitignore` pentru a preveni ca fișierele pe care nu vrei să le urmărești să apară pe GitHub - cum ar fi acel fișier de notițe pe care îl stochezi în același folder, dar care nu are loc într-un depozit public. Poți găsi șabloane pentru fișiere `.gitignore` la [.gitignore templates](https://github.com/github/gitignore).
+
+#### Mesaje de commit
+
+Un subiect grozav pentru un commit Git completează următoarea propoziție:
+Dacă se aplică, acest commit va <subiectul tău aici>
+
+Pentru subiect, folosește timpul prezent imperativ: "modifică" nu "modificat" sau "modificări". 
+La fel ca în subiect, în corpul mesajului (opțional) folosește timpul prezent imperativ. Corpul ar trebui să includă motivația pentru modificare și să contrasteze aceasta cu comportamentul anterior. Explici `de ce`, nu `cum`.
+
+✅ Ia câteva minute pentru a naviga pe GitHub. Poți găsi un mesaj de commit cu adevărat grozav? Poți găsi unul foarte minimal? Ce informații crezi că sunt cele mai importante și utile de transmis într-un mesaj de commit?
+
+### Sarcină: Colaborează
+
+Principalul motiv pentru care ai pus lucrurile pe GitHub a fost să faci posibilă colaborarea cu alți dezvoltatori.
+
+## Lucrul la proiecte împreună cu alții
+
+> Vezi videoclipul
+>
+> [![Videoclip despre bazele Git și GitHub](https://img.youtube.com/vi/bFCM-PC3cu8/0.jpg)](https://www.youtube.com/watch?v=bFCM-PC3cu8)
+
+În depozitul tău, navighează la `Insights > Community` pentru a vedea cum se compară proiectul tău cu standardele comunității recomandate.
+
+   Iată câteva lucruri care pot îmbunătăți depozitul tău GitHub:
+   - **Descriere**. Ai adăugat o descriere pentru proiectul tău?
+   - **README**. Ai adăugat un README? GitHub oferă îndrumări pentru scrierea unui [README](https://docs.github.com/articles/about-readmes/?WT.mc_id=academic-77807-sagibbon).
+   - **Ghid de contribuție**. Proiectul tău are [ghiduri de contribuție](https://docs.github.com/articles/setting-guidelines-for-repository-contributors/?WT.mc_id=academic-77807-sagibbon)? 
+   - **Cod de conduită**. Un [Cod de conduită](https://docs.github.com/articles/adding-a-code-of-conduct-to-your-project/)? 
+   - **Licență**. Poate cel mai important, o [licență](https://docs.github.com/articles/adding-a-license-to-a-repository/)?
+
+Toate aceste resurse vor fi benefice pentru integrarea noilor membri ai echipei. Și acestea sunt, de obicei, genul de lucruri pe care noii contribuitori le analizează înainte de a se uita la codul tău, pentru a afla dacă proiectul tău este locul potrivit pentru a-și petrece timpul.
+
+✅ Fișierele README, deși necesită timp pentru a fi pregătite, sunt adesea neglijate de mentori ocupați. Poți găsi un exemplu de README deosebit de descriptiv? Notă: există [instrumente pentru a ajuta la crearea unor README bune](https://www.makeareadme.com/) pe care s-ar putea să vrei să le încerci.
+
+### Sarcină: Combină codul
+
+Documentele de contribuție ajută oamenii să contribuie la proiect. Ele explică ce tipuri de contribuții cauți și cum funcționează procesul. Contribuitorii vor trebui să parcurgă o serie de pași pentru a putea contribui la depozitul tău pe GitHub:
+
+1. **Forking depozitul tău**. Probabil vei dori ca oamenii să _forkeze_ proiectul tău. Forking înseamnă crearea unei replici a depozitului tău pe profilul lor GitHub.
+1. **Clonează**. De acolo, vor clona proiectul pe mașina lor locală. 
+1. **Creează o ramură**. Vei dori să le ceri să creeze o _ramură_ pentru munca lor. 
+1. **Concentrează modificarea pe o singură zonă**. Cere contribuitorilor să își concentreze contribuțiile pe un singur lucru la un moment dat - astfel șansele ca tu să poți _combina_ munca lor sunt mai mari. Imaginează-ți că scriu o corecție de bug, adaugă o funcționalitate nouă și actualizează mai multe teste - ce se întâmplă dacă vrei să implementezi doar 2 din 3 sau 1 din 3 modificări?
+
+✅ Imaginează-ți o situație în care ramurile sunt deosebit de critice pentru scrierea și livrarea unui cod bun. Ce cazuri de utilizare îți vin în minte?
+
+> Notă, fii schimbarea pe care vrei să o vezi în lume și creează ramuri pentru propria ta muncă. Orice commit-uri pe care le faci vor fi făcute pe ramura pe care ești în prezent "checked out". Folosește `git status` pentru a vedea pe ce ramură te afli.
+
+Să parcurgem un flux de lucru al contribuitorului. Presupunem că contribuitorul a _forkat_ și _clonat_ depozitul, astfel încât are un depozit Git gata de lucru pe mașina sa locală:
+
+1. **Creează o ramură**. Folosește comanda `git branch` pentru a crea o ramură care va conține modificările pe care intenționează să le contribuie:
+
+   ```bash
+   git branch [branch-name]
+   ```
+
+1. **Schimbă-te la ramura de lucru**. Schimbă-te la ramura specificată și actualizează directorul de lucru cu `git switch`:
+
+   ```bash
+   git switch [branch-name]
+   ```
+
+1. **Fă modificări**. În acest moment, vrei să adaugi modificările tale. Nu uita să îi spui lui Git despre ele cu următoarele comenzi:
+
+   ```bash
+   git add .
+   git commit -m "my changes"
+   ```
+
+   Asigură-te că dai commit-ului tău un nume bun, pentru binele tău, dar și al mentorului depozitului la care ajuți.
+
+1. **Combină munca ta cu ramura `main`**. La un moment dat, ai terminat de lucrat și vrei să combini munca ta cu cea din ramura `main`. Ramura `main` s-ar putea să se fi schimbat între timp, așa că asigură-te că o actualizezi mai întâi la cea mai recentă versiune cu următoarele comenzi:
+
+   ```bash
+   git switch main
+   git pull
+   ```
+
+   În acest moment, vrei să te asiguri că orice _conflicte_, situații în care Git nu poate _combina_ ușor modificările, apar în ramura ta de lucru. Prin urmare, rulează următoarele comenzi:
+
+   ```bash
+   git switch [branch_name]
+   git merge main
+   ```
+
+   Aceasta va aduce toate modificările din `main` în ramura ta și, sperăm, vei putea continua. Dacă nu, VS Code îți va spune unde Git este _confuz_ și vei modifica fișierele afectate pentru a indica ce conținut este cel mai precis.
+
+1. **Trimite munca ta pe GitHub**. Trimiterea muncii tale pe GitHub înseamnă două lucruri. Pushing ramura ta pe depozitul tău și apoi deschiderea unui PR, Pull Request.
+
+   ```bash
+   git push --set-upstream origin [branch-name]
+   ```
+
+   Comanda de mai sus creează ramura pe depozitul tău forkat.
+
+1. **Deschide un PR**. Apoi, vrei să deschizi un PR. Faci acest lucru navigând la depozitul forkat pe GitHub. Vei vedea o indicație pe GitHub unde te întreabă dacă vrei să creezi un nou PR, dai click pe aceasta și vei fi dus la o interfață unde poți schimba titlul mesajului de commit, să îi dai o descriere mai potrivită. Acum, mentorul depozitului pe care l-ai forkat va vedea acest PR și _sperăm_ că îl va aprecia și va _combina_ PR-ul tău. Acum ești un contribuitor, yay :)
+
+1. **Curăță**. Este considerat o practică bună să _curăți_ după ce ai combinat cu succes un PR. Vrei să cureți atât ramura ta locală, cât și ramura pe care ai trimis-o pe GitHub. Mai întâi, să o ștergem local cu următoarea comandă:
+
+   ```bash
+   git branch -d [branch-name]
+   ```
+Asigură-te că accesezi pagina GitHub a repo-ului fork-uit și șterge ramura remote pe care tocmai ai împins modificările.
+
+`Pull request` pare un termen ciudat, deoarece, în realitate, vrei să îți împingi modificările în proiect. Totuși, menținătorul (proprietarul proiectului) sau echipa de bază trebuie să analizeze modificările tale înainte de a le îmbina cu ramura "principală" a proiectului, așa că, de fapt, soliciți o decizie de schimbare de la un menținător.
+
+Un pull request este locul unde poți compara și discuta diferențele introduse pe o ramură, cu recenzii, comentarii, teste integrate și altele. Un pull request bine realizat urmează, în mare, aceleași reguli ca un mesaj de commit. Poți adăuga o referință la o problemă din tracker-ul de probleme, de exemplu, atunci când munca ta rezolvă o problemă. Acest lucru se face folosind un `#` urmat de numărul problemei. De exemplu, `#97`.
+
+🤞Să sperăm că toate verificările trec și că proprietarul/proprietarii proiectului îți îmbină modificările în proiect🤞
+
+Actualizează ramura ta locală curentă cu toate commit-urile noi din ramura remote corespunzătoare de pe GitHub:
+
+`git pull`
+
+## Cum să contribui la open source
+
+Mai întâi, să găsim un repository (sau **repo**) pe GitHub care te interesează și la care ai dori să contribui cu o modificare. Vei dori să copiezi conținutul acestuia pe calculatorul tău.
+
+✅ O modalitate bună de a găsi repo-uri "prietenoase pentru începători" este să [cauți după eticheta 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
+
+![Copiază un repo local](../../../../translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.ro.png)
+
+Există mai multe moduri de a copia codul. O modalitate este să "clonezi" conținutul repository-ului, folosind HTTPS, SSH sau GitHub CLI (Command Line Interface).
+
+Deschide terminalul și clonează repository-ul astfel:
+`git clone https://github.com/ProjectURL`
+
+Pentru a lucra la proiect, schimbă directorul în folderul corespunzător:
+`cd ProjectURL`
+
+De asemenea, poți deschide întregul proiect folosind [Codespaces](https://github.com/features/codespaces), editorul de cod integrat / mediul de dezvoltare în cloud al GitHub, sau [GitHub Desktop](https://desktop.github.com/).
+
+În cele din urmă, poți descărca codul într-un folder arhivat.
+
+### Câteva lucruri interesante despre GitHub
+
+Poți să adaugi stele, să urmărești și/sau să "fork-uiești" orice repository public pe GitHub. Poți găsi repository-urile marcate cu stea în meniul drop-down din colțul din dreapta sus. Este ca și cum ai salva un bookmark, dar pentru cod.
+
+Proiectele au un tracker de probleme, de obicei pe GitHub, în fila "Issues", cu excepția cazului în care este indicat altfel, unde oamenii discută problemele legate de proiect. Iar fila Pull Requests este locul unde oamenii discută și revizuiesc modificările aflate în desfășurare.
+
+Proiectele pot avea, de asemenea, discuții în forumuri, liste de e-mail sau canale de chat precum Slack, Discord sau IRC.
+
+✅ Explorează noul tău repo GitHub și încearcă câteva lucruri, cum ar fi editarea setărilor, adăugarea de informații în repo și crearea unui proiect (cum ar fi un panou Kanban). Sunt multe lucruri pe care le poți face!
+
+---
+
+## 🚀 Provocare
+
+Fă echipă cu un prieten pentru a lucra pe codul celuilalt. Creați un proiect colaborativ, fork-uiți codul, creați ramuri și îmbinați modificările.
+
+## Chestionar post-lectură
+[Chestionar post-lectură](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/4)
+
+## Recapitulare și studiu individual
+
+Citește mai multe despre [cum să contribui la software open source](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution).
+
+[Fișă de referință Git](https://training.github.com/downloads/github-git-cheat-sheet/).
+
+Exersează, exersează, exersează. GitHub oferă trasee de învățare excelente prin [skills.github.com](https://skills.github.com):
+
+- [Prima săptămână pe GitHub](https://skills.github.com/#first-week-on-github)
+
+Vei găsi și cursuri mai avansate.
+
+## Temă
+
+Completează [cursul Prima săptămână pe GitHub](https://skills.github.com/#first-week-on-github)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/1-getting-started-lessons/3-accessibility/README.md b/translations/ro/1-getting-started-lessons/3-accessibility/README.md
new file mode 100644
index 00000000..2cbfe466
--- /dev/null
+++ b/translations/ro/1-getting-started-lessons/3-accessibility/README.md
@@ -0,0 +1,244 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e4cd5b1faed4adab5acf720f82798003",
+  "translation_date": "2025-08-28T08:25:49+00:00",
+  "source_file": "1-getting-started-lessons/3-accessibility/README.md",
+  "language_code": "ro"
+}
+-->
+# Crearea Paginilor Web Accesibile
+
+![Totul despre Accesibilitate](../../../../translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.ro.png)
+> Schiță realizată de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar înainte de curs
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/5)
+
+> Puterea Web-ului constă în universalitatea sa. Accesul pentru toată lumea, indiferent de dizabilitate, este un aspect esențial.
+>
+> \- Sir Timothy Berners-Lee, Director W3C și inventatorul World Wide Web
+
+Acest citat subliniază perfect importanța creării site-urilor accesibile. O aplicație care nu poate fi accesată de toți este, prin definiție, exclusivistă. Ca dezvoltatori web, ar trebui să avem mereu în vedere accesibilitatea. Concentrându-ne pe acest aspect încă de la început, veți fi pe drumul cel bun pentru a vă asigura că toată lumea poate accesa paginile pe care le creați. În această lecție, veți învăța despre instrumentele care vă pot ajuta să vă asigurați că resursele web sunt accesibile și cum să construiți având accesibilitatea în minte.
+
+> Puteți parcurge această lecție pe [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/accessibility/?WT.mc_id=academic-77807-sagibbon)!
+
+## Instrumente de utilizat
+
+### Cititoare de ecran
+
+Unul dintre cele mai cunoscute instrumente de accesibilitate sunt cititoarele de ecran.
+
+[Cititoarele de ecran](https://en.wikipedia.org/wiki/Screen_reader) sunt utilizate frecvent de persoanele cu deficiențe de vedere. Așa cum ne asigurăm că un browser transmite corect informațiile pe care dorim să le împărtășim, trebuie să ne asigurăm și că un cititor de ecran face același lucru.
+
+La nivel de bază, un cititor de ecran va citi o pagină de sus în jos, în mod auditiv. Dacă pagina este doar text, cititorul va transmite informațiile într-un mod similar cu un browser. Desigur, paginile web sunt rareori doar text; ele conțin linkuri, imagini, culori și alte componente vizuale. Trebuie să avem grijă ca aceste informații să fie citite corect de un cititor de ecran.
+
+Fiecare dezvoltator web ar trebui să se familiarizeze cu un cititor de ecran. Așa cum este important să cunoașteți cum funcționează un browser, ar trebui să învățați și cum funcționează un cititor de ecran. Din fericire, cititoarele de ecran sunt integrate în majoritatea sistemelor de operare.
+
+Unele browsere au, de asemenea, instrumente și extensii integrate care pot citi textul cu voce tare sau pot oferi funcții de navigare de bază, cum ar fi [aceste instrumente axate pe accesibilitate din browserul Edge](https://support.microsoft.com/help/4000734/microsoft-edge-accessibility-features). Acestea sunt, de asemenea, instrumente importante de accesibilitate, dar funcționează foarte diferit de cititoarele de ecran și nu ar trebui confundate cu instrumentele de testare pentru cititoare de ecran.
+
+✅ Încercați un cititor de ecran și un cititor de text din browser. Pe Windows, [Narrator](https://support.microsoft.com/windows/complete-guide-to-narrator-e4397a0d-ef4f-b386-d8ae-c172f109bdb1/?WT.mc_id=academic-77807-sagibbon) este inclus implicit, iar [JAWS](https://webaim.org/articles/jaws/) și [NVDA](https://www.nvaccess.org/about-nvda/) pot fi instalate. Pe macOS și iOS, [VoiceOver](https://support.apple.com/guide/voiceover/welcome/10) este instalat implicit.
+
+### Zoom
+
+Un alt instrument utilizat frecvent de persoanele cu deficiențe de vedere este funcția de zoom. Cel mai simplu tip de zoom este zoom-ul static, controlat prin `Control + semnul plus (+)` sau prin reducerea rezoluției ecranului. Acest tip de zoom redimensionează întreaga pagină, așa că utilizarea [designului responsive](https://developer.mozilla.org/docs/Learn/CSS/CSS_layout/Responsive_Design) este importantă pentru a oferi o experiență bună utilizatorilor la niveluri de zoom crescute.
+
+Un alt tip de zoom se bazează pe software specializat pentru a mări o zonă a ecranului și a o deplasa, similar cu utilizarea unei lupe reale. Pe Windows, [Magnifier](https://support.microsoft.com/windows/use-magnifier-to-make-things-on-the-screen-easier-to-see-414948ba-8b1c-d3bd-8615-0e5e32204198) este integrat, iar [ZoomText](https://www.freedomscientific.com/training/zoomtext/getting-started/) este un software de mărire terț cu mai multe funcții și o bază mai mare de utilizatori. Atât macOS, cât și iOS au un software de mărire integrat numit [Zoom](https://www.apple.com/accessibility/mac/vision/).
+
+### Verificatoare de contrast
+
+Culorile de pe site-urile web trebuie alese cu grijă pentru a răspunde nevoilor utilizatorilor daltoni sau ale persoanelor care au dificultăți în a vedea culorile cu contrast scăzut.
+
+✅ Testați un site web pe care îl utilizați frecvent pentru utilizarea culorilor cu o extensie de browser, cum ar fi [verificatorul de contrast al culorilor WCAG](https://microsoftedge.microsoft.com/addons/detail/wcag-color-contrast-check/idahaggnlnekelhgplklhfpchbfdmkjp?hl=en-US&WT.mc_id=academic-77807-sagibbon). Ce ați învățat?
+
+### Lighthouse
+
+În zona de instrumente pentru dezvoltatori a browserului dvs., veți găsi instrumentul Lighthouse. Acest instrument este important pentru a obține o primă vedere asupra accesibilității (precum și a altor analize) ale unui site web. Deși este important să nu vă bazați exclusiv pe Lighthouse, un scor de 100% este foarte util ca punct de plecare.
+
+✅ Găsiți Lighthouse în panoul de instrumente pentru dezvoltatori al browserului dvs. și rulați o analiză pe orice site. Ce descoperiți?
+
+## Proiectarea pentru accesibilitate
+
+Accesibilitatea este un subiect relativ vast. Pentru a vă ajuta, există numeroase resurse disponibile.
+
+- [Accessible U - University of Minnesota](https://accessibility.umn.edu/your-role/web-developers)
+
+Deși nu vom putea acoperi fiecare aspect al creării site-urilor accesibile, mai jos sunt câteva dintre principiile de bază pe care veți dori să le implementați. Proiectarea unei pagini accesibile de la început este **întotdeauna** mai ușoară decât să reveniți la o pagină existentă pentru a o face accesibilă.
+
+## Principii bune de afișare
+
+### Palete de culori sigure
+
+Oamenii percep lumea în moduri diferite, inclusiv culorile. Când selectați o schemă de culori pentru site-ul dvs., ar trebui să vă asigurați că este accesibilă pentru toți. Un instrument excelent pentru generarea de palete de culori este [Color Safe](http://colorsafe.co/).
+
+✅ Identificați un site web care are probleme mari în utilizarea culorilor. De ce?
+
+### Utilizați HTML corect
+
+Cu CSS și JavaScript, este posibil să faceți orice element să arate ca orice tip de control. `<span>` ar putea fi utilizat pentru a crea un `<button>`, iar `<b>` ar putea deveni un hyperlink. Deși acest lucru ar putea fi considerat mai ușor de stilizat, nu transmite nimic unui cititor de ecran. Utilizați HTML-ul corespunzător atunci când creați controale pe o pagină. Dacă doriți un hyperlink, utilizați `<a>`. Utilizarea HTML-ului corect pentru controlul potrivit se numește utilizarea HTML-ului semantic.
+
+✅ Accesați orice site web și verificați dacă designerii și dezvoltatorii utilizează HTML corect. Puteți găsi un buton care ar trebui să fie un link? Sfat: faceți clic dreapta și alegeți 'View Page Source' în browserul dvs. pentru a analiza codul sursă.
+
+### Creați o ierarhie descriptivă a titlurilor
+
+Utilizatorii de cititoare de ecran [se bazează foarte mult pe titluri](https://webaim.org/projects/screenreadersurvey8/#finding) pentru a găsi informații și a naviga printr-o pagină. Scrierea unui conținut descriptiv pentru titluri și utilizarea etichetelor semantice pentru titluri sunt importante pentru crearea unui site ușor de navigat pentru utilizatorii de cititoare de ecran.
+
+### Utilizați indicii vizuale bune
+
+CSS oferă control complet asupra aspectului oricărui element de pe o pagină. Puteți crea casete de text fără contur sau hyperlinkuri fără subliniere. Din păcate, eliminarea acestor indicii poate face mai dificil pentru cineva care depinde de ele să recunoască tipul de control.
+
+## Importanța textului linkurilor
+
+Hyperlinkurile sunt esențiale pentru navigarea pe web. Prin urmare, asigurarea faptului că un cititor de ecran poate citi corect linkurile permite tuturor utilizatorilor să navigheze pe site-ul dvs.
+
+### Cititoare de ecran și linkuri
+
+Așa cum v-ați aștepta, cititoarele de ecran citesc textul linkurilor în același mod în care ar citi orice alt text de pe pagină. Având în vedere acest lucru, textul demonstrat mai jos ar putea părea perfect acceptabil.
+
+> Pinguinul mic, cunoscut uneori sub numele de pinguin zână, este cel mai mic pinguin din lume. [Click aici](https://en.wikipedia.org/wiki/Little_penguin) pentru mai multe informații.
+
+> Pinguinul mic, cunoscut uneori sub numele de pinguin zână, este cel mai mic pinguin din lume. Vizitați https://en.wikipedia.org/wiki/Little_penguin pentru mai multe informații.
+
+> **NOTĂ** Așa cum urmează să citiți, nu ar trebui **niciodată** să creați linkuri care arată ca cele de mai sus.
+
+Amintiți-vă, cititoarele de ecran sunt o interfață diferită de browsere, cu un set diferit de funcții.
+
+### Problema utilizării URL-ului
+
+Cititoarele de ecran citesc textul. Dacă un URL apare în text, cititorul de ecran va citi URL-ul. În general, URL-ul nu transmite informații semnificative și poate suna enervant. Probabil ați experimentat acest lucru dacă telefonul dvs. a citit vreodată cu voce tare un mesaj text cu un URL.
+
+### Problema cu "click aici"
+
+Cititoarele de ecran au, de asemenea, capacitatea de a citi doar hyperlinkurile de pe o pagină, la fel cum o persoană văzătoare ar scana o pagină pentru linkuri. Dacă textul linkului este mereu "click aici", utilizatorul va auzi doar "click aici, click aici, click aici, click aici, click aici, ..." Toate linkurile devin acum indistincte.
+
+### Text bun pentru linkuri
+
+Un text bun pentru linkuri descrie pe scurt ce se află pe cealaltă parte a linkului. În exemplul de mai sus despre pinguinii mici, linkul duce la pagina Wikipedia despre această specie. Expresia *pinguin mic* ar fi un text perfect pentru link, deoarece face clar ce va învăța cineva dacă face clic pe link - pinguinii mici.
+
+> [Pinguinul mic](https://en.wikipedia.org/wiki/Little_penguin), cunoscut uneori sub numele de pinguin zână, este cel mai mic pinguin din lume.
+
+✅ Navigați pe web câteva minute pentru a găsi pagini care folosesc strategii obscure de legare. Comparați-le cu alte site-uri care folosesc linkuri mai clare. Ce ați învățat?
+
+#### Note pentru motoarele de căutare
+
+Ca un bonus suplimentar pentru asigurarea accesibilității site-ului dvs., veți ajuta și motoarele de căutare să navigheze pe site-ul dvs. Motoarele de căutare folosesc textul linkurilor pentru a învăța despre subiectele paginilor. Așadar, utilizarea unui text bun pentru linkuri ajută pe toată lumea!
+
+### ARIA
+
+Imaginați-vă următoarea pagină:
+
+| Produs       | Descriere          | Comandă      |
+| ------------ | ------------------ | ------------ |
+| Widget       | [Descriere](../../../../1-getting-started-lessons/3-accessibility/')   | [Comandă](../../../../1-getting-started-lessons/3-accessibility/') |
+| Super widget | [Descriere](../../../../1-getting-started-lessons/3-accessibility/')   | [Comandă](../../../../1-getting-started-lessons/3-accessibility/') |
+
+În acest exemplu, duplicarea textului pentru descriere și comandă are sens pentru cineva care folosește un browser. Totuși, cineva care folosește un cititor de ecran ar auzi doar cuvintele *descriere* și *comandă* repetate fără context.
+
+Pentru a sprijini astfel de scenarii, HTML acceptă un set de atribute cunoscute sub numele de [Aplicații Internet Accesibile Îmbogățite (ARIA)](https://developer.mozilla.org/docs/Web/Accessibility/ARIA). Aceste atribute vă permit să oferiți informații suplimentare cititoarelor de ecran.
+
+> **NOTĂ**: La fel ca multe aspecte ale HTML-ului, suportul pentru browsere și cititoare de ecran poate varia. Totuși, majoritatea clienților principali acceptă atributele ARIA.
+
+Puteți utiliza `aria-label` pentru a descrie linkul atunci când formatul paginii nu vă permite. Descrierea pentru widget ar putea fi setată astfel:
+
+``` html
+<a href="#" aria-label="Widget description">description</a>
+```
+
+✅ În general, utilizarea marcajului semantic, așa cum este descris mai sus, are prioritate față de utilizarea ARIA, dar uneori nu există un echivalent semantic pentru diverse widget-uri HTML. Un exemplu bun este un arbore. Nu există un echivalent HTML pentru un arbore, așa că identificați `<div>` generic pentru acest element cu un rol și valori ARIA corespunzătoare. [Documentația MDN despre ARIA](https://developer.mozilla.org/docs/Web/Accessibility/ARIA) conține mai multe informații utile.
+
+```html
+<h2 id="tree-label">File Viewer</h2>
+<div role="tree" aria-labelledby="tree-label">
+  <div role="treeitem" aria-expanded="false" tabindex="0">Uploads</div>
+</div>
+```
+
+## Imagini
+
+Este de la sine înțeles că cititoarele de ecran nu pot citi automat ce se află într-o imagine. Asigurarea accesibilității imaginilor nu necesită mult efort - acesta este scopul atributului `alt`. Toate imaginile semnificative ar trebui să aibă un `alt` care să descrie ce sunt.
+Imaginile care sunt pur decorative ar trebui să aibă atributul `alt` setat la un șir gol: `alt=""`. Acest lucru împiedică cititoarele de ecran să anunțe inutil imaginea decorativă.
+
+✅ Așa cum v-ați aștepta, motoarele de căutare nu pot înțelege ce se află într-o imagine. Ele folosesc, de asemenea, textul alternativ. Așadar, din nou, asigurarea accesibilității paginii dvs. oferă beneficii suplimentare!
+
+## Tastatura
+
+Unii utilizatori nu pot folosi un mouse sau un trackpad, bazându-se în schimb pe interacțiunile cu tastatura pentru a naviga de la un element la altul. Este important ca site-ul dvs. web să prezinte conținutul într-o ordine logică, astfel încât un utilizator de tastatură să poată accesa fiecare element interactiv pe măsură ce parcurge documentul. Dacă construiți paginile web cu marcaj semantic și utilizați CSS pentru a stiliza aspectul lor vizual, site-ul dvs. ar trebui să fie navigabil cu tastatura, dar este important să testați acest aspect manual. Aflați mai multe despre [strategiile de navigare cu tastatura](https://webaim.org/techniques/keyboard/).
+
+✅ Accesați orice site web și încercați să navigați prin el folosind doar tastatura. Ce funcționează, ce nu funcționează? De ce?
+
+## Rezumat
+
+Un web accesibil doar pentru unii nu este un adevărat 'world-wide web'. Cea mai bună modalitate de a vă asigura că site-urile pe care le creați sunt accesibile este să încorporați cele mai bune practici de accesibilitate de la început. Deși sunt implicate pași suplimentari, încorporarea acestor abilități în fluxul dvs. de lucru acum va însemna că toate paginile pe care le creați vor fi accesibile.
+
+---
+
+## 🚀 Provocare
+
+Luați acest HTML și rescrieți-l pentru a fi cât mai accesibil posibil, având în vedere strategiile pe care le-ați învățat.
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>
+      Example
+    </title>
+    <link href='../assets/style.css' rel='stylesheet' type='text/css'>
+  </head>
+  <body>
+    <div class="site-header">
+      <p class="site-title">Turtle Ipsum</p>
+      <p class="site-subtitle">The World's Premier Turtle Fan Club</p>
+    </div>
+    <div class="main-nav">
+      <p class="nav-header">Resources</p>
+      <div class="nav-list">
+        <p class="nav-item nav-item-bull"><a href="https://www.youtube.com/watch?v=CMNry4PE93Y">"I like turtles"</a></p>
+        <p class="nav-item nav-item-bull"><a href="https://en.wikipedia.org/wiki/Turtle">Basic Turtle Info</a></p>
+        <p class="nav-item nav-item-bull"><a href="https://en.wikipedia.org/wiki/Turtles_(chocolate)">Chocolate Turtles</a></p>
+      </div>
+    </div>
+    <div class="main-content">
+      <div>
+        <p class="page-title">Welcome to Turtle Ipsum. 
+            <a href="">Click here</a> to learn more.
+        </p>
+        <p class="article-text">
+          Turtle ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
+        </p>
+      </div>
+    </div>
+    <div class="footer">
+      <div class="footer-section">
+        <span class="button">Sign up for turtle news</span>
+      </div><div class="footer-section">
+        <p class="nav-header footer-title">
+          Internal Pages
+        </p>
+        <div class="nav-list">
+          <p class="nav-item nav-item-bull"><a href="../">Index</a></p>
+          <p class="nav-item nav-item-bull"><a href="../semantic">Semantic Example</a></p>
+        </div>
+      </div>
+      <p class="footer-copyright">&copy; 2016 Instrument</span>
+    </div>
+  </body>
+</html>
+```
+
+## Chestionar după curs
+[Chestionar după curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/6)
+
+## Recapitulare și Studiu Individual
+Multe guverne au legi referitoare la cerințele de accesibilitate. Documentează-te despre legile privind accesibilitatea din țara ta. Ce este acoperit și ce nu este? Un exemplu este [acest site web guvernamental](https://accessibility.blog.gov.uk/).
+
+## Sarcină
+
+[Analizează un site web inaccesibil](assignment.md)
+
+Credite: [Turtle Ipsum](https://github.com/Instrument/semantic-html-sample) de Instrument
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/1-getting-started-lessons/3-accessibility/assignment.md b/translations/ro/1-getting-started-lessons/3-accessibility/assignment.md
new file mode 100644
index 00000000..039a13d1
--- /dev/null
+++ b/translations/ro/1-getting-started-lessons/3-accessibility/assignment.md
@@ -0,0 +1,29 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "a258597a194e77d4fd469b3cd976b29e",
+  "translation_date": "2025-08-28T08:28:52+00:00",
+  "source_file": "1-getting-started-lessons/3-accessibility/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Analiza unui site inaccesibil
+
+## Instrucțiuni
+
+Identifică un site web despre care crezi că NU este accesibil și creează un plan de acțiune pentru a-i îmbunătăți accesibilitatea. 
+Prima ta sarcină va fi să identifici acest site, să detaliezi modurile în care consideri că este inaccesibil fără a folosi instrumente analitice, apoi să îl supui unei analize Lighthouse. Salvează un pdf cu rezultatele acestei analize și conturează un plan detaliat cu minimum zece puncte care arată cum site-ul ar putea fi îmbunătățit.
+
+## Tabel pentru testarea accesibilității site-ului
+
+| Criterii | Exemplu | Adecvat | Necesită îmbunătățiri |
+|----------|---------|---------|-----------------------|
+|          | lipsesc <10% din cerințe | lipsesc 20% din cerințe | lipsesc 50% din cerințe |
+
+----
+Raportul studentului: include paragrafe despre cât de inaccesibil este site-ul, raportul Lighthouse salvat în format pdf, o listă cu zece puncte de îmbunătățire, cu detalii despre cum să fie implementate
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/1-getting-started-lessons/README.md b/translations/ro/1-getting-started-lessons/README.md
new file mode 100644
index 00000000..14bb416b
--- /dev/null
+++ b/translations/ro/1-getting-started-lessons/README.md
@@ -0,0 +1,31 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "04683f4cfa46004179b0404b89a3065c",
+  "translation_date": "2025-08-28T08:23:49+00:00",
+  "source_file": "1-getting-started-lessons/README.md",
+  "language_code": "ro"
+}
+-->
+# Începe cu Dezvoltarea Web
+
+În această secțiune a curriculumului, vei fi introdus în concepte non-bazate pe proiecte, importante pentru a deveni un dezvoltator profesionist.
+
+### Subiecte
+
+1. [Introducere în Limbaje de Programare și Instrumente Esențiale](1-intro-to-programming-languages/README.md)
+2. [Introducere în GitHub](2-github-basics/README.md)
+3. [Bazele Accesibilității](3-accessibility/README.md)
+
+### Credite
+
+Introducerea în Limbaje de Programare și Instrumente Esențiale a fost scrisă cu ♥️ de [Jasmine Greenaway](https://twitter.com/paladique)
+
+Introducerea în GitHub a fost scrisă cu ♥️ de [Floor Drees](https://twitter.com/floordrees)
+
+Bazele Accesibilității au fost scrise cu ♥️ de [Christopher Harrison](https://twitter.com/geektrainer)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/1-data-types/README.md b/translations/ro/2-js-basics/1-data-types/README.md
new file mode 100644
index 00000000..d24cdc9e
--- /dev/null
+++ b/translations/ro/2-js-basics/1-data-types/README.md
@@ -0,0 +1,214 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "fc6aef8ecfdd5b0ad2afa6e6ba52bfde",
+  "translation_date": "2025-08-28T08:06:13+00:00",
+  "source_file": "2-js-basics/1-data-types/README.md",
+  "language_code": "ro"
+}
+-->
+# Bazele JavaScript: Tipuri de Date
+
+![Bazele JavaScript - Tipuri de date](../../../../translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar Pre-Lecție
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/7)
+
+Această lecție acoperă bazele JavaScript, limbajul care oferă interactivitate pe web.
+
+> Poți parcurge această lecție pe [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-variables/?WT.mc_id=academic-77807-sagibbon)!
+
+[![Variabile](https://img.youtube.com/vi/JNIXfGiDWM8/0.jpg)](https://youtube.com/watch?v=JNIXfGiDWM8 "Variabile în JavaScript")
+
+[![Tipuri de Date în JavaScript](https://img.youtube.com/vi/AWfA95eLdq8/0.jpg)](https://youtube.com/watch?v=AWfA95eLdq8 "Tipuri de Date în JavaScript")
+
+> 🎥 Fă clic pe imaginile de mai sus pentru videoclipuri despre variabile și tipuri de date
+
+Să începem cu variabilele și tipurile de date care le populează!
+## Variabile
+
+Variabilele stochează valori care pot fi utilizate și modificate pe parcursul codului tău.
+
+Crearea și **declararea** unei variabile are următoarea sintaxă **[cuvânt cheie] [nume]**. Este alcătuită din două părți:
+
+- **Cuvânt cheie**. Cuvintele cheie pot fi `let` sau `var`.  
+
+✅ Cuvântul cheie `let` a fost introdus în ES6 și oferă variabilei tale un așa-numit _block scope_. Este recomandat să folosești `let` în loc de `var`. Vom acoperi mai în detaliu block scopes în părțile viitoare.
+- **Numele variabilei**, acesta este un nume ales de tine.
+
+### Sarcină - lucrul cu variabile
+
+1. **Declară o variabilă**. Să declarăm o variabilă folosind cuvântul cheie `let`:
+
+    ```javascript
+    let myVariable;
+    ```
+
+   `myVariable` a fost acum declarată folosind cuvântul cheie `let`. În prezent nu are o valoare.
+
+1. **Atribuie o valoare**. Stochează o valoare într-o variabilă folosind operatorul `=`, urmat de valoarea dorită.
+
+    ```javascript
+    myVariable = 123;
+    ```
+
+   > Notă: utilizarea lui `=` în această lecție înseamnă că folosim un "operator de atribuire", utilizat pentru a seta o valoare unei variabile. Nu denotă egalitate.
+
+   `myVariable` a fost acum *inițializată* cu valoarea 123.
+
+1. **Refactorizează**. Înlocuiește codul tău cu următoarea instrucțiune.
+
+    ```javascript
+    let myVariable = 123;
+    ```
+
+    De mai sus este numită o _inițializare explicită_ atunci când o variabilă este declarată și i se atribuie o valoare în același timp.
+
+1. **Schimbă valoarea variabilei**. Schimbă valoarea variabilei în următorul mod:
+
+   ```javascript
+   myVariable = 321;
+   ```
+
+   Odată ce o variabilă este declarată, îi poți schimba valoarea în orice moment în codul tău folosind operatorul `=` și noua valoare.
+
+   ✅ Încearcă! Poți scrie JavaScript direct în browserul tău. Deschide o fereastră de browser și navighează la Instrumentele pentru Dezvoltatori. În consolă, vei găsi un prompt; tastează `let myVariable = 123`, apasă Enter, apoi tastează `myVariable`. Ce se întâmplă? Notă, vei învăța mai multe despre aceste concepte în lecțiile următoare.
+
+## Constante
+
+Declararea și inițializarea unei constante urmează aceleași concepte ca o variabilă, cu excepția cuvântului cheie `const`. Constantele sunt de obicei declarate cu litere mari.
+
+```javascript
+const MY_VARIABLE = 123;
+```
+
+Constantele sunt similare cu variabilele, cu două excepții:
+
+- **Trebuie să aibă o valoare**. Constantele trebuie să fie inițializate, altfel va apărea o eroare la rularea codului.
+- **Referința nu poate fi schimbată**. Referința unei constante nu poate fi schimbată odată ce a fost inițializată, altfel va apărea o eroare la rularea codului. Să analizăm două exemple:
+   - **Valoare simplă**. Următorul NU este permis:
+   
+      ```javascript
+      const PI = 3;
+      PI = 4; // not allowed
+      ```
+ 
+   - **Referința obiectului este protejată**. Următorul NU este permis.
+   
+      ```javascript
+      const obj = { a: 3 };
+      obj = { b: 5 } // not allowed
+      ```
+
+    - **Valoarea obiectului nu este protejată**. Următorul ESTE permis:
+    
+      ```javascript
+      const obj = { a: 3 };
+      obj.a = 5;  // allowed
+      ```
+
+      De mai sus, schimbi valoarea obiectului, dar nu referința în sine, ceea ce face ca acest lucru să fie permis.
+
+   > Notă, un `const` înseamnă că referința este protejată de reasignare. Totuși, valoarea nu este _imutabilă_ și poate fi schimbată, mai ales dacă este o construcție complexă precum un obiect.
+
+## Tipuri de Date
+
+Variabilele pot stoca multe tipuri diferite de valori, cum ar fi numere și text. Aceste tipuri variate de valori sunt cunoscute sub numele de **tipuri de date**. Tipurile de date sunt o parte importantă a dezvoltării software-ului, deoarece ajută dezvoltatorii să ia decizii despre cum ar trebui să fie scris codul și cum ar trebui să ruleze software-ul. Mai mult, unele tipuri de date au caracteristici unice care ajută la transformarea sau extragerea de informații suplimentare dintr-o valoare.
+
+✅ Tipurile de date sunt, de asemenea, denumite primitive de date JavaScript, deoarece sunt cele mai de bază tipuri de date oferite de limbaj. Există 7 tipuri de date primitive: string, number, bigint, boolean, undefined, null și symbol. Gândește-te un minut la ce ar putea reprezenta fiecare dintre aceste primitive. Ce este un `zebra`? Dar `0`? `true`?
+
+### Numere
+
+În secțiunea anterioară, valoarea lui `myVariable` era un tip de date număr.
+
+`let myVariable = 123;`
+
+Variabilele pot stoca toate tipurile de numere, inclusiv zecimale sau numere negative. Numerele pot fi, de asemenea, utilizate cu operatori aritmetici, acoperiți în [secțiunea următoare](../../../../2-js-basics/1-data-types).
+
+### Operatorii Aritmetici
+
+Există mai multe tipuri de operatori pentru a efectua funcții aritmetice, iar câțiva sunt enumerați aici:
+
+| Simbol | Descriere                                                              | Exemplu                          |
+| ------ | ---------------------------------------------------------------------- | -------------------------------- |
+| `+`    | **Adunare**: Calculează suma a două numere                             | `1 + 2 //răspunsul așteptat este 3`   |
+| `-`    | **Scădere**: Calculează diferența dintre două numere                   | `1 - 2 //răspunsul așteptat este -1`  |
+| `*`    | **Înmulțire**: Calculează produsul a două numere                       | `1 * 2 //răspunsul așteptat este 2`   |
+| `/`    | **Împărțire**: Calculează câtul a două numere                          | `1 / 2 //răspunsul așteptat este 0.5` |
+| `%`    | **Rest**: Calculează restul împărțirii a două numere                   | `1 % 2 //răspunsul așteptat este 1`   |
+
+✅ Încearcă! Încearcă o operație aritmetică în consola browserului tău. Te surprind rezultatele?
+
+### Șiruri de caractere
+
+Șirurile de caractere sunt seturi de caractere care se află între ghilimele simple sau duble.
+
+- `'Acesta este un șir de caractere'`
+- `"Acesta este și un șir de caractere"`
+- `let myString = 'Aceasta este o valoare de șir stocată într-o variabilă';`
+
+Amintește-ți să folosești ghilimele atunci când scrii un șir, altfel JavaScript va presupune că este un nume de variabilă.
+
+### Formatarea Șirurilor
+
+Șirurile sunt textuale și vor necesita formatare din când în când.
+
+Pentru a **concatena** două sau mai multe șiruri, sau pentru a le uni, folosește operatorul `+`.
+
+```javascript
+let myString1 = "Hello";
+let myString2 = "World";
+
+myString1 + myString2 + "!"; //HelloWorld!
+myString1 + " " + myString2 + "!"; //Hello World!
+myString1 + ", " + myString2 + "!"; //Hello, World!
+
+```
+
+✅ De ce `1 + 1 = 2` în JavaScript, dar `'1' + '1' = 11?` Gândește-te la asta. Dar `'1' + 1`?
+
+**Șabloanele literale** sunt o altă modalitate de a formata șirurile, cu excepția faptului că în loc de ghilimele, se folosește backtick-ul. Orice nu este text simplu trebuie plasat în placeholder-ul `${ }`. Acest lucru include orice variabile care pot fi șiruri.
+
+```javascript
+let myString1 = "Hello";
+let myString2 = "World";
+
+`${myString1} ${myString2}!` //Hello World!
+`${myString1}, ${myString2}!` //Hello, World!
+```
+
+Poți atinge obiectivele tale de formatare cu oricare metodă, dar șabloanele literale vor respecta orice spații și linii noi.
+
+✅ Când ai folosi un șablon literal în loc de un șir simplu?
+
+### Booleeni
+
+Booleenii pot avea doar două valori: `true` sau `false`. Booleenii pot ajuta la luarea deciziilor despre ce linii de cod ar trebui să ruleze atunci când anumite condiții sunt îndeplinite. În multe cazuri, [operatorii](../../../../2-js-basics/1-data-types) ajută la setarea valorii unui booleean și vei observa adesea variabile fiind inițializate sau valorile lor fiind actualizate cu un operator.
+
+- `let myTrueBool = true`
+- `let myFalseBool = false`
+
+✅ O variabilă poate fi considerată 'truthy' dacă evaluează la un booleean `true`. Interesant, în JavaScript, [toate valorile sunt truthy, cu excepția celor definite ca falsy](https://developer.mozilla.org/docs/Glossary/Truthy).
+
+---
+
+## 🚀 Provocare
+
+JavaScript este cunoscut pentru modurile sale surprinzătoare de a gestiona tipurile de date uneori. Fă puțină cercetare despre aceste 'capcane'. De exemplu: sensibilitatea la majuscule poate fi problematică! Încearcă asta în consola ta: `let age = 1; let Age = 2; age == Age` (rezultă `false` -- de ce?). Ce alte capcane poți găsi?
+
+## Chestionar Post-Lecție
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/8)
+
+## Recapitulare & Studiu Individual
+
+Aruncă o privire la [această listă de exerciții JavaScript](https://css-tricks.com/snippets/javascript/) și încearcă unul. Ce ai învățat?
+
+## Temă
+
+[Exerciții de Practică cu Tipuri de Date](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/1-data-types/assignment.md b/translations/ro/2-js-basics/1-data-types/assignment.md
new file mode 100644
index 00000000..c1f74ce6
--- /dev/null
+++ b/translations/ro/2-js-basics/1-data-types/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3869244ceda606c4969d8cdd82679867",
+  "translation_date": "2025-08-28T08:08:26+00:00",
+  "source_file": "2-js-basics/1-data-types/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Exersare cu Tipuri de Date
+
+## Instrucțiuni
+
+Imaginează-ți că construiești un coș de cumpărături. Scrie o documentație despre tipurile de date de care ai avea nevoie pentru a finaliza experiența de cumpărături. Cum ai ajuns la alegerile tale?
+
+## Criterii de Evaluare
+
+Criterii | Exemplu | Adecvat | Necesită Îmbunătățiri
+--- | --- | --- | --- |
+||Cele șase tipuri de date sunt enumerate și explorate în detaliu, documentând utilizarea lor|Patru tipuri de date sunt explorate|Două tipuri de date sunt explorate|
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/2-functions-methods/README.md b/translations/ro/2-js-basics/2-functions-methods/README.md
new file mode 100644
index 00000000..3e24c71e
--- /dev/null
+++ b/translations/ro/2-js-basics/2-functions-methods/README.md
@@ -0,0 +1,210 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b4612bbb9ace984f374fcc80e3e035ad",
+  "translation_date": "2025-08-28T08:03:00+00:00",
+  "source_file": "2-js-basics/2-functions-methods/README.md",
+  "language_code": "ro"
+}
+-->
+# Bazele JavaScript: Metode și Funcții
+
+![Bazele JavaScript - Funcții](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar înainte de curs
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/9)
+
+Când ne gândim la scrierea codului, vrem mereu să ne asigurăm că acesta este ușor de citit. Deși poate suna contraintuitiv, codul este citit de multe ori mai des decât este scris. Un instrument esențial în trusa unui dezvoltator pentru a asigura un cod ușor de întreținut este **funcția**.
+
+[![Metode și Funcții](https://img.youtube.com/vi/XgKsD6Zwvlc/0.jpg)](https://youtube.com/watch?v=XgKsD6Zwvlc "Metode și Funcții")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre metode și funcții.
+
+> Poți parcurge această lecție pe [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-functions/?WT.mc_id=academic-77807-sagibbon)!
+
+## Funcții
+
+În esență, o funcție este un bloc de cod pe care îl putem executa la cerere. Acest lucru este perfect pentru scenariile în care trebuie să efectuăm aceeași sarcină de mai multe ori; în loc să duplicăm logica în mai multe locuri (ceea ce ar face dificilă actualizarea ulterioară), o putem centraliza într-un singur loc și o putem apela ori de câte ori avem nevoie să efectuăm operația - poți chiar să apelezi funcții din alte funcții!
+
+La fel de importantă este și abilitatea de a da un nume unei funcții. Deși poate părea banal, numele oferă o modalitate rapidă de a documenta o secțiune de cod. Poți să te gândești la aceasta ca la o etichetă pe un buton. Dacă fac clic pe un buton pe care scrie „Anulează cronometrul”, știu că va opri ceasul.
+
+## Crearea și apelarea unei funcții
+
+Sintaxa pentru o funcție arată astfel:
+
+```javascript
+function nameOfFunction() { // function definition
+ // function definition/body
+}
+```
+
+Dacă aș vrea să creez o funcție pentru a afișa un mesaj de salut, ar putea arăta astfel:
+
+```javascript
+function displayGreeting() {
+  console.log('Hello, world!');
+}
+```
+
+Ori de câte ori vrem să apelăm (sau să invocăm) funcția noastră, folosim numele funcției urmat de `()`. Merită menționat faptul că funcția noastră poate fi definită înainte sau după ce decidem să o apelăm; compilatorul JavaScript o va găsi pentru tine.
+
+```javascript
+// calling our function
+displayGreeting();
+```
+
+> **NOTE:** Există un tip special de funcție cunoscut sub numele de **metodă**, pe care l-ai folosit deja! De fapt, am văzut acest lucru în demonstrația noastră de mai sus când am folosit `console.log`. Ceea ce face o metodă diferită de o funcție este faptul că o metodă este atașată unui obiect (`console` în exemplul nostru), în timp ce o funcție este independentă. Vei auzi mulți dezvoltatori folosind acești termeni interschimbabil.
+
+### Cele mai bune practici pentru funcții
+
+Există câteva bune practici de reținut atunci când creezi funcții:
+
+- Ca întotdeauna, folosește nume descriptive pentru a ști ce va face funcția.
+- Folosește **camelCasing** pentru a combina cuvintele.
+- Păstrează funcțiile concentrate pe o sarcină specifică.
+
+## Transmiterea informațiilor către o funcție
+
+Pentru a face o funcție mai reutilizabilă, vei dori adesea să îi transmiți informații. Dacă luăm în considerare exemplul nostru `displayGreeting` de mai sus, acesta va afișa doar **Hello, world!**. Nu este cea mai utilă funcție pe care ai putea să o creezi. Dacă vrem să o facem puțin mai flexibilă, cum ar fi să permitem cuiva să specifice numele persoanei pe care o salutăm, putem adăuga un **parametru**. Un parametru (numit uneori și **argument**) este o informație suplimentară trimisă unei funcții.
+
+Parametrii sunt listați în partea de definiție între paranteze și sunt separați prin virgulă astfel:
+
+```javascript
+function name(param, param2, param3) {
+
+}
+```
+
+Putem actualiza funcția `displayGreeting` pentru a accepta un nume și a-l afișa.
+
+```javascript
+function displayGreeting(name) {
+  const message = `Hello, ${name}!`;
+  console.log(message);
+}
+```
+
+Când vrem să apelăm funcția noastră și să transmitem parametrul, îl specificăm între paranteze.
+
+```javascript
+displayGreeting('Christopher');
+// displays "Hello, Christopher!" when run
+```
+
+## Valori implicite
+
+Putem face funcția noastră și mai flexibilă adăugând mai mulți parametri. Dar ce se întâmplă dacă nu vrem să fie necesar să specificăm fiecare valoare? Continuând cu exemplul nostru de salut, am putea lăsa numele ca fiind obligatoriu (avem nevoie să știm pe cine salutăm), dar vrem să permitem personalizarea salutului, dacă se dorește. Dacă cineva nu vrea să-l personalizeze, oferim o valoare implicită. Pentru a oferi o valoare implicită unui parametru, o setăm în același mod în care setăm o valoare pentru o variabilă - `parameterName = 'defaultValue'`. Pentru a vedea un exemplu complet:
+
+```javascript
+function displayGreeting(name, salutation='Hello') {
+  console.log(`${salutation}, ${name}`);
+}
+```
+
+Când apelăm funcția, putem decide dacă vrem să setăm o valoare pentru `salutation`.
+
+```javascript
+displayGreeting('Christopher');
+// displays "Hello, Christopher"
+
+displayGreeting('Christopher', 'Hi');
+// displays "Hi, Christopher"
+```
+
+## Valori returnate
+
+Până acum, funcția pe care am construit-o va afișa întotdeauna rezultatul în [consolă](https://developer.mozilla.org/docs/Web/API/console). Uneori, acest lucru poate fi exact ceea ce căutăm, mai ales când creăm funcții care vor apela alte servicii. Dar ce se întâmplă dacă vreau să creez o funcție ajutătoare pentru a efectua un calcul și să returnez valoarea astfel încât să o pot folosi în altă parte?
+
+Putem face acest lucru folosind o **valoare returnată**. O valoare returnată este oferită de funcție și poate fi stocată într-o variabilă la fel cum am putea stoca o valoare literală, cum ar fi un șir sau un număr.
+
+Dacă o funcție returnează ceva, atunci se folosește cuvântul cheie `return`. Cuvântul cheie `return` așteaptă o valoare sau o referință a ceea ce este returnat astfel:
+
+```javascript
+return myVariable;
+```  
+
+Am putea crea o funcție pentru a crea un mesaj de salut și a returna valoarea apelantului.
+
+```javascript
+function createGreetingMessage(name) {
+  const message = `Hello, ${name}`;
+  return message;
+}
+```
+
+Când apelăm această funcție, vom stoca valoarea într-o variabilă. Acest lucru este foarte asemănător cu modul în care am seta o variabilă la o valoare statică (cum ar fi `const name = 'Christopher'`).
+
+```javascript
+const greetingMessage = createGreetingMessage('Christopher');
+```
+
+## Funcții ca parametri pentru alte funcții
+
+Pe măsură ce avansezi în cariera ta de programator, vei întâlni funcții care acceptă alte funcții ca parametri. Acest truc interesant este utilizat frecvent atunci când nu știm când ceva se va întâmpla sau se va finaliza, dar știm că trebuie să efectuăm o operație ca răspuns.
+
+De exemplu, consideră [setTimeout](https://developer.mozilla.org/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout), care pornește un cronometru și va executa codul când acesta se finalizează. Trebuie să îi spunem ce cod vrem să executăm. Sună ca o sarcină perfectă pentru o funcție!
+
+Dacă rulezi codul de mai jos, după 3 secunde vei vedea mesajul **3 seconds has elapsed**.
+
+```javascript
+function displayDone() {
+  console.log('3 seconds has elapsed');
+}
+// timer value is in milliseconds
+setTimeout(displayDone, 3000);
+```
+
+### Funcții anonime
+
+Să analizăm din nou ceea ce am construit. Creăm o funcție cu un nume care va fi folosit o singură dată. Pe măsură ce aplicația noastră devine mai complexă, ne putem imagina creând multe funcții care vor fi apelate doar o dată. Acest lucru nu este ideal. După cum se dovedește, nu trebuie întotdeauna să oferim un nume!
+
+Când transmitem o funcție ca parametru, putem sări peste crearea uneia în avans și, în schimb, să o construim ca parte a parametrului. Folosim același cuvânt cheie `function`, dar o construim ca parametru.
+
+Să rescriem codul de mai sus pentru a folosi o funcție anonimă:
+
+```javascript
+setTimeout(function() {
+  console.log('3 seconds has elapsed');
+}, 3000);
+```
+
+Dacă rulezi noul nostru cod, vei observa că obținem aceleași rezultate. Am creat o funcție, dar nu a trebuit să îi dăm un nume!
+
+### Funcții săgeată (Fat arrow functions)
+
+Un scurtcircuit comun în multe limbaje de programare (inclusiv JavaScript) este abilitatea de a folosi ceea ce se numește o funcție **săgeată** sau **fat arrow**. Aceasta folosește un indicator special `=>`, care arată ca o săgeată - de aici și numele! Folosind `=>`, putem sărim peste cuvântul cheie `function`.
+
+Să rescriem codul nostru încă o dată pentru a folosi o funcție săgeată:
+
+```javascript
+setTimeout(() => {
+  console.log('3 seconds has elapsed');
+}, 3000);
+```
+
+### Când să folosești fiecare strategie
+
+Acum ai văzut că avem trei moduri de a transmite o funcție ca parametru și te-ai putea întreba când să folosești fiecare. Dacă știi că vei folosi funcția de mai multe ori, creeaz-o în mod normal. Dacă o vei folosi doar într-o singură locație, în general este mai bine să folosești o funcție anonimă. Dacă folosești o funcție săgeată sau sintaxa mai tradițională `function` depinde de tine, dar vei observa că majoritatea dezvoltatorilor moderni preferă `=>`.
+
+---
+
+## 🚀 Provocare
+
+Poți explica într-o singură propoziție diferența dintre funcții și metode? Încearcă!
+
+## Chestionar după curs
+[Chestionar după curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/10)
+
+## Recapitulare și studiu individual
+
+Merită să [citești mai multe despre funcțiile săgeată](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Functions/Arrow_functions), deoarece sunt din ce în ce mai utilizate în codurile moderne. Exersează scrierea unei funcții, apoi rescrie-o folosind această sintaxă.
+
+## Temă
+
+[Distracție cu Funcții](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/2-functions-methods/assignment.md b/translations/ro/2-js-basics/2-functions-methods/assignment.md
new file mode 100644
index 00000000..38067dd5
--- /dev/null
+++ b/translations/ro/2-js-basics/2-functions-methods/assignment.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8973f96157680a13e9446e4bb540ee57",
+  "translation_date": "2025-08-28T08:04:28+00:00",
+  "source_file": "2-js-basics/2-functions-methods/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Distracție cu Funcții
+
+## Instrucțiuni
+
+Creează diferite funcții, atât funcții care returnează ceva, cât și funcții care nu returnează nimic.
+
+Vezi dacă poți crea o funcție care să aibă un mix de parametri și parametri cu valori implicite.
+
+## Criterii de Evaluare
+
+| Criteriu | Exemplu                                                                                 | Adecvat                                                         | Necesită Îmbunătățiri |
+| -------- | --------------------------------------------------------------------------------------- | ---------------------------------------------------------------- | ---------------------- |
+|          | Soluția oferă două sau mai multe funcții bine realizate, cu parametri diverși          | Soluția funcționează cu o funcție și câțiva parametri           | Soluția conține erori |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/3-making-decisions/README.md b/translations/ro/2-js-basics/3-making-decisions/README.md
new file mode 100644
index 00000000..b1e8dea8
--- /dev/null
+++ b/translations/ro/2-js-basics/3-making-decisions/README.md
@@ -0,0 +1,232 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "888609c48329c280ca2477d2df40f2e5",
+  "translation_date": "2025-08-28T08:04:45+00:00",
+  "source_file": "2-js-basics/3-making-decisions/README.md",
+  "language_code": "ro"
+}
+-->
+# Noțiuni de bază JavaScript: Luarea deciziilor
+
+![Noțiuni de bază JavaScript - Luarea deciziilor](../../../../translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.ro.png)
+
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Test înainte de lecție
+
+[Test înainte de lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/11)
+
+Luarea deciziilor și controlul ordinii în care rulează codul tău fac ca acesta să fie reutilizabil și robust. Această secțiune acoperă sintaxa pentru controlul fluxului de date în JavaScript și semnificația sa atunci când este utilizată cu tipurile de date Boolean.
+
+[![Luarea deciziilor](https://img.youtube.com/vi/SxTp8j-fMMY/0.jpg)](https://youtube.com/watch?v=SxTp8j-fMMY "Luarea deciziilor")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre luarea deciziilor.
+
+> Poți parcurge această lecție pe [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-if-else/?WT.mc_id=academic-77807-sagibbon)!
+
+## O recapitulare scurtă despre Booleans
+
+Booleans pot avea doar două valori: `true` sau `false`. Booleans ajută la luarea deciziilor despre ce linii de cod ar trebui să ruleze atunci când anumite condiții sunt îndeplinite.
+
+Setează un boolean să fie true sau false astfel:
+
+`let myTrueBool = true`  
+`let myFalseBool = false`
+
+✅ Booleans sunt denumite după matematicianul, filosoful și logicianul englez George Boole (1815–1864).
+
+## Operatori de comparație și Booleans
+
+Operatorii sunt utilizați pentru a evalua condiții prin realizarea de comparații care vor genera o valoare Boolean. Mai jos este o listă de operatori frecvent utilizați.
+
+| Simbol | Descriere                                                                                                                                                   | Exemplu            |
+| ------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
+| `<`    | **Mai mic decât**: Compară două valori și returnează tipul de date Boolean `true` dacă valoarea din partea stângă este mai mică decât cea din dreapta        | `5 < 6 // true`    |
+| `<=`   | **Mai mic sau egal cu**: Compară două valori și returnează tipul de date Boolean `true` dacă valoarea din partea stângă este mai mică sau egală cu cea din dreapta | `5 <= 6 // true`   |
+| `>`    | **Mai mare decât**: Compară două valori și returnează tipul de date Boolean `true` dacă valoarea din partea stângă este mai mare decât cea din dreapta       | `5 > 6 // false`   |
+| `>=`   | **Mai mare sau egal cu**: Compară două valori și returnează tipul de date Boolean `true` dacă valoarea din partea stângă este mai mare sau egală cu cea din dreapta | `5 >= 6 // false`  |
+| `===`  | **Egalitate strictă**: Compară două valori și returnează tipul de date Boolean `true` dacă valorile din dreapta și stânga sunt egale ȘI sunt de același tip de date | `5 === 6 // false` |
+| `!==`  | **Inegalitate**: Compară două valori și returnează valoarea Boolean opusă celei pe care ar returna-o un operator de egalitate strictă                        | `5 !== 6 // true`  |
+
+✅ Verifică-ți cunoștințele scriind câteva comparații în consola browserului tău. Te surprinde vreun rezultat returnat?
+
+## Instrucțiunea If
+
+Instrucțiunea if va rula codul dintre blocurile sale dacă condiția este adevărată.
+
+```javascript
+if (condition) {
+  //Condition is true. Code in this block will run.
+}
+```
+
+Operatorii logici sunt adesea utilizați pentru a forma condiția.
+
+```javascript
+let currentMoney;
+let laptopPrice;
+
+if (currentMoney >= laptopPrice) {
+  //Condition is true. Code in this block will run.
+  console.log("Getting a new laptop!");
+}
+```
+
+## Instrucțiunea If..Else
+
+Instrucțiunea `else` va rula codul dintre blocurile sale atunci când condiția este falsă. Este opțională cu o instrucțiune `if`.
+
+```javascript
+let currentMoney;
+let laptopPrice;
+
+if (currentMoney >= laptopPrice) {
+  //Condition is true. Code in this block will run.
+  console.log("Getting a new laptop!");
+} else {
+  //Condition is false. Code in this block will run.
+  console.log("Can't afford a new laptop, yet!");
+}
+```
+
+✅ Testează-ți înțelegerea acestui cod și a codului următor rulându-l în consola browserului. Schimbă valorile variabilelor currentMoney și laptopPrice pentru a modifica rezultatul `console.log()`.
+
+## Instrucțiunea Switch
+
+Instrucțiunea `switch` este utilizată pentru a efectua acțiuni diferite pe baza unor condiții diferite. Folosește instrucțiunea `switch` pentru a selecta unul dintre mai multe blocuri de cod care urmează să fie executate.
+
+```javascript
+switch (expression) {
+  case x:
+    // code block
+    break;
+  case y:
+    // code block
+    break;
+  default:
+  // code block
+}
+```
+
+```javascript
+// program using switch statement
+let a = 2;
+
+switch (a) {
+  case 1:
+    a = "one";
+    break;
+  case 2:
+    a = "two";
+    break;
+  default:
+    a = "not found";
+    break;
+}
+console.log(`The value is ${a}`);
+```
+
+✅ Testează-ți înțelegerea acestui cod și a codului următor rulându-l în consola browserului. Schimbă valorile variabilei a pentru a modifica rezultatul `console.log()`.
+
+## Operatori logici și Booleans
+
+Deciziile pot necesita mai mult de o comparație și pot fi legate între ele cu operatori logici pentru a produce o valoare Boolean.
+
+| Simbol | Descriere                                                                                     | Exemplu                                                                 |
+| ------ | --------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- |
+| `&&`   | **Logic AND**: Compară două expresii Boolean. Returnează true **doar** dacă ambele părți sunt true | `(5 > 6) && (5 < 6 ) //O parte este falsă, cealaltă este adevărată. Returnează false` |
+| `\|\|` | **Logic OR**: Compară două expresii Boolean. Returnează true dacă cel puțin o parte este true     | `(5 > 6) \|\| (5 < 6) //O parte este falsă, cealaltă este adevărată. Returnează true` |
+| `!`    | **Logic NOT**: Returnează valoarea opusă unei expresii Boolean                                 | `!(5 > 6) // 5 nu este mai mare decât 6, dar "!" va returna true`       |
+
+## Condiții și decizii cu operatori logici
+
+Operatorii logici pot fi utilizați pentru a forma condiții în instrucțiuni if..else.
+
+```javascript
+let currentMoney;
+let laptopPrice;
+let laptopDiscountPrice = laptopPrice - laptopPrice * 0.2; //Laptop price at 20 percent off
+
+if (currentMoney >= laptopPrice || currentMoney >= laptopDiscountPrice) {
+  //Condition is true. Code in this block will run.
+  console.log("Getting a new laptop!");
+} else {
+  //Condition is true. Code in this block will run.
+  console.log("Can't afford a new laptop, yet!");
+}
+```
+
+### Operatorul de negație
+
+Până acum ai văzut cum poți folosi o instrucțiune `if...else` pentru a crea logică condițională. Orice intră într-un `if` trebuie să evalueze la true/false. Prin utilizarea operatorului `!` poți _nega_ expresia. Ar arăta astfel:
+
+```javascript
+if (!condition) {
+  // runs if condition is false
+} else {
+  // runs if condition is true
+}
+```
+
+### Expresii ternare
+
+`if...else` nu este singura modalitate de a exprima logica decizională. Poți folosi și ceva numit operator ternar. Sintaxa arată astfel:
+
+```javascript
+let variable = condition ? <return this if true> : <return this if false>
+```
+
+Mai jos este un exemplu mai concret:
+
+```javascript
+let firstNumber = 20;
+let secondNumber = 10;
+let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber;
+```
+
+✅ Ia un minut să citești acest cod de câteva ori. Înțelegi cum funcționează acești operatori?
+
+Codul de mai sus afirmă că:
+
+- dacă `firstNumber` este mai mare decât `secondNumber`
+- atunci atribuie `firstNumber` lui `biggestNumber`
+- altfel atribuie `secondNumber`.
+
+Expresia ternară este doar o modalitate compactă de a scrie codul de mai jos:
+
+```javascript
+let biggestNumber;
+if (firstNumber > secondNumber) {
+  biggestNumber = firstNumber;
+} else {
+  biggestNumber = secondNumber;
+}
+```
+
+---
+
+## 🚀 Provocare
+
+Creează un program care este scris mai întâi cu operatori logici, apoi rescrie-l folosind o expresie ternară. Care este sintaxa ta preferată?
+
+---
+
+## Test după lecție
+
+[Test după lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/12)
+
+## Recapitulare și studiu individual
+
+Citește mai multe despre numeroșii operatori disponibili utilizatorului [pe MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators).
+
+Parcurge minunatul [operator lookup](https://joshwcomeau.com/operator-lookup/) al lui Josh Comeau!
+
+## Temă
+
+[Operatori](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/3-making-decisions/assignment.md b/translations/ro/2-js-basics/3-making-decisions/assignment.md
new file mode 100644
index 00000000..0967d852
--- /dev/null
+++ b/translations/ro/2-js-basics/3-making-decisions/assignment.md
@@ -0,0 +1,54 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "bf62b82567e6f9bdf4abda9ae0ccb64a",
+  "translation_date": "2025-08-28T08:05:54+00:00",
+  "source_file": "2-js-basics/3-making-decisions/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Operatori
+
+## Instrucțiuni
+
+Experimentează cu operatorii. Iată o sugestie pentru un program pe care îl poți implementa:
+
+Ai un set de studenți din două sisteme de notare diferite.
+
+### Primul sistem de notare
+
+Un sistem de notare este definit prin note de la 1 la 5, unde 3 și mai sus înseamnă că ai trecut cursul.
+
+### Al doilea sistem de notare
+
+Celălalt sistem de notare are următoarele calificative: `A, A-, B, B-, C, C-`, unde `A` este calificativul maxim, iar `C` este cel mai mic calificativ care înseamnă trecerea.
+
+### Sarcina
+
+Având următorul array `allStudents` care reprezintă toți studenții și notele lor, construiește un nou array `studentsWhoPass` care să conțină toți studenții care au trecut.
+
+> TIP, folosește un for-loop, if...else și operatori de comparație:
+
+```javascript
+let allStudents = [
+  'A',
+  'B-',
+  1,
+  4,
+  5,
+  2
+]
+
+let studentsWhoPass = [];
+```
+
+## Criterii de evaluare
+
+| Criteriu | Exemplară                     | Adecvat                       | Necesită îmbunătățiri           |
+| -------- | ----------------------------- | ----------------------------- | ------------------------------- |
+|          | Soluția completă este prezentată | Soluția parțială este prezentată | Soluția prezentată conține erori |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/4-arrays-loops/README.md b/translations/ro/2-js-basics/4-arrays-loops/README.md
new file mode 100644
index 00000000..7c68cf8b
--- /dev/null
+++ b/translations/ro/2-js-basics/4-arrays-loops/README.md
@@ -0,0 +1,147 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3f7f87871312cf6cc12662da7d973182",
+  "translation_date": "2025-08-28T08:08:41+00:00",
+  "source_file": "2-js-basics/4-arrays-loops/README.md",
+  "language_code": "ro"
+}
+-->
+# Bazele JavaScript: Tablouri și Bucle
+
+![Bazele JavaScript - Tablouri](../../../../translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar înainte de curs
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/13)
+
+Această lecție acoperă elementele de bază ale JavaScript, limbajul care oferă interactivitate pe web. În această lecție, vei învăța despre tablouri și bucle, care sunt utilizate pentru a manipula datele.
+
+[![Tablouri](https://img.youtube.com/vi/1U4qTyq02Xw/0.jpg)](https://youtube.com/watch?v=1U4qTyq02Xw "Tablouri")
+
+[![Bucle](https://img.youtube.com/vi/Eeh7pxtTZ3k/0.jpg)](https://www.youtube.com/watch?v=Eeh7pxtTZ3k "Bucle")
+
+> 🎥 Fă clic pe imaginile de mai sus pentru videoclipuri despre tablouri și bucle.
+
+> Poți parcurge această lecție pe [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-arrays/?WT.mc_id=academic-77807-sagibbon)!
+
+## Tablouri
+
+Lucrul cu date este o sarcină comună în orice limbaj, iar aceasta devine mult mai ușoară atunci când datele sunt organizate într-un format structurat, cum ar fi tablourile. Cu tablourile, datele sunt stocate într-o structură similară unei liste. Un mare avantaj al tablourilor este că poți stoca diferite tipuri de date într-un singur tablou.
+
+✅ Tablourile sunt peste tot în jurul nostru! Poți să te gândești la un exemplu din viața reală al unui tablou, cum ar fi un ansamblu de panouri solare?
+
+Sintaxa pentru un tablou este o pereche de paranteze pătrate.
+
+```javascript
+let myArray = [];
+```
+
+Acesta este un tablou gol, dar tablourile pot fi declarate deja populate cu date. Valorile multiple dintr-un tablou sunt separate printr-o virgulă.
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+```
+
+Valorile din tablou primesc o valoare unică numită **index**, un număr întreg care este atribuit pe baza distanței față de începutul tabloului. În exemplul de mai sus, valoarea de tip șir "Chocolate" are indexul 0, iar indexul pentru "Rocky Road" este 4. Folosește indexul împreună cu parantezele pătrate pentru a prelua, schimba sau insera valori în tablou.
+
+✅ Te surprinde faptul că indexurile încep de la zero? În unele limbaje de programare, indexurile încep de la 1. Există o istorie interesantă în spatele acestui lucru, pe care o poți [citi pe Wikipedia](https://en.wikipedia.org/wiki/Zero-based_numbering).
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+iceCreamFlavors[2]; //"Vanilla"
+```
+
+Poți folosi indexul pentru a schimba o valoare, astfel:
+
+```javascript
+iceCreamFlavors[4] = "Butter Pecan"; //Changed "Rocky Road" to "Butter Pecan"
+```
+
+Și poți insera o valoare nouă la un anumit index astfel:
+
+```javascript
+iceCreamFlavors[5] = "Cookie Dough"; //Added "Cookie Dough"
+```
+
+✅ O metodă mai comună de a adăuga valori într-un tablou este utilizarea operatorilor de tablou, cum ar fi array.push().
+
+Pentru a afla câte elemente sunt într-un tablou, folosește proprietatea `length`.
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+iceCreamFlavors.length; //5
+```
+
+✅ Încearcă singur! Folosește consola browserului pentru a crea și manipula un tablou propriu.
+
+## Bucle
+
+Buclele ne permit să efectuăm sarcini repetitive sau **iterative** și pot economisi mult timp și cod. Fiecare iterație poate varia în ceea ce privește variabilele, valorile și condițiile. Există diferite tipuri de bucle în JavaScript, iar acestea au mici diferențe, dar în esență fac același lucru: parcurg datele.
+
+### Bucle For
+
+Buclele `for` necesită 3 părți pentru a itera:
+- `counter` O variabilă care este de obicei inițializată cu un număr ce contorizează numărul de iterații
+- `condition` O expresie care folosește operatori de comparație pentru a opri bucla atunci când devine `false`
+- `iteration-expression` Se execută la sfârșitul fiecărei iterații, de obicei folosită pentru a schimba valoarea contorului
+  
+```javascript
+// Counting up to 10
+for (let i = 0; i < 10; i++) {
+  console.log(i);
+}
+```
+
+✅ Rulează acest cod în consola browserului. Ce se întâmplă când faci mici modificări la contor, condiție sau expresia de iterație? Poți face să ruleze invers, creând un numărătoare inversă?
+
+### Bucle While
+
+Spre deosebire de sintaxa buclei `for`, buclele `while` necesită doar o condiție care va opri bucla atunci când condiția devine `false`. Condițiile din bucle se bazează de obicei pe alte valori, cum ar fi contoarele, și trebuie gestionate în timpul buclei. Valorile inițiale pentru contoare trebuie create în afara buclei, iar orice expresii pentru a îndeplini o condiție, inclusiv schimbarea contorului, trebuie menținute în interiorul buclei.
+
+```javascript
+//Counting up to 10
+let i = 0;
+while (i < 10) {
+ console.log(i);
+ i++;
+}
+```
+
+✅ De ce ai alege o buclă for în loc de o buclă while? 17.000 de utilizatori au avut aceeași întrebare pe StackOverflow, iar unele dintre opinii [ar putea fi interesante pentru tine](https://stackoverflow.com/questions/39969145/while-loops-vs-for-loops-in-javascript).
+
+## Bucle și Tablouri
+
+Tablourile sunt adesea utilizate împreună cu buclele, deoarece majoritatea condițiilor necesită lungimea tabloului pentru a opri bucla, iar indexul poate fi și valoarea contorului.
+
+```javascript
+let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
+
+for (let i = 0; i < iceCreamFlavors.length; i++) {
+  console.log(iceCreamFlavors[i]);
+} //Ends when all flavors are printed
+```
+
+✅ Experimentează cu parcurgerea unui tablou propriu în consola browserului.
+
+---
+
+## 🚀 Provocare
+
+Există și alte moduri de a parcurge tablourile, în afară de buclele for și while. Există [forEach](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach), [for-of](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/for...of) și [map](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array/map). Rescrie bucla tabloului tău folosind una dintre aceste tehnici.
+
+## Chestionar după curs
+[Chestionar după curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/14)
+
+## Recapitulare și Studiu Individual
+
+Tablourile în JavaScript au multe metode atașate, care sunt extrem de utile pentru manipularea datelor. [Citește despre aceste metode](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array) și încearcă câteva dintre ele (cum ar fi push, pop, slice și splice) pe un tablou creat de tine.
+
+## Temă
+
+[Parcurge un Tablou](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus utilizând serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să aveți în vedere că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/4-arrays-loops/assignment.md b/translations/ro/2-js-basics/4-arrays-loops/assignment.md
new file mode 100644
index 00000000..a5959df5
--- /dev/null
+++ b/translations/ro/2-js-basics/4-arrays-loops/assignment.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8b2381170bd0fd2870f5889bb8620f02",
+  "translation_date": "2025-08-28T08:09:41+00:00",
+  "source_file": "2-js-basics/4-arrays-loops/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Parcurge un Array
+
+## Instrucțiuni
+
+Creează un program care listează fiecare al 3-lea număr între 1-20 și îl afișează în consolă.
+
+> TIP: folosește un for-loop și modifică expresia de iterație
+
+## Criterii de evaluare
+
+| Criteriu | Exemplu                                  | Adecvat                  | Necesită îmbunătățiri          |
+| -------- | --------------------------------------- | ------------------------ | ------------------------------ |
+|          | Programul rulează corect și este comentat | Programul nu este comentat | Programul este incomplet sau are erori |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/2-js-basics/README.md b/translations/ro/2-js-basics/README.md
new file mode 100644
index 00000000..6fb3435b
--- /dev/null
+++ b/translations/ro/2-js-basics/README.md
@@ -0,0 +1,28 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "cc9e70a2f096c67389c8acff1521fc27",
+  "translation_date": "2025-08-28T08:02:45+00:00",
+  "source_file": "2-js-basics/README.md",
+  "language_code": "ro"
+}
+-->
+# Introducere în JavaScript
+
+JavaScript este limbajul web-ului. În aceste patru lecții, vei învăța elementele sale de bază.
+
+### Subiecte
+
+1. [Variabile și Tipuri de Date](1-data-types/README.md)
+2. [Funcții și Metode](2-functions-methods/README.md)
+3. [Luarea Deciziilor cu JavaScript](3-making-decisions/README.md)
+4. [Tablouri și Bucle](4-arrays-loops/README.md)
+
+### Credite
+
+Aceste lecții au fost scrise cu ♥️ de [Jasmine Greenaway](https://twitter.com/paladique), [Christopher Harrison](https://twitter.com/geektrainer) și [Chris Noring](https://twitter.com/chris_noring)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru acuratețe, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/1-intro-to-html/README.md b/translations/ro/3-terrarium/1-intro-to-html/README.md
new file mode 100644
index 00000000..5990a7a5
--- /dev/null
+++ b/translations/ro/3-terrarium/1-intro-to-html/README.md
@@ -0,0 +1,249 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "46a0639e719b9cf1dfd062aa24cad639",
+  "translation_date": "2025-08-28T08:11:36+00:00",
+  "source_file": "3-terrarium/1-intro-to-html/README.md",
+  "language_code": "ro"
+}
+-->
+# Proiect Terrarium Partea 1: Introducere în HTML
+
+![Introducere în HTML](../../../../translated_images/webdev101-html.4389c2067af68e98280c1bde52b6c6269f399eaae3659b7c846018d8a7b0bbd9.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Test înainte de lecție
+
+[Test înainte de lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/15)
+
+> Vizionați videoclipul
+
+> 
+> [![Videoclip despre bazele Git și GitHub](https://img.youtube.com/vi/1TvxJKBzhyQ/0.jpg)](https://www.youtube.com/watch?v=1TvxJKBzhyQ)
+
+### Introducere
+
+HTML, sau HyperText Markup Language, este „scheletul” web-ului. Dacă CSS „îmbracă” HTML-ul și JavaScript îi dă viață, HTML este corpul aplicației tale web. Sintaxa HTML reflectă chiar această idee, incluzând taguri precum „head”, „body” și „footer”.
+
+În această lecție, vom folosi HTML pentru a crea „scheletul” interfeței virtuale a terrariumului nostru. Va avea un titlu și trei coloane: o coloană dreaptă și una stângă unde vor fi plasate plantele care pot fi mutate, și o zonă centrală care va fi terrariumul propriu-zis, cu aspect de sticlă. Până la sfârșitul acestei lecții, vei putea vedea plantele în coloane, dar interfața va arăta puțin ciudat; nu te îngrijora, în secțiunea următoare vei adăuga stiluri CSS pentru a îmbunătăți aspectul interfeței.
+
+### Sarcină
+
+Pe computerul tău, creează un folder numit 'terrarium' și, în interiorul acestuia, un fișier numit 'index.html'. Poți face acest lucru în Visual Studio Code după ce creezi folderul terrarium, deschizând o fereastră nouă în VS Code, făcând clic pe 'open folder' și navigând la noul tău folder. Apasă pe butonul mic 'file' din panoul Explorer și creează noul fișier:
+
+![explorer în VS Code](../../../../translated_images/vs-code-index.e2986cf919471eb984a0afef231380c8b132b000635105f2397bd2754d1b689c.ro.png)
+
+Sau
+
+Folosește aceste comenzi în git bash:
+* `mkdir terrarium`
+* `cd terrarium`
+* `touch index.html`
+* `code index.html` sau `nano index.html`
+
+> Fișierele index.html indică unui browser că acesta este fișierul implicit dintr-un folder; URL-uri precum `https://anysite.com/test` ar putea fi construite folosind o structură de folder care include un folder numit `test` cu `index.html` în interior; `index.html` nu trebuie să apară în URL.
+
+---
+
+## DocType și tagurile html
+
+Prima linie a unui fișier HTML este doctype-ul său. Este puțin surprinzător că trebuie să ai această linie chiar în partea de sus a fișierului, dar aceasta spune browserelor mai vechi că pagina trebuie să fie redată în modul standard, conform specificației actuale HTML.
+
+> Sfat: în VS Code, poți trece cursorul peste un tag și obține informații despre utilizarea sa din ghidurile de referință MDN.
+
+A doua linie ar trebui să fie tagul de deschidere `<html>`, urmat imediat de tagul său de închidere `</html>`. Aceste taguri sunt elementele rădăcină ale interfeței tale.
+
+### Sarcină
+
+Adaugă aceste linii în partea de sus a fișierului tău `index.html`:
+
+```HTML
+<!DOCTYPE html>
+<html></html>
+```
+
+✅ Există câteva moduri diferite care pot fi determinate prin setarea DocType-ului cu un șir de interogare: [Modul Quirks și Modul Standard](https://developer.mozilla.org/docs/Web/HTML/Quirks_Mode_and_Standards_Mode). Aceste moduri erau folosite pentru a sprijini browsere foarte vechi care nu mai sunt utilizate în mod obișnuit (Netscape Navigator 4 și Internet Explorer 5). Poți rămâne la declarația standard a doctype-ului.
+
+---
+
+## 'Head'-ul documentului
+
+Zona 'head' a documentului HTML include informații esențiale despre pagina ta web, cunoscute și sub numele de [metadata](https://developer.mozilla.org/docs/Web/HTML/Element/meta). În cazul nostru, spunem serverului web către care va fi trimisă această pagină să fie redată următoarele patru lucruri:
+
+-   titlul paginii
+-   metadatele paginii, inclusiv:
+    -   'setul de caractere', care indică ce codificare de caractere este utilizată în pagină
+    -   informații despre browser, inclusiv `x-ua-compatible`, care indică faptul că browserul IE=edge este suportat
+    -   informații despre cum ar trebui să se comporte viewport-ul atunci când este încărcat. Setarea viewport-ului cu o scală inițială de 1 controlează nivelul de zoom atunci când pagina este încărcată pentru prima dată.
+
+### Sarcină
+
+Adaugă un bloc 'head' în documentul tău între tagurile de deschidere și închidere `<html>`.
+
+```html
+<head>
+	<title>Welcome to my Virtual Terrarium</title>
+	<meta charset="utf-8" />
+	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+	<meta name="viewport" content="width=device-width, initial-scale=1" />
+</head>
+```
+
+✅ Ce s-ar întâmpla dacă ai seta un tag meta pentru viewport astfel: `<meta name="viewport" content="width=600">`? Citește mai multe despre [viewport](https://developer.mozilla.org/docs/Web/HTML/Viewport_meta_tag).
+
+---
+
+## 'Body'-ul documentului
+
+### Taguri HTML
+
+În HTML, adaugi taguri în fișierul .html pentru a crea elemente ale unei pagini web. Fiecare tag are de obicei un tag de deschidere și unul de închidere, cum ar fi: `<p>hello</p>` pentru a indica un paragraf. Creează corpul interfeței tale adăugând un set de taguri `<body>` în interiorul perechii de taguri `<html>`; acum, markup-ul tău arată astfel:
+
+### Sarcină
+
+```html
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Welcome to my Virtual Terrarium</title>
+		<meta charset="utf-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+	</head>
+	<body></body>
+</html>
+```
+
+Acum poți începe să construiești pagina ta. De obicei, folosești taguri `<div>` pentru a crea elementele separate ale unei pagini. Vom crea o serie de elemente `<div>` care vor conține imagini.
+
+### Imagini
+
+Un tag HTML care nu necesită un tag de închidere este `<img>`, deoarece are un element `src` care conține toate informațiile necesare pentru ca pagina să redea elementul.
+
+Creează un folder în aplicația ta numit `images` și, în acesta, adaugă toate imaginile din [folderul sursă](../../../../3-terrarium/solution/images); (există 14 imagini cu plante).
+
+### Sarcină
+
+Adaugă acele imagini ale plantelor în două coloane între tagurile `<body></body>`:
+
+```html
+<div id="page">
+	<div id="left-container" class="container">
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant1" src="./images/plant1.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant2" src="./images/plant2.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant3" src="./images/plant3.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant4" src="./images/plant4.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant5" src="./images/plant5.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant6" src="./images/plant6.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant7" src="./images/plant7.png" />
+		</div>
+	</div>
+	<div id="right-container" class="container">
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant8" src="./images/plant8.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant9" src="./images/plant9.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant10" src="./images/plant10.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant11" src="./images/plant11.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant12" src="./images/plant12.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant13" src="./images/plant13.png" />
+		</div>
+		<div class="plant-holder">
+			<img class="plant" alt="plant" id="plant14" src="./images/plant14.png" />
+		</div>
+	</div>
+</div>
+```
+
+> Notă: Spans vs. Divs. Divs sunt considerate elemente 'block', iar Spans sunt 'inline'. Ce s-ar întâmpla dacă ai transforma aceste div-uri în span-uri?
+
+Cu acest markup, plantele apar acum pe ecran. Arată destul de rău, deoarece nu sunt încă stilizate folosind CSS, și vom face acest lucru în lecția următoare.
+
+Fiecare imagine are un text alternativ care va apărea chiar dacă nu poți vedea sau reda o imagine. Acesta este un atribut important de inclus pentru accesibilitate. Vei învăța mai multe despre accesibilitate în lecțiile viitoare; pentru moment, amintește-ți că atributul alt oferă informații alternative pentru o imagine dacă un utilizator, dintr-un motiv oarecare, nu o poate vizualiza (din cauza unei conexiuni lente, a unei erori în atributul src sau dacă utilizatorul folosește un cititor de ecran).
+
+✅ Ai observat că fiecare imagine are același tag alt? Este aceasta o practică bună? De ce sau de ce nu? Poți îmbunătăți acest cod?
+
+---
+
+## Markup semantic
+
+În general, este preferabil să folosești 'semantica' semnificativă atunci când scrii HTML. Ce înseamnă asta? Înseamnă să folosești taguri HTML pentru a reprezenta tipul de date sau interacțiune pentru care au fost concepute. De exemplu, textul principal al unui titlu pe o pagină ar trebui să folosească un tag `<h1>`.
+
+Adaugă următoarea linie chiar sub tagul de deschidere `<body>`:
+
+```html
+<h1>My Terrarium</h1>
+```
+
+Folosirea markup-ului semantic, cum ar fi utilizarea titlurilor `<h1>` și a listelor neordonate `<ul>`, ajută cititoarele de ecran să navigheze printr-o pagină. În general, butoanele ar trebui să fie scrise ca `<button>` și listele ca `<li>`. Deși este _posibil_ să folosești elemente `<span>` stilizate special cu gestionare de clicuri pentru a imita butoanele, este mai bine pentru utilizatorii cu dizabilități să folosească tehnologii pentru a determina unde se află un buton pe o pagină și să interacționeze cu acesta, dacă elementul apare ca un buton. Din acest motiv, încearcă să folosești markup semantic cât mai mult posibil.
+
+✅ Aruncă o privire la un cititor de ecran și [cum interacționează cu o pagină web](https://www.youtube.com/watch?v=OUDV1gqs9GA). Poți vedea de ce markup-ul nesemantic ar putea frustra utilizatorul?
+
+## Terrariumul
+
+Ultima parte a acestei interfețe implică crearea unui markup care va fi stilizat pentru a crea un terrarium.
+
+### Sarcină:
+
+Adaugă acest markup deasupra ultimului tag `</div>`:
+
+```html
+<div id="terrarium">
+	<div class="jar-top"></div>
+	<div class="jar-walls">
+		<div class="jar-glossy-long"></div>
+		<div class="jar-glossy-short"></div>
+	</div>
+	<div class="dirt"></div>
+	<div class="jar-bottom"></div>
+</div>
+```
+
+✅ Deși ai adăugat acest markup pe ecran, nu vezi absolut nimic redat. De ce?
+
+---
+
+## 🚀Provocare
+
+Există câteva taguri 'mai vechi' în HTML care sunt încă distractive de utilizat, deși nu ar trebui să folosești taguri depreciate precum [aceste taguri](https://developer.mozilla.org/docs/Web/HTML/Element#Obsolete_and_deprecated_elements) în markup-ul tău. Totuși, poți folosi vechiul tag `<marquee>` pentru a face titlul h1 să se deruleze orizontal? (dacă o faci, nu uita să-l elimini ulterior)
+
+## Test după lecție
+
+[Test după lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/16)
+
+## Recapitulare și studiu individual
+
+HTML este sistemul de construcție „testat și adevărat” care a ajutat la construirea web-ului așa cum îl cunoaștem astăzi. Învață puțin despre istoria sa studiind unele taguri vechi și noi. Poți să-ți dai seama de ce unele taguri au fost depreciate și altele adăugate? Ce taguri ar putea fi introduse în viitor?
+
+Află mai multe despre construirea site-urilor pentru web și dispozitive mobile la [Microsoft Learn](https://docs.microsoft.com/learn/modules/build-simple-website/?WT.mc_id=academic-77807-sagibbon).
+
+## Temă
+
+[Exersează HTML-ul: Construiește un mockup de blog](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/1-intro-to-html/assignment.md b/translations/ro/3-terrarium/1-intro-to-html/assignment.md
new file mode 100644
index 00000000..5be5b629
--- /dev/null
+++ b/translations/ro/3-terrarium/1-intro-to-html/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "970776c81401c9aacb34f365edac6b53",
+  "translation_date": "2025-08-28T08:12:59+00:00",
+  "source_file": "3-terrarium/1-intro-to-html/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Exersează-ți HTML-ul: Construiește un mockup pentru un blog
+
+## Instrucțiuni
+
+Imaginează-ți că proiectezi sau reproiectezi site-ul tău personal. Creează un mockup grafic al site-ului tău, apoi notează codul HTML pe care l-ai folosi pentru a construi diferitele elemente ale site-ului. Poți face acest lucru pe hârtie și să-l scanezi sau să folosești un software la alegerea ta, asigurându-te că scrii manual codul HTML.
+
+## Criterii de evaluare
+
+| Criterii | Exemplu                                                                            | Adecvat                                                                         | Necesită îmbunătățiri                                                             |
+| -------- | ---------------------------------------------------------------------------------- | -------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
+|          | Un layout de blog este reprezentat vizual cu cel puțin 10 elemente de markup afișate | Un layout de blog este reprezentat vizual cu aproximativ 5 elemente de markup afișate | Un layout de blog este reprezentat vizual cu cel mult 3 elemente de markup afișate |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/2-intro-to-css/README.md b/translations/ro/3-terrarium/2-intro-to-css/README.md
new file mode 100644
index 00000000..9b4caa1e
--- /dev/null
+++ b/translations/ro/3-terrarium/2-intro-to-css/README.md
@@ -0,0 +1,284 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e375c2aeb94e2407f2667633d39580bd",
+  "translation_date": "2025-08-28T08:13:38+00:00",
+  "source_file": "3-terrarium/2-intro-to-css/README.md",
+  "language_code": "ro"
+}
+-->
+# Proiect Terrarium Partea 2: Introducere în CSS
+
+![Introducere în CSS](../../../../translated_images/webdev101-css.3f7af5991bf53a200d79e7257e5e450408d8ea97f5b531d31b2e3976317338ee.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar înainte de lecție
+
+[Chestionar înainte de lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/17)
+
+### Introducere
+
+CSS, sau Cascading Style Sheets, rezolvă o problemă importantă în dezvoltarea web: cum să faci ca site-ul tău să arate bine. Stilizarea aplicațiilor le face mai ușor de utilizat și mai plăcute vizual; de asemenea, poți folosi CSS pentru a crea Design Web Responsiv (RWD) - permițând aplicațiilor tale să arate bine indiferent de dimensiunea ecranului pe care sunt afișate. CSS nu este doar despre aspect; specificațiile sale includ animații și transformări care pot permite interacțiuni sofisticate pentru aplicațiile tale. Grupul de lucru CSS ajută la menținerea specificațiilor CSS actuale; poți urmări activitatea lor pe [site-ul World Wide Web Consortium](https://www.w3.org/Style/CSS/members).
+
+> Notă: CSS este un limbaj care evoluează, la fel ca tot ce ține de web, și nu toate browserele suportă cele mai noi părți ale specificației. Verifică întotdeauna implementările consultând [CanIUse.com](https://caniuse.com).
+
+În această lecție, vom adăuga stiluri la terrarium-ul nostru online și vom învăța mai multe despre câteva concepte CSS: cascada, moștenirea, utilizarea selectorilor, poziționarea și utilizarea CSS pentru a construi layout-uri. În proces, vom crea layout-ul terrarium-ului și vom construi efectiv terrarium-ul.
+
+### Prerechizite
+
+Ar trebui să ai HTML-ul pentru terrarium-ul tău construit și pregătit pentru a fi stilizat.
+
+> Vezi videoclipul
+
+> 
+> [![Videoclip despre bazele Git și GitHub](https://img.youtube.com/vi/6yIdOIV9p1I/0.jpg)](https://www.youtube.com/watch?v=6yIdOIV9p1I)
+
+### Sarcină
+
+În folderul terrarium-ului tău, creează un fișier nou numit `style.css`. Importă acel fișier în secțiunea `<head>`:
+
+```html
+<link rel="stylesheet" href="./style.css" />
+```
+
+---
+
+## Cascada
+
+Cascading Style Sheets încorporează ideea că stilurile "cascadă", astfel încât aplicarea unui stil este ghidată de prioritatea sa. Stilurile setate de un autor de site web au prioritate față de cele setate de un browser. Stilurile setate "inline" au prioritate față de cele setate într-un fișier de stil extern.
+
+### Sarcină
+
+Adaugă stilul inline "color: red" la tag-ul `<h1>`:
+
+```HTML
+<h1 style="color: red">My Terrarium</h1>
+```
+
+Apoi, adaugă următorul cod în fișierul tău `style.css`:
+
+```CSS
+h1 {
+ color: blue;
+}
+```
+
+✅ Ce culoare se afișează în aplicația ta web? De ce? Poți găsi o modalitate de a suprascrie stilurile? Când ai vrea să faci acest lucru sau de ce nu?
+
+---
+
+## Moștenirea
+
+Stilurile sunt moștenite de la un stil al unui strămoș la un descendent, astfel încât elementele imbricate moștenesc stilurile părinților lor.
+
+### Sarcină
+
+Setează fontul corpului la un font dat și verifică fontul unui element imbricat:
+
+```CSS
+body {
+	font-family: helvetica, arial, sans-serif;
+}
+```
+
+Deschide consola browserului la tab-ul 'Elements' și observă fontul H1. Acesta moștenește fontul de la corp, așa cum este indicat în browser:
+
+![font moștenit](../../../../translated_images/1.cc07a5cbe114ad1d4728c35134584ac1b87db688eff83cf75985cf31fe0ed95c.ro.png)
+
+✅ Poți face ca un stil imbricat să moștenească o proprietate diferită?
+
+---
+
+## Selectori CSS
+
+### Tag-uri
+
+Până acum, fișierul tău `style.css` are doar câteva tag-uri stilizate, iar aplicația arată destul de ciudat:
+
+```CSS
+body {
+	font-family: helvetica, arial, sans-serif;
+}
+
+h1 {
+	color: #3a241d;
+	text-align: center;
+}
+```
+
+Acest mod de a stiliza un tag îți oferă control asupra elementelor unice, dar ai nevoie să controlezi stilurile multor plante din terrarium-ul tău. Pentru a face acest lucru, trebuie să folosești selectorii CSS.
+
+### Id-uri
+
+Adaugă un stil pentru a aranja containerele din stânga și dreapta. Deoarece există doar un container stânga și doar un container dreapta, acestea au id-uri în markup. Pentru a le stiliza, folosește `#`:
+
+```CSS
+#left-container {
+	background-color: #eee;
+	width: 15%;
+	left: 0px;
+	top: 0px;
+	position: absolute;
+	height: 100%;
+	padding: 10px;
+}
+
+#right-container {
+	background-color: #eee;
+	width: 15%;
+	right: 0px;
+	top: 0px;
+	position: absolute;
+	height: 100%;
+	padding: 10px;
+}
+```
+
+Aici, ai plasat aceste containere cu poziționare absolută la extremitățile stânga și dreapta ale ecranului și ai folosit procente pentru lățimea lor, astfel încât să se poată adapta la ecrane mici de mobil.
+
+✅ Acest cod este destul de repetitiv, deci nu este "DRY" (Don't Repeat Yourself); poți găsi o modalitate mai bună de a stiliza aceste id-uri, poate cu un id și o clasă? Ar trebui să schimbi markup-ul și să refactorizezi CSS-ul:
+
+```html
+<div id="left-container" class="container"></div>
+```
+
+### Clase
+
+În exemplul de mai sus, ai stilizat două elemente unice pe ecran. Dacă vrei ca stilurile să se aplice la mai multe elemente pe ecran, poți folosi clase CSS. Fă acest lucru pentru a aranja plantele în containerele din stânga și dreapta.
+
+Observă că fiecare plantă din markup-ul HTML are o combinație de id-uri și clase. Id-urile aici sunt folosite de JavaScript-ul pe care îl vei adăuga mai târziu pentru a manipula plasarea plantelor în terrarium. Clasele, însă, oferă tuturor plantelor un stil dat.
+
+```html
+<div class="plant-holder">
+	<img class="plant" alt="plant" id="plant1" src="./images/plant1.png" />
+</div>
+```
+
+Adaugă următorul cod în fișierul tău `style.css`:
+
+```CSS
+.plant-holder {
+	position: relative;
+	height: 13%;
+	left: -10px;
+}
+
+.plant {
+	position: absolute;
+	max-width: 150%;
+	max-height: 150%;
+	z-index: 2;
+}
+```
+
+Notabil în acest fragment este amestecul de poziționare relativă și absolută, pe care îl vom acoperi în secțiunea următoare. Uită-te la modul în care înălțimile sunt gestionate prin procente:
+
+Ai setat înălțimea suportului pentru plante la 13%, un număr bun pentru a te asigura că toate plantele sunt afișate în fiecare container vertical fără a fi nevoie de derulare.
+
+Ai setat suportul pentru plante să se deplaseze spre stânga pentru a permite plantelor să fie mai centrate în containerul lor. Imaginile au o cantitate mare de fundal transparent pentru a le face mai ușor de mutat, așa că trebuie să fie împinse spre stânga pentru a se potrivi mai bine pe ecran.
+
+Apoi, planta în sine are o lățime maximă de 150%. Acest lucru îi permite să se micșoreze pe măsură ce browserul se micșorează. Încearcă să redimensionezi browserul; plantele rămân în containerele lor, dar se micșorează pentru a se potrivi.
+
+De asemenea, este notabilă utilizarea z-index, care controlează altitudinea relativă a unui element (astfel încât plantele să stea deasupra containerului și să pară că sunt în interiorul terrarium-ului).
+
+✅ De ce ai nevoie de un selector CSS pentru suportul plantei și unul pentru plantă?
+
+## Poziționarea CSS
+
+Amestecarea proprietăților de poziționare (există poziții statice, relative, fixe, absolute și sticky) poate fi puțin complicată, dar atunci când este făcută corect îți oferă un control bun asupra elementelor de pe paginile tale.
+
+Elementele poziționate absolut sunt poziționate relativ față de cei mai apropiați strămoși poziționați, iar dacă nu există niciunul, sunt poziționate conform corpului documentului.
+
+Elementele poziționate relativ sunt poziționate pe baza direcțiilor CSS pentru a-și ajusta plasarea față de poziția lor inițială.
+
+În exemplul nostru, `plant-holder` este un element poziționat relativ care este poziționat în interiorul unui container poziționat absolut. Comportamentul rezultat este că barele laterale sunt fixate la stânga și dreapta, iar `plant-holder` este imbricat, ajustându-se în interiorul barelor laterale, oferind spațiu pentru ca plantele să fie plasate într-un rând vertical.
+
+> Planta în sine are, de asemenea, poziționare absolută, necesară pentru a o face mutabilă, așa cum vei descoperi în lecția următoare.
+
+✅ Experimentează cu schimbarea tipurilor de poziționare ale containerelor laterale și ale `plant-holder`. Ce se întâmplă?
+
+## Layout-uri CSS
+
+Acum vei folosi ceea ce ai învățat pentru a construi terrarium-ul, totul folosind CSS!
+
+Mai întâi, stilizează copiii div-ului `.terrarium` ca un dreptunghi rotunjit folosind CSS:
+
+```CSS
+.jar-walls {
+	height: 80%;
+	width: 60%;
+	background: #d1e1df;
+	border-radius: 1rem;
+	position: absolute;
+	bottom: 0.5%;
+	left: 20%;
+	opacity: 0.5;
+	z-index: 1;
+}
+
+.jar-top {
+	width: 50%;
+	height: 5%;
+	background: #d1e1df;
+	position: absolute;
+	bottom: 80.5%;
+	left: 25%;
+	opacity: 0.7;
+	z-index: 1;
+}
+
+.jar-bottom {
+	width: 50%;
+	height: 1%;
+	background: #d1e1df;
+	position: absolute;
+	bottom: 0%;
+	left: 25%;
+	opacity: 0.7;
+}
+
+.dirt {
+	width: 60%;
+	height: 5%;
+	background: #3a241d;
+	position: absolute;
+	border-radius: 0 0 1rem 1rem;
+	bottom: 1%;
+	left: 20%;
+	opacity: 0.7;
+	z-index: -1;
+}
+```
+
+Observă utilizarea procentelor aici. Dacă micșorezi browserul, poți vedea cum borcanul se adaptează. De asemenea, observă procentele pentru lățimile și înălțimile elementelor borcanului și cum fiecare element este poziționat absolut în centru, fixat la partea de jos a viewport-ului.
+
+Folosim și `rem` pentru border-radius, o lungime relativă la font. Citește mai multe despre acest tip de măsurare relativă în [specificația CSS](https://www.w3.org/TR/css-values-3/#font-relative-lengths).
+
+✅ Încearcă să schimbi culorile borcanului și opacitatea față de cele ale pământului. Ce se întâmplă? De ce?
+
+---
+
+## 🚀Provocare
+
+Adaugă o strălucire de tip "bulă" în zona din stânga jos a borcanului pentru a-l face să arate mai asemănător cu sticla. Vei stiliza `.jar-glossy-long` și `.jar-glossy-short` pentru a arăta ca o strălucire reflectată. Iată cum ar arăta:
+
+![terrarium finalizat](../../../../translated_images/terrarium-final.2f07047ffc597d0a06b06cab28a77801a10dd12fdb6c7fc630e9c40665491c53.ro.png)
+
+Pentru a finaliza chestionarul post-lecție, parcurge acest modul Learn: [Stilizează aplicația HTML cu CSS](https://docs.microsoft.com/learn/modules/build-simple-website/4-css-basics/?WT.mc_id=academic-77807-sagibbon)
+
+## Chestionar post-lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/18)
+
+## Recapitulare și studiu individual
+
+CSS pare înșelător de simplu, dar există multe provocări atunci când încerci să stilizezi o aplicație perfect pentru toate browserele și toate dimensiunile ecranului. CSS-Grid și Flexbox sunt instrumente care au fost dezvoltate pentru a face munca puțin mai structurată și mai fiabilă. Învață despre aceste instrumente jucând [Flexbox Froggy](https://flexboxfroggy.com/) și [Grid Garden](https://codepip.com/games/grid-garden/).
+
+## Temă
+
+[Refactorizare CSS](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/2-intro-to-css/assignment.md b/translations/ro/3-terrarium/2-intro-to-css/assignment.md
new file mode 100644
index 00000000..9eef7727
--- /dev/null
+++ b/translations/ro/3-terrarium/2-intro-to-css/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9d4d75af51aaccfe9af778f792c62919",
+  "translation_date": "2025-08-28T08:15:28+00:00",
+  "source_file": "3-terrarium/2-intro-to-css/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Refactorizarea CSS
+
+## Instrucțiuni
+
+Restilizează terariul folosind fie Flexbox, fie CSS Grid și fă capturi de ecran pentru a demonstra că l-ai testat pe mai multe browsere. Este posibil să fie nevoie să modifici structura HTML, așa că creează o nouă versiune a aplicației cu arta în loc pentru refactorizare. Nu te preocupa de faptul că elementele trebuie să fie deplasabile; pentru moment, refactorizează doar HTML-ul și CSS-ul.
+
+## Criterii de evaluare
+
+| Criteriu | Exemplară                                                         | Adecvat                       | Necesită îmbunătățiri                |
+| -------- | ----------------------------------------------------------------- | ----------------------------- | ------------------------------------ |
+|          | Prezintă un terariu complet restilizat folosind Flexbox sau CSS Grid | Restilizează câteva elemente  | Nu reușește să restilizeze terariul deloc |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea realizată de un profesionist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/3-intro-to-DOM-and-closures/README.md b/translations/ro/3-terrarium/3-intro-to-DOM-and-closures/README.md
new file mode 100644
index 00000000..07f706f8
--- /dev/null
+++ b/translations/ro/3-terrarium/3-intro-to-DOM-and-closures/README.md
@@ -0,0 +1,230 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "30f8903a1f290e3d438dc2c70fe60259",
+  "translation_date": "2025-08-28T08:15:48+00:00",
+  "source_file": "3-terrarium/3-intro-to-DOM-and-closures/README.md",
+  "language_code": "ro"
+}
+-->
+# Proiect Terrarium Partea 3: Manipularea DOM-ului și o Închidere
+
+![DOM și o închidere](../../../../translated_images/webdev101-js.10280393044d7eaaec7e847574946add7ddae6be2b2194567d848b61d849334a.ro.png)
+> Sketchnote de [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/19)
+
+### Introducere
+
+Manipularea DOM-ului, sau "Document Object Model", este un aspect cheie al dezvoltării web. Conform [MDN](https://developer.mozilla.org/docs/Web/API/Document_Object_Model/Introduction), "Document Object Model (DOM) este reprezentarea datelor obiectelor care alcătuiesc structura și conținutul unui document pe web." Provocările legate de manipularea DOM-ului pe web au fost adesea motivul utilizării framework-urilor JavaScript în locul JavaScript-ului simplu pentru gestionarea DOM-ului, dar ne vom descurca singuri!
+
+În plus, această lecție va introduce ideea unei [închideri JavaScript](https://developer.mozilla.org/docs/Web/JavaScript/Closures), pe care o puteți considera ca o funcție închisă de o altă funcție, astfel încât funcția interioară să aibă acces la domeniul funcției exterioare.
+
+> Închiderile JavaScript sunt un subiect vast și complex. Această lecție abordează cea mai simplă idee: în codul acestui terrarium, veți găsi o închidere: o funcție interioară și o funcție exterioară construite astfel încât funcția interioară să aibă acces la domeniul funcției exterioare. Pentru mult mai multe informații despre cum funcționează acest lucru, vizitați [documentația extinsă](https://developer.mozilla.org/docs/Web/JavaScript/Closures).
+
+Vom folosi o închidere pentru a manipula DOM-ul.
+
+Gândiți-vă la DOM ca la un arbore, care reprezintă toate modurile în care un document de pagină web poate fi manipulat. Diverse API-uri (Interfețe de Programare a Aplicațiilor) au fost scrise astfel încât programatorii, folosind limbajul de programare preferat, să poată accesa DOM-ul și să-l editeze, schimbe, rearanjeze și să-l gestioneze în alte moduri.
+
+![Reprezentarea arborelui DOM](../../../../translated_images/dom-tree.7daf0e763cbbba9273f9a66fe04c98276d7d23932309b195cb273a9cf1819b42.ro.png)
+
+> O reprezentare a DOM-ului și a marcajului HTML care îl referențiază. De la [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites)
+
+În această lecție, vom finaliza proiectul nostru interactiv de terrarium prin crearea JavaScript-ului care va permite utilizatorului să manipuleze plantele de pe pagină.
+
+### Prerechizite
+
+Ar trebui să aveți HTML-ul și CSS-ul pentru terrarium-ul vostru construite. Până la sfârșitul acestei lecții, veți putea muta plantele în și din terrarium prin tragere.
+
+### Sarcină
+
+În folderul terrarium, creați un fișier nou numit `script.js`. Importați acel fișier în secțiunea `<head>`:
+
+```html
+	<script src="./script.js" defer></script>
+```
+
+> Notă: folosiți `defer` atunci când importați un fișier JavaScript extern în fișierul HTML pentru a permite executarea JavaScript-ului doar după ce fișierul HTML a fost complet încărcat. De asemenea, puteți folosi atributul `async`, care permite scriptului să se execute în timp ce fișierul HTML este analizat, dar în cazul nostru, este important ca elementele HTML să fie complet disponibile pentru tragere înainte de a permite executarea scriptului de tragere.
+---
+
+## Elementele DOM
+
+Primul lucru pe care trebuie să-l faceți este să creați referințe la elementele pe care doriți să le manipulați în DOM. În cazul nostru, acestea sunt cele 14 plante care așteaptă în barele laterale.
+
+### Sarcină
+
+```html
+dragElement(document.getElementById('plant1'));
+dragElement(document.getElementById('plant2'));
+dragElement(document.getElementById('plant3'));
+dragElement(document.getElementById('plant4'));
+dragElement(document.getElementById('plant5'));
+dragElement(document.getElementById('plant6'));
+dragElement(document.getElementById('plant7'));
+dragElement(document.getElementById('plant8'));
+dragElement(document.getElementById('plant9'));
+dragElement(document.getElementById('plant10'));
+dragElement(document.getElementById('plant11'));
+dragElement(document.getElementById('plant12'));
+dragElement(document.getElementById('plant13'));
+dragElement(document.getElementById('plant14'));
+```
+
+Ce se întâmplă aici? Referențiați documentul și căutați în DOM-ul său pentru a găsi un element cu un anumit Id. Amintiți-vă că în prima lecție despre HTML ați dat Id-uri individuale fiecărei imagini de plantă (`id="plant1"`)? Acum veți folosi acel efort. După identificarea fiecărui element, transmiteți acel element unei funcții numite `dragElement` pe care o veți construi în curând. Astfel, elementul din HTML este acum activat pentru tragere, sau va fi în curând.
+
+✅ De ce referențiem elementele prin Id? De ce nu prin clasa CSS? Puteți consulta lecția anterioară despre CSS pentru a răspunde la această întrebare.
+
+---
+
+## Închiderea
+
+Acum sunteți gata să creați închiderea `dragElement`, care este o funcție exterioară ce închide o funcție interioară sau funcții (în cazul nostru, vom avea trei).
+
+Închiderile sunt utile atunci când una sau mai multe funcții trebuie să acceseze domeniul funcției exterioare. Iată un exemplu:
+
+```javascript
+function displayCandy(){
+	let candy = ['jellybeans'];
+	function addCandy(candyType) {
+		candy.push(candyType)
+	}
+	addCandy('gumdrops');
+}
+displayCandy();
+console.log(candy)
+```
+
+În acest exemplu, funcția displayCandy înconjoară o funcție care adaugă un nou tip de bomboană într-un array care există deja în funcție. Dacă ați rula acest cod, array-ul `candy` ar fi nedefinit, deoarece este o variabilă locală (locală pentru închidere).
+
+✅ Cum puteți face array-ul `candy` accesibil? Încercați să-l mutați în afara închiderii. În acest fel, array-ul devine global, în loc să rămână disponibil doar pentru domeniul local al închiderii.
+
+### Sarcină
+
+Sub declarațiile elementelor din `script.js`, creați o funcție:
+
+```javascript
+function dragElement(terrariumElement) {
+	//set 4 positions for positioning on the screen
+	let pos1 = 0,
+		pos2 = 0,
+		pos3 = 0,
+		pos4 = 0;
+	terrariumElement.onpointerdown = pointerDrag;
+}
+```
+
+`dragElement` primește obiectul său `terrariumElement` din declarațiile de la începutul scriptului. Apoi, setați câteva poziții locale la `0` pentru obiectul transmis funcției. Acestea sunt variabilele locale care vor fi manipulate pentru fiecare element pe măsură ce adăugați funcționalitatea de tragere și plasare în închidere pentru fiecare element. Terrarium-ul va fi populat de aceste elemente trase, astfel încât aplicația trebuie să țină evidența locului unde sunt plasate.
+
+În plus, elementul terrarium transmis acestei funcții este atribuit unui eveniment `pointerdown`, care face parte din [web APIs](https://developer.mozilla.org/docs/Web/API) concepute pentru a ajuta la gestionarea DOM-ului. `onpointerdown` se declanșează atunci când un buton este apăsat sau, în cazul nostru, un element care poate fi tras este atins. Acest handler de evenimente funcționează atât pe [navigatoare web cât și mobile](https://caniuse.com/?search=onpointerdown), cu câteva excepții.
+
+✅ [Handler-ul de evenimente `onclick`](https://developer.mozilla.org/docs/Web/API/GlobalEventHandlers/onclick) are mult mai mult suport cross-browser; de ce nu l-ați folosi aici? Gândiți-vă la tipul exact de interacțiune pe ecran pe care încercați să o creați aici.
+
+---
+
+## Funcția Pointerdrag
+
+Elementul `terrariumElement` este gata să fie tras; când evenimentul `onpointerdown` este declanșat, funcția `pointerDrag` este invocată. Adăugați acea funcție chiar sub această linie: `terrariumElement.onpointerdown = pointerDrag;`:
+
+### Sarcină 
+
+```javascript
+function pointerDrag(e) {
+	e.preventDefault();
+	console.log(e);
+	pos3 = e.clientX;
+	pos4 = e.clientY;
+}
+```
+
+Se întâmplă mai multe lucruri. Mai întâi, preveniți evenimentele implicite care se întâmplă în mod normal la pointerdown folosind `e.preventDefault();`. În acest fel aveți mai mult control asupra comportamentului interfeței.
+
+> Reveniți la această linie după ce ați construit complet fișierul script și încercați fără `e.preventDefault()` - ce se întâmplă?
+
+În al doilea rând, deschideți `index.html` într-o fereastră de browser și inspectați interfața. Când faceți clic pe o plantă, puteți vedea cum evenimentul 'e' este capturat. Explorați evenimentul pentru a vedea cât de multe informații sunt colectate de un singur eveniment pointer down!  
+
+Apoi, observați cum variabilele locale `pos3` și `pos4` sunt setate la e.clientX. Puteți găsi valorile `e` în panoul de inspecție. Aceste valori capturează coordonatele x și y ale plantei în momentul în care faceți clic pe ea sau o atingeți. Veți avea nevoie de un control fin asupra comportamentului plantelor pe măsură ce faceți clic și le trageți, astfel încât să țineți evidența coordonatelor lor.
+
+✅ Devine mai clar de ce această aplicație este construită cu o închidere mare? Dacă nu ar fi, cum ați menține domeniul pentru fiecare dintre cele 14 plante care pot fi trase?
+
+Completați funcția inițială adăugând două manipulări suplimentare ale evenimentelor pointer sub `pos4 = e.clientY`:
+
+```html
+document.onpointermove = elementDrag;
+document.onpointerup = stopElementDrag;
+```
+Acum indicați că doriți ca planta să fie trasă împreună cu pointerul pe măsură ce o mutați și ca gestul de tragere să se oprească atunci când deselectați planta. `onpointermove` și `onpointerup` fac parte din același API ca `onpointerdown`. Interfața va arunca erori acum, deoarece nu ați definit încă funcțiile `elementDrag` și `stopElementDrag`, așa că construiți-le în continuare.
+
+## Funcțiile elementDrag și stopElementDrag
+
+Veți completa închiderea adăugând două funcții interne suplimentare care vor gestiona ce se întâmplă atunci când trageți o plantă și opriți tragerea acesteia. Comportamentul dorit este ca să puteți trage orice plantă în orice moment și să o plasați oriunde pe ecran. Această interfață este destul de neimpusă (nu există o zonă de plasare, de exemplu) pentru a vă permite să proiectați terrarium-ul exact așa cum doriți, adăugând, eliminând și repoziționând plantele.
+
+### Sarcină
+
+Adăugați funcția `elementDrag` imediat după acolada de închidere a `pointerDrag`:
+
+```javascript
+function elementDrag(e) {
+	pos1 = pos3 - e.clientX;
+	pos2 = pos4 - e.clientY;
+	pos3 = e.clientX;
+	pos4 = e.clientY;
+	console.log(pos1, pos2, pos3, pos4);
+	terrariumElement.style.top = terrariumElement.offsetTop - pos2 + 'px';
+	terrariumElement.style.left = terrariumElement.offsetLeft - pos1 + 'px';
+}
+```
+În această funcție, faceți multe modificări ale pozițiilor inițiale 1-4 pe care le-ați setat ca variabile locale în funcția exterioară. Ce se întâmplă aici?
+
+Pe măsură ce trageți, reasignați `pos1` făcându-l egal cu `pos3` (pe care l-ați setat anterior ca `e.clientX`) minus valoarea curentă `e.clientX`. Faceți o operație similară pentru `pos2`. Apoi, resetați `pos3` și `pos4` la noile coordonate X și Y ale elementului. Puteți urmări aceste modificări în consolă pe măsură ce trageți. Apoi, manipulați stilul css al plantei pentru a seta poziția sa nouă pe baza noilor poziții ale `pos1` și `pos2`, calculând coordonatele X și Y ale plantei pe baza comparării offset-ului său cu aceste poziții noi.
+
+> `offsetTop` și `offsetLeft` sunt proprietăți CSS care setează poziția unui element pe baza poziției părintelui său; părintele său poate fi orice element care nu este poziționat ca `static`. 
+
+Toate aceste recalculări ale poziționării vă permit să ajustați fin comportamentul terrarium-ului și al plantelor sale.
+
+### Sarcină 
+
+Ultima sarcină pentru a completa interfața este să adăugați funcția `stopElementDrag` după acolada de închidere a `elementDrag`:
+
+```javascript
+function stopElementDrag() {
+	document.onpointerup = null;
+	document.onpointermove = null;
+}
+```
+
+Această funcție mică resetează evenimentele `onpointerup` și `onpointermove`, astfel încât să puteți relua progresul plantei începând să o trageți din nou sau să începeți să trageți o plantă nouă.
+
+✅ Ce se întâmplă dacă nu setați aceste evenimente la null?
+
+Acum ați finalizat proiectul!
+
+🥇Felicitări! Ați terminat terrarium-ul vostru frumos! ![terrarium finalizat](../../../../translated_images/terrarium-final.0920f16e87c13a84cd2b553a5af9a3ad1cffbd41fbf8ce715d9e9c43809a5e2c.ro.png)
+
+---
+
+## 🚀Provocare
+
+Adăugați un nou handler de evenimente în închiderea voastră pentru a face ceva suplimentar cu plantele; de exemplu, faceți dublu clic pe o plantă pentru a o aduce în față. Fiți creativi!
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/20)
+
+## Recapitulare & Studiu Individual
+
+Deși tragerea elementelor pe ecran pare trivială, există multe moduri de a face acest lucru și multe capcane, în funcție de efectul pe care îl căutați. De fapt, există un întreg [API de tragere și plasare](https://developer.mozilla.org/docs/Web/API/HTML_Drag_and_Drop_API) pe care îl puteți încerca. Nu l-am folosit în acest modul deoarece efectul dorit era oarecum diferit, dar încercați acest API pe propriul proiect și vedeți ce puteți realiza.
+
+Găsiți mai multe informații despre evenimentele pointer pe [documentația W3C](https://www.w3.org/TR/pointerevents1/) și pe [documentația web MDN](https://developer.mozilla.org/docs/Web/API/Pointer_events).
+
+Verificați întotdeauna capabilitățile browserului folosind [CanIUse.com](https://caniuse.com/).
+
+## Temă
+
+[Lucrați puțin mai mult cu DOM-ul](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/3-intro-to-DOM-and-closures/assignment.md b/translations/ro/3-terrarium/3-intro-to-DOM-and-closures/assignment.md
new file mode 100644
index 00000000..636ac356
--- /dev/null
+++ b/translations/ro/3-terrarium/3-intro-to-DOM-and-closures/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "22fb6c3cb570c47f1ac65048393941fa",
+  "translation_date": "2025-08-28T08:17:15+00:00",
+  "source_file": "3-terrarium/3-intro-to-DOM-and-closures/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Lucrează puțin mai mult cu DOM-ul
+
+## Instrucțiuni
+
+Studiază DOM-ul mai în detaliu prin 'adoptarea' unui element DOM. Vizitează [lista interfețelor DOM](https://developer.mozilla.org/docs/Web/API/Document_Object_Model) de pe MDN și alege una. Găsește un exemplu de utilizare a acesteia pe un site web și scrie o explicație despre cum este folosită.
+
+## Criterii de evaluare
+
+| Criteriu  | Exemplară                                    | Adecvată                                         | Necesită îmbunătățiri   |
+| --------- | -------------------------------------------- | ------------------------------------------------ | ----------------------- |
+|           | Paragraful explicativ este prezentat, cu exemplu | Paragraful explicativ este prezentat, fără exemplu | Nu este prezentat niciun paragraf explicativ |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/README.md b/translations/ro/3-terrarium/README.md
new file mode 100644
index 00000000..ac499613
--- /dev/null
+++ b/translations/ro/3-terrarium/README.md
@@ -0,0 +1,45 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "7965cd2bc5dc92ad888dc4c6ab2ab70a",
+  "translation_date": "2025-08-28T08:11:11+00:00",
+  "source_file": "3-terrarium/README.md",
+  "language_code": "ro"
+}
+-->
+# Terrariul Meu: Un proiect pentru a învăța despre HTML, CSS și manipularea DOM folosind JavaScript 🌵🌱
+
+Un mic exercițiu de tip drag and drop. Cu puțin HTML, JS și CSS, vei putea construi o interfață web, să o stilizezi și chiar să adaugi multiple interacțiuni la alegerea ta.
+
+![my terrarium](../../../translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.ro.png)
+
+# Lecții
+
+1. [Introducere în HTML](./1-intro-to-html/README.md)
+2. [Introducere în CSS](./2-intro-to-css/README.md)
+3. [Introducere în DOM și JS Closures](./3-intro-to-DOM-and-closures/README.md)
+
+## Credite
+
+Scris cu ♥️ de [Jen Looper](https://www.twitter.com/jenlooper)
+
+Terrariul creat prin CSS a fost inspirat de borcanul de sticlă al lui Jakub Mandra [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
+
+Ilustrațiile sunt desenate manual de [Jen Looper](http://jenlooper.com) cu ajutorul Procreate.
+
+## Publică-ți Terrariul
+
+Poți publica terrariul tău pe web folosind Azure Static Web Apps.
+
+1. Fă un fork acestui repo
+
+2. Apasă acest buton
+
+[![Deploy to Azure button](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
+
+3. Parcurge pașii din asistent pentru a-ți crea aplicația. Asigură-te că setezi rădăcina aplicației la `/solution` sau la rădăcina codului tău. Această aplicație nu are un API, așa că nu trebuie să te îngrijorezi de acest aspect. Un folder github va fi creat în repository-ul tău fork-uit, care va ajuta serviciile de build ale Azure Static Web Apps să construiască și să publice aplicația ta la o nouă adresă URL.
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/3-terrarium/solution/README.md b/translations/ro/3-terrarium/solution/README.md
new file mode 100644
index 00000000..fb0b8920
--- /dev/null
+++ b/translations/ro/3-terrarium/solution/README.md
@@ -0,0 +1,39 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "6329fbe8bd936068debd78cca6f09c0a",
+  "translation_date": "2025-08-28T08:13:18+00:00",
+  "source_file": "3-terrarium/solution/README.md",
+  "language_code": "ro"
+}
+-->
+# Terariul Meu: Un proiect pentru a învăța despre HTML, CSS și manipularea DOM folosind JavaScript 🌵🌱
+
+Un mic exercițiu de tip drag and drop. Cu puțin HTML, JS și CSS, poți construi o interfață web, să o stilizezi și să adaugi interacțiuni.
+
+![terariul meu](../../../../translated_images/screenshot_gray.0c796099a1f9f25e40aa55ead81f268434c00af30d7092490759945eda63067d.ro.png)
+
+## Credite
+
+Scris cu ♥️ de [Jen Looper](https://www.twitter.com/jenlooper)
+
+Terariul creat prin CSS a fost inspirat de borcanul de sticlă al lui Jakub Mandra [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY).
+
+Ilustrațiile au fost desenate manual de [Jen Looper](http://jenlooper.com) folosind Procreate.
+
+## Publică-ți Terariul
+
+Poți publica terariul tău pe web folosind Azure Static Web Apps.
+
+1. Clonează acest depozit
+
+2. Apasă acest buton
+
+[![Butonul Deploy to Azure](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)
+
+3. Parcurge pașii din asistent pentru a-ți crea aplicația. Asigură-te că setezi rădăcina aplicației fie la `/solution`, fie la rădăcina codului tău. Această aplicație nu are un API, așa că nu te îngrijora să adaugi unul. Un folder .github va fi creat în depozitul tău clonat, care va ajuta serviciul de build al Azure Static Web Apps să construiască și să publice aplicația ta la o nouă adresă URL.
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să aveți în vedere că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/4-typing-game/README.md b/translations/ro/4-typing-game/README.md
new file mode 100644
index 00000000..0981fd35
--- /dev/null
+++ b/translations/ro/4-typing-game/README.md
@@ -0,0 +1,44 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "957547b822c40042e07d591c4fbfde4f",
+  "translation_date": "2025-08-28T08:20:49+00:00",
+  "source_file": "4-typing-game/README.md",
+  "language_code": "ro"
+}
+-->
+# Programare bazată pe evenimente - Construiește un joc de tastare
+
+## Introducere
+
+Tastarea este una dintre cele mai subestimate abilități ale unui dezvoltator. Capacitatea de a transfera rapid gândurile din minte în editor permite creativității să curgă liber. Una dintre cele mai bune modalități de a învăța este să te joci!
+
+> Așadar, hai să construim un joc de tastare!
+
+Vei folosi abilitățile de JavaScript, HTML și CSS pe care le-ai acumulat până acum pentru a crea un joc de tastare. Jocul va prezenta jucătorului un citat aleatoriu (vom folosi citate din [Sherlock Holmes](https://en.wikipedia.org/wiki/Sherlock_Holmes)) și va cronometra cât timp îi ia jucătorului să îl tasteze corect. Vei folosi abilitățile de JavaScript, HTML și CSS pe care le-ai acumulat până acum pentru a crea un joc de tastare.
+
+![demo](../../../4-typing-game/images/demo.gif)
+
+## Cerințe preliminare
+
+Această lecție presupune că ești familiarizat cu următoarele concepte:
+
+- Crearea de câmpuri de introducere text și controale de tip buton
+- CSS și setarea stilurilor folosind clase
+- Bazele JavaScript-ului
+  - Crearea unui array
+  - Generarea unui număr aleatoriu
+  - Obținerea timpului curent
+
+## Lecție
+
+[Crearea unui joc de tastare folosind programarea bazată pe evenimente](./typing-game/README.md)
+
+## Credite
+
+Scris cu ♥️ de [Christopher Harrison](http://www.twitter.com/geektrainer)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/4-typing-game/solution/README.md b/translations/ro/4-typing-game/solution/README.md
new file mode 100644
index 00000000..152059de
--- /dev/null
+++ b/translations/ro/4-typing-game/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T08:23:38+00:00",
+  "source_file": "4-typing-game/solution/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinare a responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/4-typing-game/typing-game/README.md b/translations/ro/4-typing-game/typing-game/README.md
new file mode 100644
index 00000000..079763ae
--- /dev/null
+++ b/translations/ro/4-typing-game/typing-game/README.md
@@ -0,0 +1,353 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e982871b8388c59c22a41b73b5fca70f",
+  "translation_date": "2025-08-28T08:21:15+00:00",
+  "source_file": "4-typing-game/typing-game/README.md",
+  "language_code": "ro"
+}
+-->
+# Crearea unui joc folosind evenimente
+
+## Chestionar înainte de lecție
+
+[Chestionar înainte de lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/21)
+
+## Programare bazată pe evenimente
+
+Când creăm o aplicație pentru browser, oferim o interfață grafică (GUI) pentru utilizator, astfel încât să poată interacționa cu ceea ce am construit. Cea mai comună modalitate de interacțiune cu browserul este prin clicuri și tastare în diverse elemente. Provocarea pentru noi, ca dezvoltatori, este că nu știm când utilizatorul va efectua aceste operațiuni!
+
+[Programarea bazată pe evenimente](https://en.wikipedia.org/wiki/Event-driven_programming) este denumirea tipului de programare pe care trebuie să o utilizăm pentru a crea GUI-ul. Dacă analizăm puțin această expresie, vedem că cuvântul cheie este **eveniment**. [Eveniment](https://www.merriam-webster.com/dictionary/event), conform Merriam-Webster, este definit ca "ceva care se întâmplă". Aceasta descrie perfect situația noastră. Știm că ceva se va întâmpla și dorim să executăm un cod ca răspuns, dar nu știm când va avea loc.
+
+Modalitatea prin care marcăm o secțiune de cod pe care dorim să o executăm este prin crearea unei funcții. Când ne gândim la [programarea procedurală](https://en.wikipedia.org/wiki/Procedural_programming), funcțiile sunt apelate într-o ordine specifică. Același lucru este valabil și pentru programarea bazată pe evenimente. Diferența constă în **modul** în care funcțiile vor fi apelate.
+
+Pentru a gestiona evenimentele (clicuri pe butoane, tastare etc.), înregistrăm **ascultători de evenimente**. Un ascultător de evenimente este o funcție care ascultă un eveniment și se execută ca răspuns. Ascultătorii de evenimente pot actualiza interfața, pot face apeluri către server sau orice altceva este necesar ca răspuns la acțiunea utilizatorului. Adăugăm un ascultător de evenimente folosind [addEventListener](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener) și furnizând o funcție de executat.
+
+> **NOTE:** Merită menționat că există numeroase modalități de a crea ascultători de evenimente. Poți folosi funcții anonime sau poți crea funcții denumite. Poți utiliza diverse scurtături, cum ar fi setarea proprietății `click` sau utilizarea `addEventListener`. În exercițiul nostru, ne vom concentra pe `addEventListener` și funcțiile anonime, deoarece aceasta este probabil cea mai comună tehnică utilizată de dezvoltatorii web. Este, de asemenea, cea mai flexibilă, deoarece `addEventListener` funcționează pentru toate evenimentele, iar numele evenimentului poate fi furnizat ca parametru.
+
+### Evenimente comune
+
+Există [zeci de evenimente](https://developer.mozilla.org/docs/Web/Events) disponibile pentru a fi ascultate atunci când creezi o aplicație. Practic, orice acțiune a utilizatorului pe o pagină generează un eveniment, ceea ce îți oferă multă putere pentru a asigura experiența dorită. Din fericire, de obicei vei avea nevoie doar de câteva evenimente. Iată câteva dintre cele mai comune (inclusiv cele pe care le vom folosi pentru a crea jocul nostru):
+
+- [click](https://developer.mozilla.org/docs/Web/API/Element/click_event): Utilizatorul a dat clic pe ceva, de obicei un buton sau un hyperlink
+- [contextmenu](https://developer.mozilla.org/docs/Web/API/Element/contextmenu_event): Utilizatorul a dat clic dreapta
+- [select](https://developer.mozilla.org/docs/Web/API/Element/select_event): Utilizatorul a selectat un text
+- [input](https://developer.mozilla.org/docs/Web/API/Element/input_event): Utilizatorul a introdus un text
+
+## Crearea jocului
+
+Vom crea un joc pentru a explora modul în care funcționează evenimentele în JavaScript. Jocul nostru va testa abilitățile de tastare ale jucătorului, una dintre cele mai subestimate abilități pe care toți dezvoltatorii ar trebui să le aibă. Ar trebui să exersăm cu toții tastarea! Fluxul general al jocului va arăta astfel:
+
+- Jucătorul dă clic pe butonul de start și i se afișează un citat de tastat
+- Jucătorul tastează citatul cât de repede poate într-o casetă de text
+  - Pe măsură ce fiecare cuvânt este completat, următorul este evidențiat
+  - Dacă jucătorul face o greșeală, caseta de text devine roșie
+  - Când jucătorul completează citatul, se afișează un mesaj de succes cu timpul scurs
+
+Să construim jocul și să învățăm despre evenimente!
+
+### Structura fișierelor
+
+Vom avea nevoie de trei fișiere: **index.html**, **script.js** și **style.css**. Să le configurăm pentru a ne ușura munca.
+
+- Creează un folder nou pentru proiectul tău deschizând o fereastră de consolă sau terminal și executând următoarea comandă:
+
+```bash
+# Linux or macOS
+mkdir typing-game && cd typing-game
+
+# Windows
+md typing-game && cd typing-game
+```
+
+- Deschide Visual Studio Code
+
+```bash
+code .
+```
+
+- Adaugă trei fișiere în folderul din Visual Studio Code cu următoarele nume:
+  - index.html
+  - script.js
+  - style.css
+
+## Crearea interfeței utilizatorului
+
+Dacă analizăm cerințele, știm că vom avea nevoie de câteva elemente pe pagina HTML. Este ca o rețetă, unde avem nevoie de câteva ingrediente:
+
+- Un loc pentru afișarea citatului pe care utilizatorul trebuie să-l tasteze
+- Un loc pentru afișarea mesajelor, cum ar fi un mesaj de succes
+- O casetă de text pentru tastare
+- Un buton de start
+
+Fiecare dintre acestea va avea nevoie de ID-uri pentru a putea lucra cu ele în JavaScript. Vom adăuga, de asemenea, referințe la fișierele CSS și JavaScript pe care le vom crea.
+
+Creează un fișier nou numit **index.html**. Adaugă următorul cod HTML:
+
+```html
+<!-- inside index.html -->
+<html>
+<head>
+  <title>Typing game</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <h1>Typing game!</h1>
+  <p>Practice your typing skills with a quote from Sherlock Holmes. Click **start** to begin!</p>
+  <p id="quote"></p> <!-- This will display our quote -->
+  <p id="message"></p> <!-- This will display any status messages -->
+  <div>
+    <input type="text" aria-label="current word" id="typed-value" /> <!-- The textbox for typing -->
+    <button type="button" id="start">Start</button> <!-- To start the game -->
+  </div>
+  <script src="script.js"></script>
+</body>
+</html>
+```
+
+### Lansarea aplicației
+
+Este întotdeauna bine să dezvolți iterativ pentru a vedea cum arată lucrurile. Să lansăm aplicația. Există o extensie minunată pentru Visual Studio Code numită [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) care va găzdui aplicația local și va reîmprospăta browserul de fiecare dată când salvezi.
+
+- Instalează [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) urmând linkul și făcând clic pe **Install**
+  - Browserul te va solicita să deschizi Visual Studio Code, iar apoi Visual Studio Code te va solicita să efectuezi instalarea
+  - Repornește Visual Studio Code dacă este necesar
+- După instalare, în Visual Studio Code, apasă Ctrl-Shift-P (sau Cmd-Shift-P) pentru a deschide paleta de comenzi
+- Tastează **Live Server: Open with Live Server**
+  - Live Server va începe să găzduiască aplicația
+- Deschide un browser și navighează la **https://localhost:5500**
+- Acum ar trebui să vezi pagina pe care ai creat-o!
+
+Să adăugăm funcționalitate.
+
+## Adăugarea CSS-ului
+
+Cu HTML-ul creat, să adăugăm CSS-ul pentru stilizarea de bază. Trebuie să evidențiem cuvântul pe care jucătorul ar trebui să-l tasteze și să colorăm caseta de text dacă ceea ce a tastat este incorect. Vom face acest lucru cu două clase.
+
+Creează un fișier nou numit **style.css** și adaugă următoarea sintaxă.
+
+```css
+/* inside style.css */
+.highlight {
+  background-color: yellow;
+}
+
+.error {
+  background-color: lightcoral;
+  border: red;
+}
+```
+
+✅ În ceea ce privește CSS-ul, poți să-ți aranjezi pagina cum dorești. Ia-ți puțin timp și fă pagina mai atractivă:
+
+- Alege un font diferit
+- Colorează titlurile
+- Redimensionează elementele
+
+## JavaScript
+
+Cu interfața creată, este timpul să ne concentrăm pe JavaScript, care va oferi logica. Vom împărți acest proces în câțiva pași:
+
+- [Crearea constantelor](../../../../4-typing-game/typing-game)
+- [Ascultător de evenimente pentru începerea jocului](../../../../4-typing-game/typing-game)
+- [Ascultător de evenimente pentru tastare](../../../../4-typing-game/typing-game)
+
+Dar mai întâi, creează un fișier nou numit **script.js**.
+
+### Adăugarea constantelor
+
+Vom avea nevoie de câteva elemente pentru a ne ușura munca de programare. Din nou, similar cu o rețetă, iată de ce avem nevoie:
+
+- Un array cu lista tuturor citatelor
+- Un array gol pentru a stoca toate cuvintele din citatul curent
+- Un spațiu pentru a stoca indexul cuvântului pe care jucătorul îl tastează în prezent
+- Timpul la care jucătorul a dat clic pe start
+
+De asemenea, vom dori referințe la elementele UI:
+
+- Caseta de text (**typed-value**)
+- Afișarea citatului (**quote**)
+- Mesajul (**message**)
+
+```javascript
+// inside script.js
+// all of our quotes
+const quotes = [
+    'When you have eliminated the impossible, whatever remains, however improbable, must be the truth.',
+    'There is nothing more deceptive than an obvious fact.',
+    'I ought to know by this time that when a fact appears to be opposed to a long train of deductions it invariably proves to be capable of bearing some other interpretation.',
+    'I never make exceptions. An exception disproves the rule.',
+    'What one man can invent another can discover.',
+    'Nothing clears up a case so much as stating it to another person.',
+    'Education never ends, Watson. It is a series of lessons, with the greatest for the last.',
+];
+// store the list of words and the index of the word the player is currently typing
+let words = [];
+let wordIndex = 0;
+// the starting time
+let startTime = Date.now();
+// page elements
+const quoteElement = document.getElementById('quote');
+const messageElement = document.getElementById('message');
+const typedValueElement = document.getElementById('typed-value');
+```
+
+✅ Adaugă mai multe citate în jocul tău
+
+> **NOTE:** Putem recupera elementele oricând dorim în cod folosind `document.getElementById`. Deoarece vom face referire la aceste elemente în mod regulat, vom evita greșelile de tipar cu literale de șiruri utilizând constante. Framework-uri precum [Vue.js](https://vuejs.org/) sau [React](https://reactjs.org/) te pot ajuta să gestionezi mai bine centralizarea codului.
+
+Ia un minut pentru a viziona un videoclip despre utilizarea `const`, `let` și `var`
+
+[![Tipuri de variabile](https://img.youtube.com/vi/JNIXfGiDWM8/0.jpg)](https://youtube.com/watch?v=JNIXfGiDWM8 "Tipuri de variabile")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre variabile.
+
+### Adăugarea logicii de start
+
+Pentru a începe jocul, jucătorul va da clic pe start. Desigur, nu știm când va da clic pe start. Aici intervine un [ascultător de evenimente](https://developer.mozilla.org/docs/Web/API/EventTarget/addEventListener). Un ascultător de evenimente ne va permite să ascultăm ceva care se întâmplă (un eveniment) și să executăm cod ca răspuns. În cazul nostru, dorim să executăm cod atunci când utilizatorul dă clic pe start.
+
+Când utilizatorul dă clic pe **start**, trebuie să selectăm un citat, să configurăm interfața utilizatorului și să configurăm urmărirea cuvântului curent și a timpului. Mai jos este JavaScript-ul pe care trebuie să-l adaugi; discutăm despre el imediat după blocul de cod.
+
+```javascript
+// at the end of script.js
+document.getElementById('start').addEventListener('click', () => {
+  // get a quote
+  const quoteIndex = Math.floor(Math.random() * quotes.length);
+  const quote = quotes[quoteIndex];
+  // Put the quote into an array of words
+  words = quote.split(' ');
+  // reset the word index for tracking
+  wordIndex = 0;
+
+  // UI updates
+  // Create an array of span elements so we can set a class
+  const spanWords = words.map(function(word) { return `<span>${word} </span>`});
+  // Convert into string and set as innerHTML on quote display
+  quoteElement.innerHTML = spanWords.join('');
+  // Highlight the first word
+  quoteElement.childNodes[0].className = 'highlight';
+  // Clear any prior messages
+  messageElement.innerText = '';
+
+  // Setup the textbox
+  // Clear the textbox
+  typedValueElement.value = '';
+  // set focus
+  typedValueElement.focus();
+  // set the event handler
+
+  // Start the timer
+  startTime = new Date().getTime();
+});
+```
+
+Să descompunem codul!
+
+- Configurarea urmăririi cuvintelor
+  - Utilizarea [Math.floor](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Math/floor) și [Math.random](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Math/random) ne permite să selectăm aleatoriu un citat din array-ul `quotes`
+  - Convertim `quote` într-un array de `words` pentru a putea urmări cuvântul pe care jucătorul îl tastează în prezent
+  - `wordIndex` este setat la 0, deoarece jucătorul va începe cu primul cuvânt
+- Configurarea interfeței utilizatorului
+  - Creăm un array de `spanWords`, care conține fiecare cuvânt într-un element `span`
+    - Acest lucru ne va permite să evidențiem cuvântul pe afișaj
+  - `join` array-ul pentru a crea un șir pe care îl putem folosi pentru a actualiza `innerHTML` pe `quoteElement`
+    - Acest lucru va afișa citatul jucătorului
+  - Setăm `className` al primului element `span` la `highlight` pentru a-l evidenția ca galben
+  - Curățăm `messageElement` setând `innerText` la `''`
+- Configurarea casetei de text
+  - Golim `value` curent pe `typedValueElement`
+  - Setăm `focus` pe `typedValueElement`
+- Pornim cronometrul apelând `getTime`
+
+### Adăugarea logicii de tastare
+
+Pe măsură ce jucătorul tastează, se va genera un eveniment `input`. Acest ascultător de evenimente va verifica dacă jucătorul tastează corect cuvântul și va gestiona starea curentă a jocului. Revenind la **script.js**, adaugă următorul cod la final. Îl vom descompune ulterior.
+
+```javascript
+// at the end of script.js
+typedValueElement.addEventListener('input', () => {
+  // Get the current word
+  const currentWord = words[wordIndex];
+  // get the current value
+  const typedValue = typedValueElement.value;
+
+  if (typedValue === currentWord && wordIndex === words.length - 1) {
+    // end of sentence
+    // Display success
+    const elapsedTime = new Date().getTime() - startTime;
+    const message = `CONGRATULATIONS! You finished in ${elapsedTime / 1000} seconds.`;
+    messageElement.innerText = message;
+  } else if (typedValue.endsWith(' ') && typedValue.trim() === currentWord) {
+    // end of word
+    // clear the typedValueElement for the new word
+    typedValueElement.value = '';
+    // move to the next word
+    wordIndex++;
+    // reset the class name for all elements in quote
+    for (const wordElement of quoteElement.childNodes) {
+      wordElement.className = '';
+    }
+    // highlight the new word
+    quoteElement.childNodes[wordIndex].className = 'highlight';
+  } else if (currentWord.startsWith(typedValue)) {
+    // currently correct
+    // highlight the next word
+    typedValueElement.className = '';
+  } else {
+    // error state
+    typedValueElement.className = 'error';
+  }
+});
+```
+
+Să descompunem codul! Începem prin a prelua cuvântul curent și valoarea tastată de jucător până acum. Apoi avem o logică în cascadă, unde verificăm dacă citatul este complet, cuvântul este complet, cuvântul este corect sau (în final), dacă există o eroare.
+
+- Citatul este complet, indicat de `typedValue` fiind egal cu `currentWord` și `wordIndex` fiind egal cu unul mai puțin decât `length` al `words`
+  - Calculăm `elapsedTime` scăzând `startTime` din timpul curent
+  - Împărțim `elapsedTime` la 1.000 pentru a converti din milisecunde în secunde
+  - Afișăm un mesaj de succes
+- Cuvântul este complet, indicat de `typedValue` terminându-se cu un spațiu (sfârșitul unui cuvânt) și `typedValue` fiind egal cu `currentWord`
+  - Setăm `value` pe `typedElement` la `''` pentru a permite tastarea următorului cuvânt
+  - Incrementăm `wordIndex` pentru a trece la următorul cuvânt
+  - Parcurgem toți `childNodes` ai `quoteElement` pentru a seta `className` la `''` pentru a reveni la afișajul implicit
+  - Setăm `className` al cuvântului curent la `highlight` pentru a-l marca ca următorul cuvânt de tastat
+- Cuvântul este tastat corect (dar nu complet), indicat de `currentWord` începând cu `typedValue`
+  - Asigurăm afișarea implicită a `typedValueElement` prin golirea `className`
+- Dacă am ajuns până aici, avem o eroare
+  - Setăm `className` pe `typedValueElement` la `error`
+
+## Testarea aplicației
+
+Ai ajuns la final! Ultimul pas este să te asiguri că aplicația funcționează. Încearcă! Nu te îngrijora dacă apar erori; **toți dezvoltatorii** au erori. Examinează mesajele și depanează după cum este necesar.
+
+Dă clic pe **start** și începe să tastezi! Ar trebui să arate puțin ca animația pe care am văzut-o înainte.
+
+![Animație a jocului în acțiune](../../../../4-typing-game/images/demo.gif)
+
+---
+
+## 🚀 Provocare
+
+Adaugă mai multă funcționalitate
+
+- Dezactivează ascultătorul de evenimente `input` la finalizare și reactivează-l când se apasă butonul
+- Dezactivează caseta de text când jucătorul completează citatul
+- Afișează o casetă de dialog modală cu mesajul de succes
+- Stochează scorurile maxime folosind [localStorage](https://developer.mozilla.org/docs/Web/API/Window/localStorage)
+
+## Test de verificare după curs
+
+[Test de verificare după curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/22)
+
+## Recapitulare și Studiu Individual
+
+Citește despre [toate evenimentele disponibile](https://developer.mozilla.org/docs/Web/Events) pentru dezvoltatori prin intermediul browserului web și gândește-te la scenariile în care ai folosi fiecare dintre ele.
+
+## Temă
+
+[Creează un nou joc de tastatură](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/4-typing-game/typing-game/assignment.md b/translations/ro/4-typing-game/typing-game/assignment.md
new file mode 100644
index 00000000..28e3cf44
--- /dev/null
+++ b/translations/ro/4-typing-game/typing-game/assignment.md
@@ -0,0 +1,26 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "de5384c118e15e4d1d0eaa00fc01b112",
+  "translation_date": "2025-08-28T08:23:23+00:00",
+  "source_file": "4-typing-game/typing-game/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Creează un nou joc de tastatură
+
+## Instrucțiuni
+
+Creează un joc mic care folosește evenimentele tastaturii pentru a realiza sarcini. Poate fi un alt tip de joc de tastare sau un joc artistic care desenează pixeli pe ecran la apăsarea tastelor. Fii creativ!
+
+## Criterii de evaluare
+
+| Criterii | Exemplu de excelență     | Adecvat                  | Necesită îmbunătățiri |
+| -------- | ------------------------ | ------------------------ | --------------------- |
+|          | Este prezentat un joc complet | Jocul este foarte minimal | Jocul are erori       |
+|          |                          |                          |                       |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/1-about-browsers/README.md b/translations/ro/5-browser-extension/1-about-browsers/README.md
new file mode 100644
index 00000000..3eca0df3
--- /dev/null
+++ b/translations/ro/5-browser-extension/1-about-browsers/README.md
@@ -0,0 +1,182 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "0bb55e0b98600afab801eea115228873",
+  "translation_date": "2025-08-28T07:41:44+00:00",
+  "source_file": "5-browser-extension/1-about-browsers/README.md",
+  "language_code": "ro"
+}
+-->
+# Proiect de Extensie pentru Browser Partea 1: Totul despre Browsere
+
+![Browser sketchnote](../../../../translated_images/browser.60317c9be8b7f84adce43e30bff8d47a1ae15793beab762317b2bc6b74337c1a.ro.jpg)
+> Sketchnote de [Wassim Chegham](https://dev.to/wassimchegham/ever-wondered-what-happens-when-you-type-in-a-url-in-an-address-bar-in-a-browser-3dob)
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/23)
+
+### Introducere
+
+Extensiile pentru browser adaugă funcționalități suplimentare unui browser. Dar înainte de a construi una, ar trebui să înveți puțin despre cum funcționează browserele.
+
+### Despre browser
+
+În această serie de lecții, vei învăța cum să construiești o extensie pentru browser care va funcționa pe browserele Chrome, Firefox și Edge. În această parte, vei descoperi cum funcționează browserele și vei schița elementele extensiei pentru browser.
+
+Dar ce este exact un browser? Este o aplicație software care permite unui utilizator final să acceseze conținut de pe un server și să îl afișeze pe pagini web.
+
+✅ Un pic de istorie: primul browser s-a numit 'WorldWideWeb' și a fost creat de Sir Timothy Berners-Lee în 1990.
+
+![early browsers](../../../../translated_images/earlybrowsers.d984b711cdf3a42ddac919d46c4b5ca7232f68ccfbd81395e04e5a64c0015277.ro.jpg)
+> Unele browsere timpurii, via [Karen McGrane](https://www.slideshare.net/KMcGrane/week-4-ixd-history-personal-computing)
+
+Când un utilizator se conectează la internet folosind o adresă URL (Uniform Resource Locator), de obicei utilizând Hypertext Transfer Protocol printr-o adresă `http` sau `https`, browserul comunică cu un server web și preia o pagină web.
+
+În acest moment, motorul de redare al browserului o afișează pe dispozitivul utilizatorului, care poate fi un telefon mobil, un desktop sau un laptop.
+
+Browserele au, de asemenea, capacitatea de a memora în cache conținutul, astfel încât să nu fie necesar să fie preluat de pe server de fiecare dată. Ele pot înregistra istoricul activității de navigare a utilizatorului, pot stoca 'cookies', care sunt mici fragmente de date ce conțin informații utilizate pentru a înregistra activitatea utilizatorului, și multe altele.
+
+Un lucru foarte important de reținut despre browsere este că nu toate sunt la fel! Fiecare browser are punctele sale forte și slabe, iar un dezvoltator web profesionist trebuie să înțeleagă cum să facă paginile web să funcționeze bine pe diferite browsere. Acest lucru include gestionarea ecranelor mici, cum ar fi cele ale telefoanelor mobile, precum și a utilizatorilor care sunt offline.
+
+Un site web foarte util pe care ar trebui să-l salvezi în marcajele browserului tău preferat este [caniuse.com](https://www.caniuse.com). Când construiești pagini web, este foarte util să folosești listele de tehnologii suportate de caniuse pentru a-ți sprijini cât mai bine utilizatorii.
+
+✅ Cum poți afla ce browsere sunt cele mai populare în rândul utilizatorilor site-ului tău web? Verifică analizele - poți instala diverse pachete de analiză ca parte a procesului tău de dezvoltare web, iar acestea îți vor spune ce browsere sunt cele mai utilizate de utilizatorii diferitelor browsere populare.
+
+## Extensii pentru browser
+
+De ce ai vrea să construiești o extensie pentru browser? Este un instrument util pe care îl poți atașa browserului tău atunci când ai nevoie de acces rapid la sarcini pe care le repeți frecvent. De exemplu, dacă ai nevoie să verifici culorile pe diversele pagini web cu care interacționezi, ai putea instala o extensie pentru browser care include un selector de culori. Dacă ai dificultăți în a-ți aminti parolele, ai putea folosi o extensie pentru gestionarea parolelor.
+
+Extensiile pentru browser sunt și distractiv de dezvoltat. Ele tind să gestioneze un număr finit de sarcini pe care le îndeplinesc bine.
+
+✅ Care sunt extensiile tale preferate pentru browser? Ce sarcini îndeplinesc?
+
+### Instalarea extensiilor
+
+Înainte de a începe să construiești, aruncă o privire asupra procesului de construire și implementare a unei extensii pentru browser. Deși fiecare browser diferă puțin în modul în care gestionează această sarcină, procesul este similar pe Chrome și Firefox cu acest exemplu pe Edge:
+
+![captură de ecran a browserului Edge care arată pagina edge://extensions deschisă și meniul de setări deschis](../../../../translated_images/install-on-edge.d68781acaf0b3d3dada8b7507cde7a64bf74b7040d9818baaa9070668e819f90.ro.png)
+
+> Notă: Asigură-te că activezi modul dezvoltator și permiți extensii din alte magazine.
+
+În esență, procesul va fi:
+
+- construiește extensia folosind `npm run build` 
+- navighează în browser la panoul de extensii folosind butonul "Settings and more" (pictograma `...`) din colțul din dreapta sus
+- dacă este o instalare nouă, alege `load unpacked` pentru a încărca o extensie nouă din folderul său de build (în cazul nostru este `/dist`) 
+- sau, apasă `reload` dacă reîncarci extensia deja instalată
+
+✅ Aceste instrucțiuni se referă la extensiile pe care le construiești tu; pentru a instala extensii care au fost lansate în magazinul de extensii asociat fiecărui browser, ar trebui să navighezi la acele [magazine](https://microsoftedge.microsoft.com/addons/Microsoft-Edge-Extensions-Home) și să instalezi extensia dorită.
+
+### Începe
+
+Vei construi o extensie pentru browser care afișează amprenta de carbon a regiunii tale, arătând consumul de energie al regiunii tale și sursa energiei. Extensia va avea un formular care colectează o cheie API pentru a putea accesa API-ul CO2 Signal.
+
+**Ai nevoie de:**
+
+- [o cheie API](https://www.co2signal.com/); introdu adresa ta de email în caseta de pe această pagină și vei primi una
+- [codul regiunii tale](http://api.electricitymap.org/v3/zones) corespunzător [Electricity Map](https://www.electricitymap.org/map) (în Boston, de exemplu, folosesc 'US-NEISO').
+- [codul de început](../../../../5-browser-extension/start). Descarcă folderul `start`; vei completa codul în acest folder.
+- [NPM](https://www.npmjs.com) - NPM este un instrument de gestionare a pachetelor; instalează-l local și pachetele listate în fișierul tău `package.json` vor fi instalate pentru a fi utilizate de activele tale web
+
+✅ Află mai multe despre gestionarea pachetelor în acest [modul excelent de învățare](https://docs.microsoft.com/learn/modules/create-nodejs-project-dependencies/?WT.mc_id=academic-77807-sagibbon)
+
+Acordă-ți un minut pentru a analiza baza de cod:
+
+dist
+    -|manifest.json (setările implicite sunt aici)
+    -|index.html (markup-ul HTML pentru front-end este aici)
+    -|background.js (JS-ul de fundal este aici)
+    -|main.js (JS-ul compilat)
+src
+    -|index.js (codul tău JS merge aici)
+
+✅ Odată ce ai la îndemână cheia API și codul regiunii, salvează-le undeva într-o notă pentru utilizare ulterioară.
+
+### Construiește HTML-ul pentru extensie
+
+Această extensie are două vizualizări. Una pentru a colecta cheia API și codul regiunii:
+
+![captură de ecran a extensiei finalizate deschise într-un browser, afișând un formular cu câmpuri pentru numele regiunii și cheia API.](../../../../translated_images/1.b6da8c1394b07491afeb6b2a8e5aca73ebd3cf478e27bcc9aeabb187e722648e.ro.png)
+
+Și a doua pentru a afișa consumul de carbon al regiunii:
+
+![captură de ecran a extensiei finalizate afișând valorile pentru consumul de carbon și procentajul combustibililor fosili pentru regiunea US-NEISO.](../../../../translated_images/2.1dae52ff0804224692cd648afbf2342955d7afe3b0101b617268130dfb427f55.ro.png)
+
+Să începem prin a construi HTML-ul pentru formular și să-l stilizăm cu CSS.
+
+În folderul `/dist`, vei construi un formular și o zonă de rezultate. În fișierul `index.html`, completează zona de formular delimitată:
+
+```HTML
+<form class="form-data" autocomplete="on">
+	<div>
+		<h2>New? Add your Information</h2>
+	</div>
+	<div>
+		<label for="region">Region Name</label>
+		<input type="text" id="region" required class="region-name" />
+	</div>
+	<div>
+		<label for="api">Your API Key from tmrow</label>
+		<input type="text" id="api" required class="api-key" />
+	</div>
+	<button class="search-btn">Submit</button>
+</form>	
+```
+Acesta este formularul unde informațiile salvate vor fi introduse și salvate în stocarea locală.
+
+Apoi, creează zona de rezultate; sub ultimul tag de formular, adaugă câteva div-uri:
+
+```HTML
+<div class="result">
+	<div class="loading">loading...</div>
+	<div class="errors"></div>
+	<div class="data"></div>
+	<div class="result-container">
+		<p><strong>Region: </strong><span class="my-region"></span></p>
+		<p><strong>Carbon Usage: </strong><span class="carbon-usage"></span></p>
+		<p><strong>Fossil Fuel Percentage: </strong><span class="fossil-fuel"></span></p>
+	</div>
+	<button class="clear-btn">Change region</button>
+</div>
+```
+În acest moment, poți încerca un build. Asigură-te că instalezi dependențele pachetelor acestei extensii:
+
+```
+npm install
+```
+
+Această comandă va folosi npm, Managerul de Pachete Node, pentru a instala webpack pentru procesul de construire al extensiei tale. Poți vedea rezultatul acestui proces uitându-te în `/dist/main.js` - vei vedea că codul a fost compilat.
+
+Deocamdată, extensia ar trebui să se construiască și, dacă o implementezi în Edge ca extensie, vei vedea un formular afișat frumos.
+
+Felicitări, ai făcut primii pași spre construirea unei extensii pentru browser. În lecțiile următoare, o vei face mai funcțională și mai utilă.
+
+---
+
+## 🚀 Provocare
+
+Aruncă o privire într-un magazin de extensii pentru browser și instalează una în browserul tău. Poți examina fișierele sale în moduri interesante. Ce descoperi?
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/24)
+
+## Recapitulare & Studiu Individual
+
+În această lecție ai învățat puțin despre istoria browserului web; profită de această ocazie pentru a învăța despre cum au imaginat inventatorii World Wide Web utilizarea sa citind mai multe despre istoria sa. Unele site-uri utile includ:
+
+[Istoria Browserelor Web](https://www.mozilla.org/firefox/browsers/browser-history/)
+
+[Istoria Web-ului](https://webfoundation.org/about/vision/history-of-the-web/)
+
+[Un interviu cu Tim Berners-Lee](https://www.theguardian.com/technology/2019/mar/12/tim-berners-lee-on-30-years-of-the-web-if-we-dream-a-little-we-can-get-the-web-we-want)
+
+## Temă 
+
+[Restilizează extensia ta](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/1-about-browsers/assignment.md b/translations/ro/5-browser-extension/1-about-browsers/assignment.md
new file mode 100644
index 00000000..cb867d5a
--- /dev/null
+++ b/translations/ro/5-browser-extension/1-about-browsers/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e3c6f2a03c2336e60412612d870af547",
+  "translation_date": "2025-08-28T07:43:08+00:00",
+  "source_file": "5-browser-extension/1-about-browsers/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Restilizează-ți Extensia
+
+## Instrucțiuni
+
+Codul sursă al acestei extensii vine complet cu stiluri, dar nu ești obligat să le folosești; personalizează extensia ta restilizând-o prin editarea fișierului său css.
+
+## Criterii de evaluare
+
+| Criteriu | Exemplu                                      | Adecvat               | Necesită îmbunătățiri |
+| -------- | -------------------------------------------- | --------------------- | --------------------- |
+|          | Codul este trimis cu stiluri noi funcționale | Stilizarea este incompletă | Stilurile sunt defecte |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/2-forms-browsers-local-storage/README.md b/translations/ro/5-browser-extension/2-forms-browsers-local-storage/README.md
new file mode 100644
index 00000000..a9df51f1
--- /dev/null
+++ b/translations/ro/5-browser-extension/2-forms-browsers-local-storage/README.md
@@ -0,0 +1,240 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "e10f168beac4e7b05e30e0eb5c92bf11",
+  "translation_date": "2025-08-28T07:50:54+00:00",
+  "source_file": "5-browser-extension/2-forms-browsers-local-storage/README.md",
+  "language_code": "ro"
+}
+-->
+# Proiect Extensie de Browser Partea 2: Apelează un API, folosește Local Storage
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/25)
+
+### Introducere
+
+În această lecție, vei apela un API prin trimiterea formularului extensiei tale de browser și vei afișa rezultatele în extensie. În plus, vei învăța cum să stochezi date în local storage-ul browserului pentru referințe și utilizări viitoare.
+
+✅ Urmează segmentele numerotate din fișierele corespunzătoare pentru a ști unde să plasezi codul tău.
+
+### Configurează elementele pentru manipulare în extensie:
+
+Până acum, ai construit HTML-ul pentru formular și `<div>`-ul de rezultate al extensiei tale de browser. De acum înainte, va trebui să lucrezi în fișierul `/src/index.js` și să construiești extensia pas cu pas. Consultă [lecția anterioară](../1-about-browsers/README.md) pentru a-ți configura proiectul și pentru procesul de build.
+
+Lucrând în fișierul `index.js`, începe prin a crea câteva variabile `const` pentru a reține valorile asociate diferitelor câmpuri:
+
+```JavaScript
+// form fields
+const form = document.querySelector('.form-data');
+const region = document.querySelector('.region-name');
+const apiKey = document.querySelector('.api-key');
+
+// results
+const errors = document.querySelector('.errors');
+const loading = document.querySelector('.loading');
+const results = document.querySelector('.result-container');
+const usage = document.querySelector('.carbon-usage');
+const fossilfuel = document.querySelector('.fossil-fuel');
+const myregion = document.querySelector('.my-region');
+const clearBtn = document.querySelector('.clear-btn');
+```
+
+Toate aceste câmpuri sunt referite prin clasa lor CSS, așa cum le-ai configurat în HTML în lecția anterioară.
+
+### Adaugă ascultători de evenimente
+
+În continuare, adaugă ascultători de evenimente pentru formular și butonul de resetare care resetează formularul, astfel încât, dacă un utilizator trimite formularul sau apasă pe butonul de resetare, să se întâmple ceva. Adaugă și apelul pentru inițializarea aplicației la finalul fișierului:
+
+```JavaScript
+form.addEventListener('submit', (e) => handleSubmit(e));
+clearBtn.addEventListener('click', (e) => reset(e));
+init();
+```
+
+✅ Observă prescurtarea folosită pentru a asculta un eveniment de submit sau click și cum evenimentul este transmis funcțiilor handleSubmit sau reset. Poți scrie echivalentul acestei prescurtări într-un format mai lung? Care variantă îți place mai mult?
+
+### Construiește funcțiile init() și reset():
+
+Acum vei construi funcția care inițializează extensia, numită init():
+
+```JavaScript
+function init() {
+	//if anything is in localStorage, pick it up
+	const storedApiKey = localStorage.getItem('apiKey');
+	const storedRegion = localStorage.getItem('regionName');
+
+	//set icon to be generic green
+	//todo
+
+	if (storedApiKey === null || storedRegion === null) {
+		//if we don't have the keys, show the form
+		form.style.display = 'block';
+		results.style.display = 'none';
+		loading.style.display = 'none';
+		clearBtn.style.display = 'none';
+		errors.textContent = '';
+	} else {
+        //if we have saved keys/regions in localStorage, show results when they load
+        displayCarbonUsage(storedApiKey, storedRegion);
+		results.style.display = 'none';
+		form.style.display = 'none';
+		clearBtn.style.display = 'block';
+	}
+};
+
+function reset(e) {
+	e.preventDefault();
+	//clear local storage for region only
+	localStorage.removeItem('regionName');
+	init();
+}
+
+```
+
+În această funcție există o logică interesantă. Citind-o, poți vedea ce se întâmplă?
+
+- se setează două `const` pentru a verifica dacă utilizatorul a stocat un APIKey și un cod de regiune în local storage.
+- dacă oricare dintre acestea este null, afișează formularul schimbând stilul său pentru a fi afișat ca 'block'.
+- ascunde zona de rezultate, mesajul de încărcare și butonul clearBtn și setează orice text de eroare ca fiind gol.
+- dacă există o cheie și o regiune, începe o rutină pentru:
+  - a apela API-ul pentru a obține date despre utilizarea carbonului
+  - a ascunde zona de rezultate
+  - a ascunde formularul
+  - a afișa butonul de resetare
+
+Înainte de a merge mai departe, este util să înveți despre un concept foarte important disponibil în browsere: [LocalStorage](https://developer.mozilla.org/docs/Web/API/Window/localStorage). LocalStorage este o modalitate utilă de a stoca șiruri de caractere în browser sub forma unei perechi `cheie-valoare`. Acest tip de stocare web poate fi manipulat prin JavaScript pentru a gestiona datele în browser. LocalStorage nu expiră, în timp ce SessionStorage, un alt tip de stocare web, este șters când browserul este închis. Diferitele tipuri de stocare au avantaje și dezavantaje în utilizarea lor.
+
+> Notă - extensia ta de browser are propriul local storage; fereastra principală a browserului este o instanță diferită și se comportă separat.
+
+Setezi valoarea APIKey ca fiind un șir de caractere, de exemplu, și poți vedea că este setată în Edge prin "inspectarea" unei pagini web (poți face clic dreapta pe un browser pentru a inspecta) și mergând la fila Applications pentru a vedea stocarea.
+
+![Panoul de local storage](../../../../translated_images/localstorage.472f8147b6a3f8d141d9551c95a2da610ac9a3c6a73d4a1c224081c98bae09d9.ro.png)
+
+✅ Gândește-te la situații în care NU ai dori să stochezi anumite date în LocalStorage. În general, plasarea cheilor API în LocalStorage este o idee proastă! Poți vedea de ce? În cazul nostru, deoarece aplicația noastră este pur educativă și nu va fi publicată într-un magazin de aplicații, vom folosi această metodă.
+
+Observă că folosești Web API pentru a manipula LocalStorage, fie prin `getItem()`, `setItem()`, sau `removeItem()`. Este larg suportat în browsere.
+
+Înainte de a construi funcția `displayCarbonUsage()` care este apelată în `init()`, să construim funcționalitatea pentru gestionarea trimiterii inițiale a formularului.
+
+### Gestionează trimiterea formularului
+
+Creează o funcție numită `handleSubmit` care acceptă un argument de eveniment `(e)`. Oprește propagarea evenimentului (în acest caz, dorim să oprim browserul să se reîmprospăteze) și apelează o nouă funcție, `setUpUser`, transmițând argumentele `apiKey.value` și `region.value`. În acest fel, folosești cele două valori care sunt aduse prin formularul inițial atunci când câmpurile corespunzătoare sunt completate.
+
+```JavaScript
+function handleSubmit(e) {
+	e.preventDefault();
+	setUpUser(apiKey.value, region.value);
+}
+```
+
+✅ Reîmprospătează-ți memoria - HTML-ul pe care l-ai configurat în lecția anterioară are două câmpuri de intrare ale căror `valori` sunt capturate prin `const`-urile pe care le-ai configurat la începutul fișierului, și ambele sunt `required`, astfel încât browserul oprește utilizatorii să introducă valori nule.
+
+### Configurează utilizatorul
+
+Trecând la funcția `setUpUser`, aici setezi valorile local storage pentru apiKey și regionName. Adaugă o nouă funcție:
+
+```JavaScript
+function setUpUser(apiKey, regionName) {
+	localStorage.setItem('apiKey', apiKey);
+	localStorage.setItem('regionName', regionName);
+	loading.style.display = 'block';
+	errors.textContent = '';
+	clearBtn.style.display = 'block';
+	//make initial call
+	displayCarbonUsage(apiKey, regionName);
+}
+```
+
+Această funcție setează un mesaj de încărcare pentru a fi afișat în timp ce API-ul este apelat. În acest moment, ai ajuns la crearea celei mai importante funcții ale acestei extensii de browser!
+
+### Afișează utilizarea carbonului
+
+În cele din urmă, este timpul să interoghezi API-ul!
+
+Înainte de a merge mai departe, ar trebui să discutăm despre API-uri. API-urile, sau [Interfețele de Programare a Aplicațiilor](https://www.webopedia.com/TERM/A/API.html), sunt un element critic în trusa de instrumente a unui dezvoltator web. Ele oferă modalități standard pentru programe de a interacționa și de a comunica între ele. De exemplu, dacă construiești un site web care trebuie să interogheze o bază de date, cineva ar putea să fi creat un API pe care să-l folosești. Deși există multe tipuri de API-uri, unul dintre cele mai populare este un [API REST](https://www.smashingmagazine.com/2018/01/understanding-using-rest-api/).
+
+✅ Termenul 'REST' înseamnă 'Transfer de Stare Reprezentativă' și implică utilizarea unor URL-uri configurate diferit pentru a obține date. Fă puțină cercetare despre diferitele tipuri de API-uri disponibile pentru dezvoltatori. Ce format ți se pare atractiv?
+
+Există lucruri importante de remarcat despre această funcție. În primul rând, observă cuvântul cheie [`async`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/async_function). Scrierea funcțiilor astfel încât să ruleze asincron înseamnă că acestea așteaptă finalizarea unei acțiuni, cum ar fi returnarea datelor, înainte de a continua.
+
+Iată un videoclip rapid despre `async`:
+
+[![Async și Await pentru gestionarea promisiunilor](https://img.youtube.com/vi/YwmlRkrxvkk/0.jpg)](https://youtube.com/watch?v=YwmlRkrxvkk "Async și Await pentru gestionarea promisiunilor")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre async/await.
+
+Creează o nouă funcție pentru a interoga API-ul C02Signal:
+
+```JavaScript
+import axios from '../node_modules/axios';
+
+async function displayCarbonUsage(apiKey, region) {
+	try {
+		await axios
+			.get('https://api.co2signal.com/v1/latest', {
+				params: {
+					countryCode: region,
+				},
+				headers: {
+					'auth-token': apiKey,
+				},
+			})
+			.then((response) => {
+				let CO2 = Math.floor(response.data.data.carbonIntensity);
+
+				//calculateColor(CO2);
+
+				loading.style.display = 'none';
+				form.style.display = 'none';
+				myregion.textContent = region;
+				usage.textContent =
+					Math.round(response.data.data.carbonIntensity) + ' grams (grams C02 emitted per kilowatt hour)';
+				fossilfuel.textContent =
+					response.data.data.fossilFuelPercentage.toFixed(2) +
+					'% (percentage of fossil fuels used to generate electricity)';
+				results.style.display = 'block';
+			});
+	} catch (error) {
+		console.log(error);
+		loading.style.display = 'none';
+		results.style.display = 'none';
+		errors.textContent = 'Sorry, we have no data for the region you have requested.';
+	}
+}
+```
+
+Aceasta este o funcție mare. Ce se întâmplă aici?
+
+- urmând cele mai bune practici, folosești cuvântul cheie `async` pentru a face ca această funcție să se comporte asincron. Funcția conține un bloc `try/catch`, deoarece va returna o promisiune atunci când API-ul returnează date. Deoarece nu ai control asupra vitezei cu care API-ul va răspunde (s-ar putea să nu răspundă deloc!), trebuie să gestionezi această incertitudine apelându-l asincron.
+- interoghezi API-ul co2signal pentru a obține datele regiunii tale, folosind cheia ta API. Pentru a folosi acea cheie, trebuie să folosești un tip de autentificare în parametrii antetului.
+- odată ce API-ul răspunde, atribui diferite elemente ale datelor sale de răspuns părților ecranului pe care le-ai configurat pentru a afișa aceste date.
+- dacă există o eroare sau dacă nu există niciun rezultat, afișezi un mesaj de eroare.
+
+✅ Utilizarea modelelor de programare asincronă este un alt instrument foarte util în trusa ta de instrumente. Citește [despre diferitele moduri](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/async_function) în care poți configura acest tip de cod.
+
+Felicitări! Dacă construiești extensia (`npm run build`) și o reîmprospătezi în panoul extensiilor, ai o extensie funcțională! Singurul lucru care nu funcționează este pictograma, iar acest lucru îl vei rezolva în lecția următoare.
+
+---
+
+## 🚀 Provocare
+
+Am discutat despre mai multe tipuri de API până acum în aceste lecții. Alege un API web și cercetează în detaliu ce oferă. De exemplu, aruncă o privire la API-urile disponibile în browsere, cum ar fi [HTML Drag and Drop API](https://developer.mozilla.org/docs/Web/API/HTML_Drag_and_Drop_API). Ce face ca un API să fie grozav, în opinia ta?
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/26)
+
+## Recapitulare și Studiu Individual
+
+Ai învățat despre LocalStorage și API-uri în această lecție, ambele foarte utile pentru un dezvoltator web profesionist. Poți să te gândești cum funcționează aceste două lucruri împreună? Gândește-te cum ai arhitectura un site web care ar stoca elemente pentru a fi utilizate de un API.
+
+## Temă
+
+[Adoptă un API](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/2-forms-browsers-local-storage/assignment.md b/translations/ro/5-browser-extension/2-forms-browsers-local-storage/assignment.md
new file mode 100644
index 00000000..8cbd2ad8
--- /dev/null
+++ b/translations/ro/5-browser-extension/2-forms-browsers-local-storage/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "a0c78d1dd9d1acdbf7f52e7cc3ebe1a7",
+  "translation_date": "2025-08-28T07:52:48+00:00",
+  "source_file": "5-browser-extension/2-forms-browsers-local-storage/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Adoptă un API
+
+## Instrucțiuni
+
+APIs pot fi foarte distractive de explorat. Iată o [listă cu multe API-uri gratuite](https://github.com/public-apis/public-apis). Alege un API și creează o extensie de browser care rezolvă o problemă. Poate fi o problemă mică, cum ar fi lipsa pozelor cu animale de companie (încearcă [dog CEO API](https://dog.ceo/dog-api)) sau ceva mai complex - distrează-te!
+
+## Criterii de evaluare
+
+| Criteriu | Exemplară                                                                  | Adecvat                                 | Necesită îmbunătățiri   |
+| -------- | -------------------------------------------------------------------------- | ---------------------------------------- | ----------------------- |
+|          | O extensie de browser completă este trimisă folosind un API din lista de mai sus | O extensie de browser parțială este trimisă | Trimiterea conține erori |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/3-background-tasks-and-performance/README.md b/translations/ro/5-browser-extension/3-background-tasks-and-performance/README.md
new file mode 100644
index 00000000..8977da72
--- /dev/null
+++ b/translations/ro/5-browser-extension/3-background-tasks-and-performance/README.md
@@ -0,0 +1,176 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "f198c6b817b4b2a99749f4662e7cae98",
+  "translation_date": "2025-08-28T07:44:02+00:00",
+  "source_file": "5-browser-extension/3-background-tasks-and-performance/README.md",
+  "language_code": "ro"
+}
+-->
+# Proiect Extensie de Browser Partea 3: Învață despre Sarcini de Fundal și Performanță
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/27)
+
+### Introducere
+
+În ultimele două lecții ale acestui modul, ai învățat cum să construiești un formular și o zonă de afișare pentru datele preluate de la un API. Este o metodă foarte standard de a crea o prezență web. Ai învățat chiar și cum să gestionezi preluarea datelor în mod asincron. Extensia ta de browser este aproape completă.
+
+Mai rămâne să gestionezi câteva sarcini de fundal, inclusiv actualizarea culorii pictogramei extensiei, așa că este un moment excelent să discutăm despre cum browserul gestionează acest tip de sarcini. Să ne gândim la aceste sarcini ale browserului în contextul performanței resurselor tale web pe măsură ce le construiești.
+
+## Bazele Performanței Web
+
+> "Performanța unui site web se referă la două lucruri: cât de repede se încarcă pagina și cât de repede rulează codul de pe ea." -- [Zack Grossbart](https://www.smashingmagazine.com/2012/06/javascript-profiling-chrome-developer-tools/)
+
+Subiectul despre cum să faci site-urile tale extrem de rapide pe toate tipurile de dispozitive, pentru toți utilizatorii, în toate situațiile, este, fără surpriză, vast. Iată câteva puncte de luat în considerare pe măsură ce construiești fie un proiect web standard, fie o extensie de browser.
+
+Primul lucru pe care trebuie să-l faci pentru a te asigura că site-ul tău funcționează eficient este să colectezi date despre performanța sa. Primul loc unde poți face acest lucru este în instrumentele de dezvoltare ale browserului tău web. În Edge, poți selecta butonul "Setări și altele" (pictograma cu trei puncte din colțul din dreapta sus al browserului), apoi navighează la Mai Multe Instrumente > Instrumente de Dezvoltare și deschide fila Performanță. De asemenea, poți folosi combinațiile de taste `Ctrl` + `Shift` + `I` pe Windows sau `Option` + `Command` + `I` pe Mac pentru a deschide instrumentele de dezvoltare.
+
+Fila Performanță conține un instrument de Profilare. Deschide un site web (încearcă, de exemplu, [https://www.microsoft.com](https://www.microsoft.com/?WT.mc_id=academic-77807-sagibbon)) și apasă butonul 'Înregistrare', apoi reîmprospătează site-ul. Oprește înregistrarea în orice moment și vei putea vedea rutinele generate pentru 'script', 'render' și 'paint' ale site-ului:
+
+![Profiler Edge](../../../../translated_images/profiler.5a4a62479c5df01cfec9aab74173dba13f91d2c968e1a1ae434c26165792df15.ro.png)
+
+✅ Vizitează [Documentația Microsoft](https://docs.microsoft.com/microsoft-edge/devtools-guide/performance/?WT.mc_id=academic-77807-sagibbon) despre panoul Performanță în Edge
+
+> Sfat: pentru a obține o citire precisă a timpului de pornire al site-ului tău, golește memoria cache a browserului
+
+Selectează elemente din cronologia profilului pentru a mări evenimentele care se întâmplă în timp ce pagina ta se încarcă.
+
+Obține o imagine de ansamblu a performanței paginii tale selectând o parte din cronologia profilului și uitându-te la panoul de rezumat:
+
+![Snapshot profiler Edge](../../../../translated_images/snapshot.97750180ebcad73794a3594b36925eb5c8dbaac9e03fec7f9b974188c9ac63c7.ro.png)
+
+Verifică panoul Jurnal de Evenimente pentru a vedea dacă vreun eveniment a durat mai mult de 15 ms:
+
+![Jurnal de evenimente Edge](../../../../translated_images/log.804026979f3707e00eebcfa028b2b5a88cec6292f858767bb6703afba65a7d9c.ro.png)
+
+✅ Familiarizează-te cu instrumentul de profilare! Deschide instrumentele de dezvoltare pe acest site și vezi dacă există blocaje. Care este resursa care se încarcă cel mai încet? Dar cea mai rapidă?
+
+## Verificări de profilare
+
+În general, există câteva "zone problematice" pe care fiecare dezvoltator web ar trebui să le urmărească atunci când construiește un site pentru a evita surprizele neplăcute în momentul lansării în producție.
+
+**Dimensiunile resurselor**: Web-ul a devenit mai 'greu' și, prin urmare, mai lent, în ultimii ani. O parte din această greutate are legătură cu utilizarea imaginilor.
+
+✅ Consultă [Arhiva Internetului](https://httparchive.org/reports/page-weight) pentru o perspectivă istorică asupra greutății paginilor și multe altele.
+
+O practică bună este să te asiguri că imaginile tale sunt optimizate și livrate la dimensiunea și rezoluția potrivită pentru utilizatorii tăi.
+
+**Traversări DOM**: Browserul trebuie să construiască Modelul Obiectului Documentului (DOM) pe baza codului pe care îl scrii, așa că este în interesul unei performanțe bune a paginii să păstrezi etichetele la minim, folosind și stilizând doar ceea ce este necesar pentru pagină. În acest sens, CSS-ul excesiv asociat unei pagini ar putea fi optimizat; stilurile care trebuie utilizate doar pe o singură pagină nu trebuie incluse în foaia de stil principală, de exemplu.
+
+**JavaScript**: Fiecare dezvoltator JavaScript ar trebui să fie atent la scripturile care blochează randarea și care trebuie încărcate înainte ca restul DOM-ului să poată fi traversat și afișat în browser. Ia în considerare utilizarea `defer` cu scripturile tale inline (așa cum se face în modulul Terrarium).
+
+✅ Încearcă câteva site-uri pe un [site de testare a vitezei](https://www.webpagetest.org/) pentru a afla mai multe despre verificările comune care se fac pentru a determina performanța site-ului.
+
+Acum că ai o idee despre cum browserul afișează resursele pe care le trimiți, să analizăm ultimele câteva lucruri pe care trebuie să le faci pentru a finaliza extensia:
+
+### Creează o funcție pentru calcularea culorii
+
+Lucrând în `/src/index.js`, adaugă o funcție numită `calculateColor()` după seria de variabile `const` pe care le-ai setat pentru a avea acces la DOM:
+
+```JavaScript
+function calculateColor(value) {
+	let co2Scale = [0, 150, 600, 750, 800];
+	let colors = ['#2AA364', '#F5EB4D', '#9E4229', '#381D02', '#381D02'];
+
+	let closestNum = co2Scale.sort((a, b) => {
+		return Math.abs(a - value) - Math.abs(b - value);
+	})[0];
+	console.log(value + ' is closest to ' + closestNum);
+	let num = (element) => element > closestNum;
+	let scaleIndex = co2Scale.findIndex(num);
+
+	let closestColor = colors[scaleIndex];
+	console.log(scaleIndex, closestColor);
+
+	chrome.runtime.sendMessage({ action: 'updateIcon', value: { color: closestColor } });
+}
+```
+
+Ce se întâmplă aici? Transmiți o valoare (intensitatea carbonului) din apelul API pe care l-ai finalizat în lecția anterioară, iar apoi calculezi cât de aproape este valoarea sa de indexul prezentat în array-ul de culori. Apoi trimiți acea valoare de culoare cea mai apropiată către runtime-ul Chrome.
+
+Runtime-ul Chrome are [un API](https://developer.chrome.com/extensions/runtime) care gestionează tot felul de sarcini de fundal, iar extensia ta profită de acest lucru:
+
+> "Folosește API-ul chrome.runtime pentru a prelua pagina de fundal, a returna detalii despre manifest și a asculta și răspunde la evenimentele din ciclul de viață al aplicației sau extensiei. De asemenea, poți folosi acest API pentru a converti calea relativă a URL-urilor în URL-uri complet calificate."
+
+✅ Dacă dezvolți această extensie de browser pentru Edge, s-ar putea să te surprindă faptul că folosești un API Chrome. Versiunile mai noi ale browserului Edge rulează pe motorul browserului Chromium, așa că poți profita de aceste instrumente.
+
+> Notă: dacă vrei să profilezi o extensie de browser, lansează instrumentele de dezvoltare din interiorul extensiei, deoarece aceasta este propria instanță separată de browser.
+
+### Setează o culoare implicită pentru pictogramă
+
+Acum, în funcția `init()`, setează pictograma să fie generic verde la început, apelând din nou acțiunea `updateIcon` a Chrome:
+
+```JavaScript
+chrome.runtime.sendMessage({
+	action: 'updateIcon',
+		value: {
+			color: 'green',
+		},
+});
+```
+
+### Apelează funcția, execută apelul
+
+Apoi, apelează funcția pe care tocmai ai creat-o adăugând-o la promisiunea returnată de API-ul C02Signal:
+
+```JavaScript
+//let CO2...
+calculateColor(CO2);
+```
+
+Și, în final, în `/dist/background.js`, adaugă ascultătorul pentru aceste apeluri de acțiuni de fundal:
+
+```JavaScript
+chrome.runtime.onMessage.addListener(function (msg, sender, sendResponse) {
+	if (msg.action === 'updateIcon') {
+		chrome.browserAction.setIcon({ imageData: drawIcon(msg.value) });
+	}
+});
+//borrowed from energy lollipop extension, nice feature!
+function drawIcon(value) {
+	let canvas = document.createElement('canvas');
+	let context = canvas.getContext('2d');
+
+	context.beginPath();
+	context.fillStyle = value.color;
+	context.arc(100, 100, 50, 0, 2 * Math.PI);
+	context.fill();
+
+	return context.getImageData(50, 50, 100, 100);
+}
+```
+
+În acest cod, adaugi un ascultător pentru orice mesaje care ajung la managerul de sarcini de fundal. Dacă este numit 'updateIcon', atunci următorul cod este rulat pentru a desena o pictogramă de culoarea corespunzătoare folosind API-ul Canvas.
+
+✅ Vei învăța mai multe despre API-ul Canvas în [lecțiile despre Jocul Spațial](../../6-space-game/2-drawing-to-canvas/README.md).
+
+Acum, reconstruiește extensia ta (`npm run build`), reîmprospătează și lansează extensia, și urmărește cum se schimbă culoarea. Este un moment bun să faci o plimbare sau să speli vasele? Acum știi!
+
+Felicitări, ai construit o extensie de browser utilă și ai învățat mai multe despre cum funcționează browserul și cum să profilezi performanța acestuia.
+
+---
+
+## 🚀 Provocare
+
+Investighează câteva site-uri open source care există de mult timp și, pe baza istoricului lor de pe GitHub, vezi dacă poți determina cum au fost optimizate de-a lungul anilor pentru performanță, dacă au fost optimizate. Care este cel mai comun punct sensibil?
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/28)
+
+## Recapitulare & Studiu Individual
+
+Ia în considerare abonarea la un [newsletter despre performanță](https://perf.email/)
+
+Investighează câteva dintre modurile în care browserele evaluează performanța web uitându-te prin filele de performanță din instrumentele lor web. Găsești diferențe majore?
+
+## Temă
+
+[Analizează un site pentru performanță](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/3-background-tasks-and-performance/assignment.md b/translations/ro/5-browser-extension/3-background-tasks-and-performance/assignment.md
new file mode 100644
index 00000000..ec7d0216
--- /dev/null
+++ b/translations/ro/5-browser-extension/3-background-tasks-and-performance/assignment.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "fc09b0fb314a5ab0507ba99216e6a843",
+  "translation_date": "2025-08-28T07:46:23+00:00",
+  "source_file": "5-browser-extension/3-background-tasks-and-performance/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Analizează un site pentru performanță
+
+Oferă un raport detaliat al unui site web, evidențiind zonele unde performanța este problematică. Analizează de ce site-ul este lent și ce ai putea face pentru a-l accelera. Nu te baza doar pe instrumentele browserului, ci cercetează și alte instrumente care pot ajuta la realizarea raportului.
+
+## Criterii de evaluare
+
+| Criterii | Exemplu                                                                                                   | Adecvat                     | Necesită îmbunătățiri         |
+| -------- | --------------------------------------------------------------------------------------------------------- | --------------------------- | ----------------------------- |
+|          | Este prezentat un raport cu detalii obținute nu doar din instrumentele browserului, ci și din instrumente terțe, dacă sunt disponibile | Este prezentat un raport de bază | Este prezentat un raport minimal |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/README.md b/translations/ro/5-browser-extension/README.md
new file mode 100644
index 00000000..c2a0c760
--- /dev/null
+++ b/translations/ro/5-browser-extension/README.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b121a279a6ab39878491f3e572673515",
+  "translation_date": "2025-08-28T07:41:13+00:00",
+  "source_file": "5-browser-extension/README.md",
+  "language_code": "ro"
+}
+-->
+# Construirea unei extensii pentru browser
+
+Construirea extensiilor pentru browser este o modalitate distractivă și interesantă de a analiza performanța aplicațiilor tale, în timp ce creezi un alt tip de resursă web. Acest modul include lecții despre cum funcționează browserele, cum să implementezi o extensie pentru browser, cum să construiești un formular, să apelezi un API, să utilizezi stocarea locală și cum să evaluezi performanța site-ului tău web pentru a o îmbunătăți.
+
+Vei construi o extensie pentru browser care funcționează pe Edge, Chrome și Firefox. Această extensie, care este ca un mini site web adaptat pentru o sarcină foarte specifică, verifică [API-ul C02 Signal](https://www.co2signal.com) pentru utilizarea energiei electrice și intensitatea carbonului într-o anumită regiune și oferă o evaluare a amprentei de carbon a regiunii respective.
+
+Această extensie poate fi utilizată ad-hoc de un utilizator, odată ce o cheie API și un cod de regiune sunt introduse într-un formular, pentru a determina utilizarea locală a energiei electrice și, astfel, pentru a oferi date care pot influența deciziile utilizatorului legate de consumul de energie. De exemplu, poate fi preferabil să amâni utilizarea unui uscător de haine (o activitate cu intensitate mare de carbon) în timpul unei perioade de consum ridicat de energie electrică în regiunea ta.
+
+### Subiecte
+
+1. [Despre browser](1-about-browsers/README.md)
+2. [Formulare și stocare locală](2-forms-browsers-local-storage/README.md)
+3. [Sarcini de fundal și performanță](3-background-tasks-and-performance/README.md)
+
+### Credite
+
+![o extensie verde pentru browser](../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Credite
+
+Ideea pentru acest declanșator de carbon web a fost oferită de Asim Hussain, lider la Microsoft al echipei Green Cloud Advocacy și autor al [Principiilor Verzi](https://principles.green/). Inițial, a fost un [proiect de site web](https://github.com/jlooper/green).
+
+Structura extensiei pentru browser a fost influențată de [extensia COVID a lui Adebola Adeniran](https://github.com/onedebos/covtension).
+
+Conceptul din spatele sistemului de pictograme „punct” a fost sugerat de structura pictogramelor din extensia pentru browser [Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+Aceste lecții au fost scrise cu ♥️ de [Jen Looper](https://www.twitter.com/jenlooper)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/README.md b/translations/ro/5-browser-extension/solution/README.md
new file mode 100644
index 00000000..c0dd2801
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/README.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "fab4e6b4f0efcd587a9029d82991f597",
+  "translation_date": "2025-08-28T07:47:14+00:00",
+  "source_file": "5-browser-extension/solution/README.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: Cod finalizat
+
+Folosind API-ul C02 Signal de la tmrow pentru a monitoriza consumul de electricitate, construiește o extensie de browser care să îți ofere un memento direct în browser despre cât de intens este consumul de electricitate în regiunea ta. Utilizarea acestei extensii în mod ad-hoc te va ajuta să iei decizii informate cu privire la activitățile tale bazate pe aceste informații.
+
+![captură de ecran extensie](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Începe
+
+Va trebui să ai [npm](https://npmjs.com) instalat. Descarcă o copie a acestui cod într-un folder de pe computerul tău.
+
+Instalează toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiește extensia folosind webpack:
+
+```
+npm run build
+```
+
+Pentru a instala pe Edge, folosește meniul „trei puncte” din colțul din dreapta sus al browserului pentru a găsi panoul Extensii. De acolo, selectează „Load Unpacked” pentru a încărca o extensie nouă. Deschide folderul „dist” la prompt și extensia va fi încărcată. Pentru a o utiliza, vei avea nevoie de o cheie API pentru API-ul CO2 Signal ([obține una aici prin email](https://www.co2signal.com/) - introdu adresa ta de email în caseta de pe această pagină) și de [codul pentru regiunea ta](http://api.electricitymap.org/v3/zones) corespunzător [Electricity Map](https://www.electricitymap.org/map) (în Boston, de exemplu, folosesc „US-NEISO”).
+
+![instalare](../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+După ce cheia API și regiunea sunt introduse în interfața extensiei, punctul colorat din bara extensiei browserului ar trebui să se schimbe pentru a reflecta consumul de energie din regiunea ta și să îți ofere o sugestie despre ce activități consumatoare de energie ar fi potrivite să desfășori. Conceptul din spatele acestui sistem de „puncte” mi-a fost inspirat de extensia [Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/translation/README.es.md b/translations/ro/5-browser-extension/solution/translation/README.es.md
new file mode 100644
index 00000000..72899212
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/translation/README.es.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "cbaf73f94a9ab4c680a10ef871e92948",
+  "translation_date": "2025-08-28T07:48:52+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.es.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: Cod complet
+
+Folosind API-ul CO2 Signal de la tmrow pentru a urmări consumul de electricitate, creați o extensie de browser care să vă ofere un memento direct în browser despre consumul de electricitate din regiunea dumneavoastră. Utilizarea acestei extensii ad hoc vă va ajuta să luați decizii cu privire la activitățile dumneavoastră bazându-vă pe aceste informații.
+
+![extension screenshot](../../../../../translated_images/extension-screenshot.352c4c3ba54e4041ad2f6af749d562cc5705f527b5826efd53d11c3528f5ae45.ro.png)
+
+## Început
+
+Trebuie să aveți [npm](https://npmjs.com) instalat. Descărcați o copie a acestui cod într-un folder de pe computerul dumneavoastră.
+
+Instalați toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiți extensia folosind webpack:
+
+```
+npm run build
+```
+
+Pentru instalare în Edge, utilizați meniul cu 'trei puncte' din colțul din dreapta sus al browserului pentru a găsi panoul Extensii. De acolo, selectați 'Încărcare neambalată' pentru a adăuga o extensie nouă. Deschideți folderul 'dist' când vi se solicită și extensia va fi încărcată. Pentru a o utiliza, veți avea nevoie de o cheie API pentru API-ul CO2 Signal ([obțineți una aici prin e-mail](https://www.co2signal.com/) - introduceți adresa de e-mail în câmpul de pe această pagină) și de [codul pentru regiunea dumneavoastră](http://api.electricitymap.org/v3/zones) corespunzător [Hărții de electricitate](https://www.electricitymap.org/map) (în Boston, de exemplu, folosesc 'US-NEISO').
+
+![installing](../../../../../translated_images/install-on-edge.8bd0ee3ca7dcda1c5334b5195603a43c864e3b38d088b03d57376d25e77b9459.ro.png)
+
+Odată ce introduceți cheia API și regiunea în interfața extensiei, punctul colorat din bara extensiei browserului ar trebui să se schimbe pentru a reflecta consumul de energie din regiunea dumneavoastră și să vă ofere un indicator despre activitățile cu consum ridicat de energie care ar fi potrivite pentru dumneavoastră. Conceptul din spatele acestui sistem de "puncte" mi-a fost inspirat de [extensia Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/translation/README.fr.md b/translations/ro/5-browser-extension/solution/translation/README.fr.md
new file mode 100644
index 00000000..a0158dcb
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/translation/README.fr.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9361268ca430b2579375009e1eceb5e5",
+  "translation_date": "2025-08-28T07:49:46+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.fr.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: Cod finalizat
+
+Folosind API-ul CO2 Signal de la tmrow pentru a monitoriza consumul de electricitate, creați o extensie de browser care să vă ofere un memento direct în browser despre consumul de electricitate din regiunea dumneavoastră. Utilizarea acestei extensii ad-hoc vă va ajuta să luați decizii informate cu privire la activitățile dumneavoastră pe baza acestor informații.
+
+![captură de extensie](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Începeți
+
+Va trebui să aveți [npm](https://npmjs.com) instalat. Descărcați o copie a acestui cod într-un folder de pe computerul dumneavoastră.
+
+Instalați toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiți extensia folosind webpack
+
+```
+npm run build
+```
+
+Pentru a instala pe Edge, utilizați meniul „trei puncte” din colțul din dreapta sus al browserului pentru a găsi panoul Extensii. De acolo, selectați „Încărcați extensia dezarhivată” pentru a adăuga o nouă extensie. La solicitare, deschideți folderul „dist” și extensia va fi încărcată. Pentru a o utiliza, veți avea nevoie de o cheie API pentru API-ul CO2 Signal ([obțineți una aici prin e-mail](https://www.co2signal.com/) - introduceți adresa dumneavoastră de e-mail în câmpul de pe această pagină) și de [codul pentru regiunea dumneavoastră](http://api.electricitymap.org/v3/zones) corespunzător [Hărții electricității](https://www.electricitymap.org/map) (de exemplu, în Boston, folosesc „US-NEISO”).
+
+![instalare](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+Odată ce cheia API și regiunea sunt introduse în interfața extensiei, punctul colorat din bara de extensii a browserului ar trebui să se schimbe pentru a reflecta consumul de energie din regiunea dumneavoastră și să vă ofere un indicator despre activitățile consumatoare de energie pe care ar fi potrivit să le desfășurați. Conceptul din spatele acestui sistem de „puncte” mi-a fost inspirat de [extensia Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/translation/README.hi.md b/translations/ro/5-browser-extension/solution/translation/README.hi.md
new file mode 100644
index 00000000..90d85ef6
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/translation/README.hi.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "dd58ae1b7707034f055718c1b68bc8de",
+  "translation_date": "2025-08-28T07:47:40+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.hi.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: Cod finalizat
+
+Construirea unei extensii de browser care utilizează API-ul CO2 Signal de la tmrow pentru a urmări consumul de energie electrică, astfel încât să primiți un memento în browser despre cât de intens este consumul de energie electrică în zona dumneavoastră. Utilizarea acestei extensii vă poate ajuta să luați decizii informate cu privire la activitățile dumneavoastră pe baza acestor informații.
+
+![Captură de ecran a extensiei](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Început
+
+Va trebui să aveți instalat [npm](https://npmjs.com). Descărcați o copie a acestui cod într-un folder de pe computerul dumneavoastră.
+
+Instalați toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiți extensia folosind webpack:
+
+```
+npm run build
+```
+
+Pentru a instala pe Edge, utilizați meniul „trei puncte” din colțul din dreapta sus al browserului pentru a găsi panoul de extensii. De acolo, selectați „Load unpacked” pentru a încărca o extensie nouă. La prompt, deschideți folderul „dist” și extensia va fi încărcată. Pentru a o utiliza, veți avea nevoie de o cheie API pentru CO2 Signal ([obțineți-o prin e-mail aici](https://www.co2signal.com/) - introduceți adresa dumneavoastră de e-mail în caseta de pe această pagină) și de [codul zonei dumneavoastră](http://api.electricitymap.org/v3/zones) de pe [Electricity Map](https://www.electricitymap.org/map) (de exemplu, pentru Boston, eu folosesc „US-NEISO”).
+
+![instalare](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+Odată ce cheia API și codul zonei sunt introduse în interfața extensiei, punctul colorat din bara extensiei browserului ar trebui să se schimbe pentru a reflecta consumul de energie din zona dumneavoastră și să vă ofere un indicator despre ce activități consumatoare de energie sunt potrivite pentru moment. Conceptul din spatele acestui sistem de „puncte” mi-a fost inspirat de extensia [Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/translation/README.it.md b/translations/ro/5-browser-extension/solution/translation/README.it.md
new file mode 100644
index 00000000..a1c6546c
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/translation/README.it.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9a6b22a2eff0f499b66236be973b24ad",
+  "translation_date": "2025-08-28T07:48:04+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.it.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: codul de început
+
+Se va utiliza API-ul Signal CO2 de la tmrow pentru a monitoriza utilizarea energiei electrice, cu scopul de a crea o extensie de browser care să ofere un memento direct în browser despre cât de intensă este utilizarea energiei electrice în regiunea ta. Utilizarea acestei extensii personalizate va ajuta la evaluarea activităților proprii pe baza acestor informații.
+
+![captură de ecran a extensiei](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Pentru a începe
+
+Este necesar ca [npm](https://npmjs.com) să fie instalat. Descarcă o copie a acestui cod într-un folder de pe computerul tău.
+
+Instalează toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiește extensia folosind webpack:
+
+```
+npm run build
+```
+
+Pentru a instala pe Edge, folosește meniul „trei puncte” din colțul din dreapta sus al browserului pentru a accesa panoul Extensii. Dacă nu este deja activată, activează Modul dezvoltator (în partea de jos, stânga). Selectează „Încarcă necomprimat” pentru a adăuga o nouă extensie. Deschide folderul „dist” la prompt, iar extensia va fi încărcată. Pentru a o utiliza, vei avea nevoie de o cheie API pentru API-ul CO2 Signal (poți [obține una prin e-mail aici](https://www.co2signal.com/) - introdu adresa ta de e-mail în caseta de pe această pagină) și de [codul pentru regiunea ta](http://api.electricitymap.org/v3/zones) corespunzător [hărții electrice](https://www.electricitymap.org/map) (de exemplu, pentru Boston, „US-NEISO”).
+
+![instalare](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+După ce cheia API și regiunea au fost introduse în interfața extensiei, punctul colorat din bara extensiei browserului ar trebui să se schimbe pentru a reflecta utilizarea energiei din regiune și să ofere o sugestie despre ce activități cu consum ridicat de energie ar fi potrivite de realizat. Conceptul din spatele acestui sistem de „puncte” a fost inspirat de [extensia Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/translation/README.ja.md b/translations/ro/5-browser-extension/solution/translation/README.ja.md
new file mode 100644
index 00000000..5d62327b
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/translation/README.ja.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3f5e6821e0febccfc5d05e7c944d9e3d",
+  "translation_date": "2025-08-28T07:48:30+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.ja.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: Cod finalizat
+
+Construiește o extensie de browser care utilizează API-ul CO2 Signal de la tmrow pentru a urmări consumul de energie și pentru a afișa, ca un memento, cât de intens este consumul de energie în regiunea ta. Folosind această extensie în mod ad-hoc, poți lua decizii informate cu privire la activitățile tale pe baza acestor informații.
+
+![extension screenshot](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Introducere
+
+Este necesar să ai [npm](https://npmjs.com) instalat. Descarcă o copie a acestui cod într-un folder de pe computerul tău.
+
+Instalează toate pachetele necesare.
+
+```
+npm install
+```
+
+Construiește extensia folosind webpack.
+
+```
+npm run build
+```
+
+Pentru a instala pe Edge, găsește panoul „Extensii” din meniul „trei puncte” din colțul din dreapta sus al browserului. De acolo, selectează „Load Unpacked” pentru a încărca noua extensie. Când apare promptul, deschide folderul „dist” și extensia va fi încărcată. Pentru utilizare, vei avea nevoie de o cheie API pentru CO2 Signal ([obține una aici prin email](https://www.co2signal.com/) - introdu adresa ta de email în caseta de pe această pagină) și de [codul corespunzător regiunii tale](http://api.electricitymap.org/v3/zones) de pe [Electricity Map](https://www.electricitymap.org/map) (de exemplu, pentru Boston, folosește 'US-NEISO').
+
+![installing](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+După ce introduci cheia API și regiunea în interfața extensiei, punctul colorat afișat în bara extensiei browserului se va schimba pentru a reflecta consumul de energie din regiunea ta. Acesta îți va indica ce tip de activități care necesită energie sunt potrivite în acel moment. Conceptul acestui sistem de „puncte” mi-a fost inspirat de extensia [Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/solution/translation/README.ms.md b/translations/ro/5-browser-extension/solution/translation/README.ms.md
new file mode 100644
index 00000000..8f9f12c7
--- /dev/null
+++ b/translations/ro/5-browser-extension/solution/translation/README.ms.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "21b364c158c8e4f698de65eeac16c9fe",
+  "translation_date": "2025-08-28T07:49:22+00:00",
+  "source_file": "5-browser-extension/solution/translation/README.ms.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de Browser Carbon Trigger: Cod Complet
+
+Folosind API-ul CO2 Signal de la tmrow pentru a monitoriza consumul de electricitate, construiește o extensie de browser care să te alerteze în legătură cu nivelul de utilizare a energiei electrice din regiunea ta. Utilizarea acestei extensii te va ajuta să iei decizii mai informate cu privire la activitățile tale, bazându-te pe aceste informații.
+
+![captură de ecran a extensiei de browser](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Începe de Aici
+
+Trebuie să ai instalat [npm](https://npmjs.com). Descarcă o copie a acestui cod într-un folder de pe computerul tău.
+
+Instalează toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiește extensia folosind webpack:
+
+```
+npm run build
+```
+
+Pentru a o instala în Edge, folosește meniul cu „trei puncte” din colțul din dreapta sus al browserului pentru a accesa panoul Extensii. De acolo, selectează „Load Unpacked” pentru a încărca o extensie nouă. Deschide folderul „dist” când ți se cere, iar extensia va fi încărcată. Pentru a o utiliza, vei avea nevoie de o cheie API pentru API-ul CO2 Signal ([obține una aici prin e-mail](https://www.co2signal.com/) - introdu adresa ta de e-mail în câmpul de pe această pagină) și de [codul regiunii tale](http://api.electricitymap.org/v3/zones), care corespunde cu [Electricity Map](https://www.electricitymap.org/map) (de exemplu, în Boston, eu folosesc „US-NEISO”).
+
+![descărcare în curs](../../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+După ce introduci cheia API și regiunea în interfața extensiei, punctul colorat din bara extensiei browserului se va schimba pentru a reflecta consumul de energie din regiunea ta și îți va oferi sugestii despre activitățile potrivite pe care le poți desfășura. Conceptul din spatele acestui sistem de „puncte” mi-a fost inspirat de [extensia de browser Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/5-browser-extension/start/README.md b/translations/ro/5-browser-extension/start/README.md
new file mode 100644
index 00000000..6694887c
--- /dev/null
+++ b/translations/ro/5-browser-extension/start/README.md
@@ -0,0 +1,41 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "26fd39046d264ba185dcb086d3a8cf3e",
+  "translation_date": "2025-08-28T07:46:44+00:00",
+  "source_file": "5-browser-extension/start/README.md",
+  "language_code": "ro"
+}
+-->
+# Extensia de browser Carbon Trigger: Cod de început
+
+Folosind API-ul CO2 Signal de la tmrow pentru a monitoriza consumul de energie electrică, construiește o extensie de browser astfel încât să ai un memento direct în browser despre cât de intens este consumul de energie electrică în regiunea ta. Utilizarea acestei extensii în mod ad-hoc te va ajuta să iei decizii informate cu privire la activitățile tale, bazându-te pe aceste informații.
+
+![captură de ecran a extensiei](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3875e1bc9405edd45a3d2e02963e48900adb91926a62a5807.ro.png)
+
+## Începe
+
+Va trebui să ai instalat [npm](https://npmjs.com). Descarcă o copie a acestui cod într-un folder de pe computerul tău.
+
+Instalează toate pachetele necesare:
+
+```
+npm install
+```
+
+Construiește extensia folosind webpack:
+
+```
+npm run build
+```
+
+Pentru a instala pe Edge, folosește meniul „trei puncte” din colțul din dreapta sus al browserului pentru a găsi panoul Extensii. De acolo, selectează „Load Unpacked” pentru a încărca o extensie nouă. La prompt, deschide folderul „dist” și extensia va fi încărcată. Pentru a o utiliza, vei avea nevoie de o cheie API pentru API-ul CO2 Signal ([obține una aici prin email](https://www.co2signal.com/) - introdu adresa ta de email în căsuța de pe această pagină) și de [codul pentru regiunea ta](http://api.electricitymap.org/v3/zones) corespunzător [Electricity Map](https://www.electricitymap.org/map) (de exemplu, în Boston, folosesc „US-NEISO”).
+
+![instalare](../../../../translated_images/install-on-edge.78634f02842c48283726c531998679a6f03a45556b2ee99d8ff231fe41446324.ro.png)
+
+Odată ce cheia API și regiunea sunt introduse în interfața extensiei, punctul colorat din bara extensiei browserului ar trebui să se schimbe pentru a reflecta consumul de energie din regiunea ta și să îți ofere o sugestie despre ce activități consumatoare de energie ar fi potrivite să le desfășori. Conceptul din spatele acestui sistem de „puncte” mi-a fost inspirat de [extensia Energy Lollipop](https://energylollipop.com/) pentru emisiile din California.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/1-introduction/README.md b/translations/ro/6-space-game/1-introduction/README.md
new file mode 100644
index 00000000..9c03ccaa
--- /dev/null
+++ b/translations/ro/6-space-game/1-introduction/README.md
@@ -0,0 +1,238 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "d9da6dc61fb712b29f65e108c79b8a5d",
+  "translation_date": "2025-08-28T08:01:28+00:00",
+  "source_file": "6-space-game/1-introduction/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial Partea 1: Introducere
+
+![video](../../../../6-space-game/images/pewpew.gif)
+
+## Chestionar înainte de curs
+
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/29)
+
+### Moștenire și Compoziție în dezvoltarea jocurilor
+
+În lecțiile anterioare, nu a fost nevoie să te preocupi prea mult de arhitectura aplicațiilor pe care le-ai construit, deoarece proiectele erau de dimensiuni mici. Totuși, pe măsură ce aplicațiile tale cresc în dimensiune și complexitate, deciziile arhitecturale devin mai importante. Există două abordări majore pentru crearea aplicațiilor mai mari în JavaScript: *compoziția* sau *moștenirea*. Ambele au avantaje și dezavantaje, dar să le explicăm în contextul unui joc.
+
+✅ Una dintre cele mai faimoase cărți de programare scrise vreodată are legătură cu [modelele de design](https://en.wikipedia.org/wiki/Design_Patterns).
+
+Într-un joc ai `obiecte de joc`, care sunt obiecte ce există pe un ecran. Asta înseamnă că au o locație într-un sistem de coordonate cartezian, caracterizată printr-o coordonată `x` și `y`. Pe măsură ce dezvolți un joc, vei observa că toate obiectele de joc au o proprietate standard, comună pentru fiecare joc pe care îl creezi, și anume elemente care sunt:
+
+- **bazate pe locație** Majoritatea, dacă nu toate, elementele de joc sunt bazate pe locație. Asta înseamnă că au o locație, un `x` și un `y`.
+- **mobile** Acestea sunt obiecte care se pot deplasa într-o locație nouă. De obicei, acestea sunt un erou, un monstru sau un NPC (personaj non-jucător), dar nu, de exemplu, un obiect static precum un copac.
+- **autodistructive** Aceste obiecte există doar pentru o perioadă de timp determinată înainte de a se pregăti pentru ștergere. De obicei, acest lucru este reprezentat printr-un boolean `dead` sau `destroyed` care semnalează motorului de joc că acest obiect nu ar mai trebui să fie redat.
+- **cu timp de răcire** 'Timpul de răcire' este o proprietate tipică pentru obiectele de scurtă durată. Un exemplu tipic este un text sau un efect grafic, cum ar fi o explozie, care ar trebui să fie vizibil doar pentru câteva milisecunde.
+
+✅ Gândește-te la un joc precum Pac-Man. Poți identifica cele patru tipuri de obiecte enumerate mai sus în acest joc?
+
+### Exprimarea comportamentului
+
+Tot ce am descris mai sus reprezintă comportamente pe care obiectele de joc le pot avea. Deci, cum codificăm aceste comportamente? Putem exprima acest comportament ca metode asociate fie claselor, fie obiectelor.
+
+**Clase**
+
+Ideea este să folosim `clase` împreună cu `moștenirea` pentru a adăuga un anumit comportament unei clase.
+
+✅ Moștenirea este un concept important de înțeles. Află mai multe din [articolul MDN despre moștenire](https://developer.mozilla.org/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).
+
+Exprimat prin cod, un obiect de joc poate arăta astfel:
+
+```javascript
+
+//set up the class GameObject
+class GameObject {
+  constructor(x, y, type) {
+    this.x = x;
+    this.y = y;
+    this.type = type;
+  }
+}
+
+//this class will extend the GameObject's inherent class properties
+class Movable extends GameObject {
+  constructor(x,y, type) {
+    super(x,y, type)
+  }
+
+//this movable object can be moved on the screen
+  moveTo(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+}
+
+//this is a specific class that extends the Movable class, so it can take advantage of all the properties that it inherits
+class Hero extends Movable {
+  constructor(x,y) {
+    super(x,y, 'Hero')
+  }
+}
+
+//this class, on the other hand, only inherits the GameObject properties
+class Tree extends GameObject {
+  constructor(x,y) {
+    super(x,y, 'Tree')
+  }
+}
+
+//a hero can move...
+const hero = new Hero();
+hero.moveTo(5,5);
+
+//but a tree cannot
+const tree = new Tree();
+```
+
+✅ Petrece câteva minute imaginându-ți un erou din Pac-Man (de exemplu, Inky, Pinky sau Blinky) și cum ar fi scris în JavaScript.
+
+**Compoziție**
+
+O altă modalitate de a gestiona moștenirea obiectelor este prin utilizarea *Compoziției*. În acest caz, obiectele își exprimă comportamentul astfel:
+
+```javascript
+//create a constant gameObject
+const gameObject = {
+  x: 0,
+  y: 0,
+  type: ''
+};
+
+//...and a constant movable
+const movable = {
+  moveTo(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+}
+//then the constant movableObject is composed of the gameObject and movable constants
+const movableObject = {...gameObject, ...movable};
+
+//then create a function to create a new Hero who inherits the movableObject properties
+function createHero(x, y) {
+  return {
+    ...movableObject,
+    x,
+    y,
+    type: 'Hero'
+  }
+}
+//...and a static object that inherits only the gameObject properties
+function createStatic(x, y, type) {
+  return {
+    ...gameObject
+    x,
+    y,
+    type
+  }
+}
+//create the hero and move it
+const hero = createHero(10,10);
+hero.moveTo(5,5);
+//and create a static tree which only stands around
+const tree = createStatic(0,0, 'Tree'); 
+```
+
+**Ce model ar trebui să folosesc?**
+
+Depinde de tine ce model alegi. JavaScript suportă ambele paradigme.
+
+--
+
+Un alt model comun în dezvoltarea jocurilor abordează problema gestionării experienței utilizatorului și a performanței jocului.
+
+## Modelul Pub/Sub
+
+✅ Pub/Sub înseamnă 'publish-subscribe' (publicare-abonare)
+
+Acest model abordează ideea că părțile disparate ale aplicației tale nu ar trebui să știe una despre cealaltă. De ce? Face mult mai ușor să vezi ce se întâmplă în general dacă diversele părți sunt separate. De asemenea, face mai ușor să schimbi brusc comportamentul dacă este necesar. Cum realizăm acest lucru? Stabilim câteva concepte:
+
+- **mesaj**: Un mesaj este de obicei un șir de text însoțit de o sarcină opțională (o bucată de date care clarifică despre ce este vorba în mesaj). Un mesaj tipic într-un joc poate fi `KEY_PRESSED_ENTER`.
+- **publisher**: Acest element *publică* un mesaj și îl trimite tuturor abonaților.
+- **subscriber**: Acest element *ascultă* mesaje specifice și execută o anumită sarcină ca rezultat al primirii acestui mesaj, cum ar fi lansarea unui laser.
+
+Implementarea este destul de mică, dar este un model foarte puternic. Iată cum poate fi implementat:
+
+```javascript
+//set up an EventEmitter class that contains listeners
+class EventEmitter {
+  constructor() {
+    this.listeners = {};
+  }
+//when a message is received, let the listener to handle its payload
+  on(message, listener) {
+    if (!this.listeners[message]) {
+      this.listeners[message] = [];
+    }
+    this.listeners[message].push(listener);
+  }
+//when a message is sent, send it to a listener with some payload
+  emit(message, payload = null) {
+    if (this.listeners[message]) {
+      this.listeners[message].forEach(l => l(message, payload))
+    }
+  }
+}
+
+```
+
+Pentru a utiliza codul de mai sus, putem crea o implementare foarte mică:
+
+```javascript
+//set up a message structure
+const Messages = {
+  HERO_MOVE_LEFT: 'HERO_MOVE_LEFT'
+};
+//invoke the eventEmitter you set up above
+const eventEmitter = new EventEmitter();
+//set up a hero
+const hero = createHero(0,0);
+//let the eventEmitter know to watch for messages pertaining to the hero moving left, and act on it
+eventEmitter.on(Messages.HERO_MOVE_LEFT, () => {
+  hero.move(5,0);
+});
+
+//set up the window to listen for the keyup event, specifically if the left arrow is hit, emit a message to move the hero left
+window.addEventListener('keyup', (evt) => {
+  if (evt.key === 'ArrowLeft') {
+    eventEmitter.emit(Messages.HERO_MOVE_LEFT)
+  }
+});
+```
+
+Mai sus conectăm un eveniment de tastatură, `ArrowLeft`, și trimitem mesajul `HERO_MOVE_LEFT`. Ascultăm acest mesaj și mutăm `eroul` ca rezultat. Punctul forte al acestui model este că ascultătorul de evenimente și eroul nu știu unul despre celălalt. Poți remapa `ArrowLeft` la tasta `A`. În plus, ar fi posibil să faci ceva complet diferit pe `ArrowLeft` făcând câteva modificări funcției `on` a eventEmitter-ului:
+
+```javascript
+eventEmitter.on(Messages.HERO_MOVE_LEFT, () => {
+  hero.move(5,0);
+});
+```
+
+Pe măsură ce lucrurile devin mai complicate pe măsură ce jocul tău crește, acest model rămâne la fel de simplu, iar codul tău rămâne curat. Este cu adevărat recomandat să adopți acest model.
+
+---
+
+## 🚀 Provocare
+
+Gândește-te cum modelul pub-sub poate îmbunătăți un joc. Ce părți ar trebui să emită evenimente și cum ar trebui să reacționeze jocul la acestea? Acum ai șansa să fii creativ, gândindu-te la un joc nou și la cum ar putea funcționa părțile sale.
+
+## Chestionar după curs
+
+[Chestionar după curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/30)
+
+## Recapitulare și Studiu Individual
+
+Află mai multe despre Pub/Sub [citind despre acest subiect](https://docs.microsoft.com/azure/architecture/patterns/publisher-subscriber/?WT.mc_id=academic-77807-sagibbon).
+
+## Temă
+
+[Crează un prototip de joc](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/1-introduction/assignment.md b/translations/ro/6-space-game/1-introduction/assignment.md
new file mode 100644
index 00000000..0dfa5646
--- /dev/null
+++ b/translations/ro/6-space-game/1-introduction/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "009bdedee9cc82988264be8cb31f9bf4",
+  "translation_date": "2025-08-28T08:02:27+00:00",
+  "source_file": "6-space-game/1-introduction/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Creează un prototip de joc
+
+## Instrucțiuni
+
+Folosind exemplele de cod din lecție, scrie o reprezentare a unui joc care îți place. Va trebui să fie un joc simplu, dar scopul este să utilizezi fie modelul de clasă, fie modelul de compoziție, împreună cu modelul pub/sub, pentru a arăta cum ar putea fi lansat un joc. Fii creativ!
+
+## Criterii de evaluare
+
+| Criterii | Exemplu remarcabil                                     | Exemplu adecvat                                      | Necesită îmbunătățiri                              |
+| -------- | ------------------------------------------------------ | --------------------------------------------------- | -------------------------------------------------- |
+|          | Trei elemente sunt plasate pe ecran și manipulate      | Două elemente sunt plasate pe ecran și manipulate   | Un element este plasat pe ecran și manipulat       |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea realizată de un profesionist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/2-drawing-to-canvas/README.md b/translations/ro/6-space-game/2-drawing-to-canvas/README.md
new file mode 100644
index 00000000..8804a7d9
--- /dev/null
+++ b/translations/ro/6-space-game/2-drawing-to-canvas/README.md
@@ -0,0 +1,230 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "41be8d35e7f30aa9dad10773c35e89c4",
+  "translation_date": "2025-08-28T07:58:47+00:00",
+  "source_file": "6-space-game/2-drawing-to-canvas/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial Partea 2: Desenează Eroul și Monștrii pe Canvas
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/31)
+
+## Canvas-ul
+
+Canvas-ul este un element HTML care, în mod implicit, nu are conținut; este o pagină goală. Trebuie să adaugi conținut desenând pe el.
+
+✅ Citește [mai multe despre API-ul Canvas](https://developer.mozilla.org/docs/Web/API/Canvas_API) pe MDN.
+
+Iată cum este de obicei declarat, ca parte a corpului paginii:
+
+```html
+<canvas id="myCanvas" width="200" height="100"></canvas>
+```
+
+Mai sus setăm `id`, `width` și `height`.
+
+- `id`: setează acest atribut pentru a obține o referință atunci când ai nevoie să interacționezi cu el.
+- `width`: aceasta este lățimea elementului.
+- `height`: aceasta este înălțimea elementului.
+
+## Desenarea geometriei simple
+
+Canvas-ul folosește un sistem de coordonate cartezian pentru a desena lucruri. Astfel, utilizează o axă x și o axă y pentru a exprima unde se află ceva. Poziția `0,0` este colțul din stânga sus, iar colțul din dreapta jos este ceea ce ai setat ca fiind WIDTH și HEIGHT ale canvas-ului.
+
+![grila canvas-ului](../../../../translated_images/canvas_grid.5f209da785ded492a01ece440e3032afe51efa500cc2308e5ea4252487ceaf0b.ro.png)
+> Imagine de la [MDN](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes)
+
+Pentru a desena pe elementul canvas, trebuie să urmezi pașii următori:
+
+1. **Obține o referință** la elementul Canvas.
+1. **Obține o referință** la elementul Context care se află pe elementul Canvas.
+1. **Efectuează o operațiune de desenare** folosind elementul Context.
+
+Codul pentru pașii de mai sus arată de obicei astfel:
+
+```javascript
+// draws a red rectangle
+//1. get the canvas reference
+canvas = document.getElementById("myCanvas");
+
+//2. set the context to 2D to draw basic shapes
+ctx = canvas.getContext("2d");
+
+//3. fill it with the color red
+ctx.fillStyle = 'red';
+
+//4. and draw a rectangle with these parameters, setting location and size
+ctx.fillRect(0,0, 200, 200) // x,y,width, height
+```
+
+✅ API-ul Canvas se concentrează în principal pe forme 2D, dar poți desena și elemente 3D pe un site web; pentru aceasta, ai putea folosi [API-ul WebGL](https://developer.mozilla.org/docs/Web/API/WebGL_API).
+
+Poți desena o mulțime de lucruri cu API-ul Canvas, cum ar fi:
+
+- **Forme geometrice**, am arătat deja cum să desenezi un dreptunghi, dar există mult mai multe pe care le poți desena.
+- **Text**, poți desena text cu orice font și culoare dorești.
+- **Imagini**, poți desena o imagine bazată pe un fișier imagine, cum ar fi un .jpg sau .png, de exemplu.
+
+✅ Încearcă! Știi cum să desenezi un dreptunghi, poți desena un cerc pe o pagină? Aruncă o privire la câteva desene interesante realizate cu Canvas pe CodePen. Iată un [exemplu deosebit de impresionant](https://codepen.io/dissimulate/pen/KrAwx).
+
+## Încarcă și desenează un fișier imagine
+
+Poți încărca un fișier imagine creând un obiect `Image` și setând proprietatea sa `src`. Apoi, asculți evenimentul `load` pentru a ști când este gata de utilizare. Codul arată astfel:
+
+### Încarcă fișierul
+
+```javascript
+const img = new Image();
+img.src = 'path/to/my/image.png';
+img.onload = () => {
+  // image loaded and ready to be used
+}
+```
+
+### Model de încărcare a fișierului
+
+Este recomandat să încadrezi codul de mai sus într-o construcție ca aceasta, astfel încât să fie mai ușor de utilizat și să încerci să îl manipulezi doar atunci când este complet încărcat:
+
+```javascript
+function loadAsset(path) {
+  return new Promise((resolve) => {
+    const img = new Image();
+    img.src = path;
+    img.onload = () => {
+      // image loaded and ready to be used
+      resolve(img);
+    }
+  })
+}
+
+// use like so
+
+async function run() {
+  const heroImg = await loadAsset('hero.png')
+  const monsterImg = await loadAsset('monster.png')
+}
+
+```
+
+Pentru a desena elemente de joc pe ecran, codul tău ar arăta astfel:
+
+```javascript
+async function run() {
+  const heroImg = await loadAsset('hero.png')
+  const monsterImg = await loadAsset('monster.png')
+
+  canvas = document.getElementById("myCanvas");
+  ctx = canvas.getContext("2d");
+  ctx.drawImage(heroImg, canvas.width/2,canvas.height/2);
+  ctx.drawImage(monsterImg, 0,0);
+}
+```
+
+## Acum este momentul să începi să construiești jocul tău
+
+### Ce să construiești
+
+Vei construi o pagină web cu un element Canvas. Aceasta ar trebui să afișeze un ecran negru `1024*768`. Ți-am oferit două imagini:
+
+- Nava eroului
+
+   ![Nava eroului](../../../../translated_images/player.dd24c1afa8c71e9b82b2958946d4bad13308681392d4b5ddcc61a0e818ef8088.ro.png)
+
+- Monstru 5*5
+
+   ![Nava monstrului](../../../../translated_images/enemyShip.5df2a822c16650c2fb3c06652e8ec8120cdb9122a6de46b9a1a56d54db22657f.ro.png)
+
+### Pași recomandați pentru a începe dezvoltarea
+
+Localizează fișierele care au fost create pentru tine în subfolderul `your-work`. Acesta ar trebui să conțină următoarele:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Deschide copia acestui folder în Visual Studio Code. Trebuie să ai un mediu de dezvoltare local configurat, de preferat cu Visual Studio Code, NPM și Node instalate. Dacă nu ai `npm` configurat pe computerul tău, [iată cum să faci asta](https://www.npmjs.com/get-npm).
+
+Începe proiectul navigând la folderul `your_work`:
+
+```bash
+cd your-work
+npm start
+```
+
+Comanda de mai sus va porni un server HTTP la adresa `http://localhost:5000`. Deschide un browser și introdu acea adresă. Este o pagină goală acum, dar asta se va schimba.
+
+> Notă: pentru a vedea modificările pe ecran, reîmprospătează browserul.
+
+### Adaugă cod
+
+Adaugă codul necesar în `your-work/app.js` pentru a rezolva următoarele:
+
+1. **Desenează** un canvas cu fundal negru  
+   > sfat: adaugă două linii sub TODO-ul corespunzător în `/app.js`, setând elementul `ctx` să fie negru și coordonatele sus/stânga la 0,0, iar înălțimea și lățimea să fie egale cu cele ale canvas-ului.
+2. **Încarcă** texturi  
+   > sfat: adaugă imaginile player și enemy folosind `await loadTexture` și trecând calea imaginii. Nu le vei vedea încă pe ecran!
+3. **Desenează** eroul în centrul ecranului, în jumătatea de jos  
+   > sfat: folosește API-ul `drawImage` pentru a desena heroImg pe ecran, setând `canvas.width / 2 - 45` și `canvas.height - canvas.height / 4)`.
+4. **Desenează** 5*5 monștri  
+   > sfat: Acum poți decomenta codul pentru a desena inamicii pe ecran. Apoi, mergi la funcția `createEnemies` și completeaz-o.
+
+   Mai întâi, configurează câteva constante:
+
+    ```javascript
+    const MONSTER_TOTAL = 5;
+    const MONSTER_WIDTH = MONSTER_TOTAL * 98;
+    const START_X = (canvas.width - MONSTER_WIDTH) / 2;
+    const STOP_X = START_X + MONSTER_WIDTH;
+    ```
+
+    apoi, creează un loop pentru a desena array-ul de monștri pe ecran:
+
+    ```javascript
+    for (let x = START_X; x < STOP_X; x += 98) {
+        for (let y = 0; y < 50 * 5; y += 50) {
+          ctx.drawImage(enemyImg, x, y);
+        }
+      }
+    ```
+
+## Rezultat
+
+Rezultatul final ar trebui să arate astfel:
+
+![Ecran negru cu un erou și 5*5 monștri](../../../../translated_images/partI-solution.36c53b48c9ffae2a5e15496b23b604ba5393433e4bf91608a7a0a020eb7a2691.ro.png)
+
+## Soluție
+
+Te rugăm să încerci să rezolvi singur mai întâi, dar dacă te blochezi, aruncă o privire la o [soluție](../../../../6-space-game/2-drawing-to-canvas/solution/app.js).
+
+---
+
+## 🚀 Provocare
+
+Ai învățat despre desenarea cu API-ul Canvas concentrat pe 2D; aruncă o privire la [API-ul WebGL](https://developer.mozilla.org/docs/Web/API/WebGL_API) și încearcă să desenezi un obiect 3D.
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/32)
+
+## Recapitulare și Studiu Individual
+
+Află mai multe despre API-ul Canvas [citind despre el](https://developer.mozilla.org/docs/Web/API/Canvas_API).
+
+## Temă
+
+[Experimentează cu API-ul Canvas](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea realizată de un profesionist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/2-drawing-to-canvas/assignment.md b/translations/ro/6-space-game/2-drawing-to-canvas/assignment.md
new file mode 100644
index 00000000..7024163b
--- /dev/null
+++ b/translations/ro/6-space-game/2-drawing-to-canvas/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "ca1cf78a4c60df77ab32a154ec024d7f",
+  "translation_date": "2025-08-28T07:59:45+00:00",
+  "source_file": "6-space-game/2-drawing-to-canvas/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Joacă-te cu API-ul Canvas
+
+## Instrucțiuni
+
+Alege un element din API-ul Canvas și creează ceva interesant în jurul lui. Poți crea o mică galaxie de stele repetate? Poți crea o textură interesantă de linii colorate? Poți căuta inspirație pe CodePen (dar nu copia).
+
+## Criterii de evaluare
+
+| Criterii  | Exemplu                                                  | Adequat                             | Necesită îmbunătățiri |
+| --------- | -------------------------------------------------------- | ----------------------------------- | --------------------- |
+|           | Codul este trimis și arată o textură sau o formă interesantă | Codul este trimis, dar nu funcționează | Codul nu este trimis  |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/3-moving-elements-around/README.md b/translations/ro/6-space-game/3-moving-elements-around/README.md
new file mode 100644
index 00000000..0b45e0a0
--- /dev/null
+++ b/translations/ro/6-space-game/3-moving-elements-around/README.md
@@ -0,0 +1,402 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "23f088add24f0f1fa51014a9e27ea280",
+  "translation_date": "2025-08-28T07:53:25+00:00",
+  "source_file": "6-space-game/3-moving-elements-around/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial Partea 3: Adăugarea Mișcării
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/33)
+
+Jocurile nu sunt prea distractive până când nu ai extratereștri care se mișcă pe ecran! În acest joc, vom folosi două tipuri de mișcări:
+
+- **Mișcare prin tastatură/mouse**: când utilizatorul interacționează cu tastatura sau mouse-ul pentru a muta un obiect pe ecran.
+- **Mișcare indusă de joc**: când jocul mută un obiect la un anumit interval de timp.
+
+Deci, cum mutăm lucrurile pe un ecran? Totul se rezumă la coordonatele carteziene: schimbăm locația (x, y) a obiectului și apoi redesenăm ecranul.
+
+De obicei, ai nevoie de următorii pași pentru a realiza *mișcarea* pe un ecran:
+
+1. **Setează o locație nouă** pentru un obiect; acest lucru este necesar pentru a percepe obiectul ca fiind mutat.
+2. **Curăță ecranul**, ecranul trebuie curățat între desene. Putem face acest lucru desenând un dreptunghi pe care îl umplem cu o culoare de fundal.
+3. **Redesenează obiectul** la noua locație. Procedând astfel, reușim în cele din urmă să mutăm obiectul dintr-o locație în alta.
+
+Iată cum poate arăta acest lucru în cod:
+
+```javascript
+//set the hero's location
+hero.x += 5;
+// clear the rectangle that hosts the hero
+ctx.clearRect(0, 0, canvas.width, canvas.height);
+// redraw the game background and hero
+ctx.fillRect(0, 0, canvas.width, canvas.height)
+ctx.fillStyle = "black";
+ctx.drawImage(heroImg, hero.x, hero.y);
+```
+
+✅ Poți să te gândești la un motiv pentru care redesenarea eroului de mai multe cadre pe secundă ar putea genera costuri de performanță? Citește despre [alternative la acest model](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas).
+
+## Gestionarea evenimentelor de tastatură
+
+Gestionezi evenimentele atașând evenimente specifice la cod. Evenimentele de tastatură sunt declanșate pe întreaga fereastră, în timp ce evenimentele de mouse, cum ar fi un `click`, pot fi conectate la clicul pe un element specific. Vom folosi evenimente de tastatură pe tot parcursul acestui proiect.
+
+Pentru a gestiona un eveniment, trebuie să folosești metoda `addEventListener()` a ferestrei și să îi oferi doi parametri de intrare. Primul parametru este numele evenimentului, de exemplu `keyup`. Al doilea parametru este funcția care ar trebui să fie invocată ca rezultat al producerii evenimentului.
+
+Iată un exemplu:
+
+```javascript
+window.addEventListener('keyup', (evt) => {
+  // `evt.key` = string representation of the key
+  if (evt.key === 'ArrowUp') {
+    // do something
+  }
+})
+```
+
+Pentru evenimentele de tastatură, există două proprietăți pe eveniment pe care le poți folosi pentru a vedea ce tastă a fost apăsată:
+
+- `key`, aceasta este o reprezentare sub formă de șir a tastei apăsate, de exemplu `ArrowUp`
+- `keyCode`, aceasta este o reprezentare numerică, de exemplu `37`, corespunde cu `ArrowLeft`.
+
+✅ Manipularea evenimentelor de tastatură este utilă și în afara dezvoltării de jocuri. La ce alte utilizări te poți gândi pentru această tehnică?
+
+### Taste speciale: un avertisment
+
+Există unele taste *speciale* care afectează fereastra. Asta înseamnă că, dacă asculți un eveniment `keyup` și folosești aceste taste speciale pentru a muta eroul, se va efectua și o derulare orizontală. Din acest motiv, s-ar putea să vrei să *dezactivezi* acest comportament implicit al browserului pe măsură ce îți dezvolți jocul. Ai nevoie de un cod ca acesta:
+
+```javascript
+let onKeyDown = function (e) {
+  console.log(e.keyCode);
+  switch (e.keyCode) {
+    case 37:
+    case 39:
+    case 38:
+    case 40: // Arrow keys
+    case 32:
+      e.preventDefault();
+      break; // Space
+    default:
+      break; // do not block other keys
+  }
+};
+
+window.addEventListener('keydown', onKeyDown);
+```
+
+Codul de mai sus va asigura că tastele săgeți și tasta spațiu au comportamentul *implicit* dezactivat. Mecanismul de *dezactivare* are loc atunci când apelăm `e.preventDefault()`.
+
+## Mișcare indusă de joc
+
+Putem face lucrurile să se miște singure folosind temporizatoare precum funcțiile `setTimeout()` sau `setInterval()` care actualizează locația obiectului la fiecare tic, sau interval de timp. Iată cum poate arăta acest lucru:
+
+```javascript
+let id = setInterval(() => {
+  //move the enemy on the y axis
+  enemy.y += 10;
+})
+```
+
+## Bucla jocului
+
+Bucla jocului este un concept care reprezintă, în esență, o funcție care este invocată la intervale regulate. Se numește bucla jocului deoarece tot ceea ce ar trebui să fie vizibil pentru utilizator este desenat în cadrul buclei. Bucla jocului folosește toate obiectele de joc care fac parte din joc, desenându-le pe toate, cu excepția cazului în care, dintr-un motiv anume, nu mai fac parte din joc. De exemplu, dacă un obiect este un inamic care a fost lovit de un laser și explodează, nu mai face parte din bucla curentă a jocului (vei învăța mai multe despre acest lucru în lecțiile următoare).
+
+Iată cum poate arăta o buclă de joc, exprimată în cod:
+
+```javascript
+let gameLoopId = setInterval(() =>
+  function gameLoop() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    ctx.fillStyle = "black";
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+    drawHero();
+    drawEnemies();
+    drawStaticObjects();
+}, 200);
+```
+
+Bucla de mai sus este invocată la fiecare `200` de milisecunde pentru a redesena canvas-ul. Ai posibilitatea să alegi cel mai bun interval care are sens pentru jocul tău.
+
+## Continuarea Jocului Spațial
+
+Vei lua codul existent și îl vei extinde. Poți începe fie cu codul pe care l-ai finalizat în partea I, fie să folosești codul din [Partea II - starter](../../../../6-space-game/3-moving-elements-around/your-work).
+
+- **Mutarea eroului**: vei adăuga cod pentru a te asigura că poți muta eroul folosind tastele săgeți.
+- **Mutarea inamicilor**: va trebui, de asemenea, să adaugi cod pentru a te asigura că inamicii se mișcă de sus în jos la un anumit ritm.
+
+## Pași recomandați
+
+Găsește fișierele care au fost create pentru tine în subfolderul `your-work`. Ar trebui să conțină următoarele:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Îți începi proiectul în folderul `your_work` tastând:
+
+```bash
+cd your-work
+npm start
+```
+
+Comanda de mai sus va porni un server HTTP la adresa `http://localhost:5000`. Deschide un browser și introdu acea adresă; în acest moment ar trebui să afișeze eroul și toți inamicii; nimic nu se mișcă - încă!
+
+### Adaugă cod
+
+1. **Adaugă obiecte dedicate** pentru `hero`, `enemy` și `game object`, acestea ar trebui să aibă proprietăți `x` și `y`. (Amintește-ți secțiunea despre [Moștenire sau compoziție](../README.md)).
+
+   *INDICIU* `game object` ar trebui să fie cel care are `x` și `y` și abilitatea de a se desena pe un canvas.
+
+   >sfat: începe prin a adăuga o nouă clasă GameObject cu constructorul său definit astfel, și apoi desenează-l pe canvas:
+  
+    ```javascript
+        
+    class GameObject {
+      constructor(x, y) {
+        this.x = x;
+        this.y = y;
+        this.dead = false;
+        this.type = "";
+        this.width = 0;
+        this.height = 0;
+        this.img = undefined;
+      }
+    
+      draw(ctx) {
+        ctx.drawImage(this.img, this.x, this.y, this.width, this.height);
+      }
+    }
+    ```
+
+    Acum, extinde acest GameObject pentru a crea Hero și Enemy.
+    
+    ```javascript
+    class Hero extends GameObject {
+      constructor(x, y) {
+        ...it needs an x, y, type, and speed
+      }
+    }
+    ```
+
+    ```javascript
+    class Enemy extends GameObject {
+      constructor(x, y) {
+        super(x, y);
+        (this.width = 98), (this.height = 50);
+        this.type = "Enemy";
+        let id = setInterval(() => {
+          if (this.y < canvas.height - this.height) {
+            this.y += 5;
+          } else {
+            console.log('Stopped at', this.y)
+            clearInterval(id);
+          }
+        }, 300)
+      }
+    }
+    ```
+
+2. **Adaugă gestionari de evenimente pentru taste** pentru a gestiona navigarea cu tastele (mută eroul sus/jos/stânga/dreapta).
+
+   *AMINTEȘTE-ȚI* că este un sistem cartezian, colțul din stânga sus este `0,0`. De asemenea, amintește-ți să adaugi cod pentru a opri *comportamentul implicit*.
+
+   >sfat: creează funcția ta onKeyDown și atașeaz-o la fereastră:
+
+   ```javascript
+    let onKeyDown = function (e) {
+	      console.log(e.keyCode);
+	        ...add the code from the lesson above to stop default behavior
+	      }
+    };
+
+    window.addEventListener("keydown", onKeyDown);
+   ```
+    
+   Verifică consola browserului în acest moment și urmărește tastele apăsate care sunt înregistrate.
+
+3. **Implementează** [Modelul Pub-Sub](../README.md), acesta va menține codul tău curat pe măsură ce urmezi părțile rămase.
+
+   Pentru a face această ultimă parte, poți:
+
+   1. **Adaugă un ascultător de evenimente** pe fereastră:
+
+       ```javascript
+        window.addEventListener("keyup", (evt) => {
+          if (evt.key === "ArrowUp") {
+            eventEmitter.emit(Messages.KEY_EVENT_UP);
+          } else if (evt.key === "ArrowDown") {
+            eventEmitter.emit(Messages.KEY_EVENT_DOWN);
+          } else if (evt.key === "ArrowLeft") {
+            eventEmitter.emit(Messages.KEY_EVENT_LEFT);
+          } else if (evt.key === "ArrowRight") {
+            eventEmitter.emit(Messages.KEY_EVENT_RIGHT);
+          }
+        });
+        ```
+
+    1. **Creează o clasă EventEmitter** pentru a publica și a te abona la mesaje:
+
+        ```javascript
+        class EventEmitter {
+          constructor() {
+            this.listeners = {};
+          }
+        
+          on(message, listener) {
+            if (!this.listeners[message]) {
+              this.listeners[message] = [];
+            }
+            this.listeners[message].push(listener);
+          }
+        
+          emit(message, payload = null) {
+            if (this.listeners[message]) {
+              this.listeners[message].forEach((l) => l(message, payload));
+            }
+          }
+        }
+        ```
+
+    1. **Adaugă constante** și configurează EventEmitter:
+
+        ```javascript
+        const Messages = {
+          KEY_EVENT_UP: "KEY_EVENT_UP",
+          KEY_EVENT_DOWN: "KEY_EVENT_DOWN",
+          KEY_EVENT_LEFT: "KEY_EVENT_LEFT",
+          KEY_EVENT_RIGHT: "KEY_EVENT_RIGHT",
+        };
+        
+        let heroImg, 
+            enemyImg, 
+            laserImg,
+            canvas, ctx, 
+            gameObjects = [], 
+            hero, 
+            eventEmitter = new EventEmitter();
+        ```
+
+    1. **Inițializează jocul**
+
+    ```javascript
+    function initGame() {
+      gameObjects = [];
+      createEnemies();
+      createHero();
+    
+      eventEmitter.on(Messages.KEY_EVENT_UP, () => {
+        hero.y -=5 ;
+      })
+    
+      eventEmitter.on(Messages.KEY_EVENT_DOWN, () => {
+        hero.y += 5;
+      });
+    
+      eventEmitter.on(Messages.KEY_EVENT_LEFT, () => {
+        hero.x -= 5;
+      });
+    
+      eventEmitter.on(Messages.KEY_EVENT_RIGHT, () => {
+        hero.x += 5;
+      });
+    }
+    ```
+
+1. **Configurează bucla jocului**
+
+   Refactorizează funcția window.onload pentru a inițializa jocul și a configura o buclă de joc la un interval potrivit. Vei adăuga și o rază laser:
+
+    ```javascript
+    window.onload = async () => {
+      canvas = document.getElementById("canvas");
+      ctx = canvas.getContext("2d");
+      heroImg = await loadTexture("assets/player.png");
+      enemyImg = await loadTexture("assets/enemyShip.png");
+      laserImg = await loadTexture("assets/laserRed.png");
+    
+      initGame();
+      let gameLoopId = setInterval(() => {
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        ctx.fillStyle = "black";
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+        drawGameObjects(ctx);
+      }, 100)
+      
+    };
+    ```
+
+5. **Adaugă cod** pentru a muta inamicii la un anumit interval.
+
+    Refactorizează funcția `createEnemies()` pentru a crea inamicii și a-i adăuga în noua clasă gameObjects:
+
+    ```javascript
+    function createEnemies() {
+      const MONSTER_TOTAL = 5;
+      const MONSTER_WIDTH = MONSTER_TOTAL * 98;
+      const START_X = (canvas.width - MONSTER_WIDTH) / 2;
+      const STOP_X = START_X + MONSTER_WIDTH;
+    
+      for (let x = START_X; x < STOP_X; x += 98) {
+        for (let y = 0; y < 50 * 5; y += 50) {
+          const enemy = new Enemy(x, y);
+          enemy.img = enemyImg;
+          gameObjects.push(enemy);
+        }
+      }
+    }
+    ```
+    
+    și adaugă o funcție `createHero()` pentru a face un proces similar pentru erou.
+    
+    ```javascript
+    function createHero() {
+      hero = new Hero(
+        canvas.width / 2 - 45,
+        canvas.height - canvas.height / 4
+      );
+      hero.img = heroImg;
+      gameObjects.push(hero);
+    }
+    ```
+
+    și, în final, adaugă o funcție `drawGameObjects()` pentru a începe desenarea:
+
+    ```javascript
+    function drawGameObjects(ctx) {
+      gameObjects.forEach(go => go.draw(ctx));
+    }
+    ```
+
+    Inamicii tăi ar trebui să înceapă să avanseze spre nava ta spațială!
+
+---
+
+## 🚀 Provocare
+
+După cum poți vedea, codul tău poate deveni un "cod spaghetti" atunci când începi să adaugi funcții, variabile și clase. Cum poți organiza mai bine codul astfel încât să fie mai ușor de citit? Schițează un sistem pentru a-ți organiza codul, chiar dacă acesta rămâne într-un singur fișier.
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/34)
+
+## Recapitulare și Studiu Individual
+
+Deși scriem jocul nostru fără a folosi framework-uri, există multe framework-uri bazate pe JavaScript pentru dezvoltarea de jocuri pe canvas. Alocă timp pentru a face [cercetări despre acestea](https://github.com/collections/javascript-game-engines).
+
+## Temă
+
+[Comentează-ți codul](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/3-moving-elements-around/assignment.md b/translations/ro/6-space-game/3-moving-elements-around/assignment.md
new file mode 100644
index 00000000..753541ff
--- /dev/null
+++ b/translations/ro/6-space-game/3-moving-elements-around/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "ccfcd8c2932761359fbaff3d6b01ace4",
+  "translation_date": "2025-08-28T07:54:55+00:00",
+  "source_file": "6-space-game/3-moving-elements-around/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Comentează Codul Tău
+
+## Instrucțiuni
+
+Parcurge fișierul tău /app.js din folderul jocului și găsește modalități de a-l comenta și organiza. Este foarte ușor ca codul să scape de sub control, iar acum este o ocazie bună să adaugi comentarii pentru a te asigura că ai un cod ușor de citit, pe care să-l poți folosi mai târziu.
+
+## Criterii de evaluare
+
+| Criterii | Exemplare                                                          | Adecvate                              | Necesită îmbunătățiri                                          |
+| -------- | ------------------------------------------------------------------ | ------------------------------------- | -------------------------------------------------------------- |
+|          | Codul din `app.js` este complet comentat și organizat în blocuri logice | Codul din `app.js` este comentat adecvat | Codul din `app.js` este oarecum dezorganizat și lipsit de comentarii bune |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/4-collision-detection/README.md b/translations/ro/6-space-game/4-collision-detection/README.md
new file mode 100644
index 00000000..6bd67cb6
--- /dev/null
+++ b/translations/ro/6-space-game/4-collision-detection/README.md
@@ -0,0 +1,311 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "2e83e38c35dc003f046d7cc0bbfd4920",
+  "translation_date": "2025-08-28T07:56:56+00:00",
+  "source_file": "6-space-game/4-collision-detection/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial Partea 4: Adăugarea unui Laser și Detectarea Coliziunilor
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/35)
+
+În această lecție vei învăța cum să tragi cu lasere folosind JavaScript! Vom adăuga două lucruri în jocul nostru:
+
+- **Un laser**: acest laser este tras din nava eroului tău și se deplasează vertical în sus
+- **Detectarea coliziunilor**, ca parte a implementării capacității de a *trage*, vom adăuga și câteva reguli interesante de joc:
+   - **Laserul lovește inamicul**: Inamicul moare dacă este lovit de un laser
+   - **Laserul lovește partea de sus a ecranului**: Un laser este distrus dacă lovește partea de sus a ecranului
+   - **Coliziunea dintre inamic și erou**: Un inamic și eroul sunt distruși dacă se lovesc unul de altul
+   - **Inamicul lovește partea de jos a ecranului**: Un inamic și eroul sunt distruși dacă inamicul ajunge în partea de jos a ecranului
+
+Pe scurt, tu -- *eroul* -- trebuie să lovești toți inamicii cu un laser înainte ca aceștia să ajungă în partea de jos a ecranului.
+
+✅ Fă puțină cercetare despre primul joc pe calculator scris vreodată. Ce funcționalitate avea?
+
+Să fim eroici împreună!
+
+## Detectarea coliziunilor
+
+Cum facem detectarea coliziunilor? Trebuie să ne gândim la obiectele din joc ca la niște dreptunghiuri care se mișcă. De ce, te-ai putea întreba? Ei bine, imaginea folosită pentru a desena un obiect de joc este un dreptunghi: are un `x`, `y`, `lățime` și `înălțime`.
+
+Dacă două dreptunghiuri, adică un erou și un inamic, *se intersectează*, ai o coliziune. Ce ar trebui să se întâmple atunci depinde de regulile jocului. Pentru a implementa detectarea coliziunilor, ai nevoie de următoarele:
+
+1. O metodă de a obține o reprezentare dreptunghiulară a unui obiect de joc, ceva de genul:
+
+   ```javascript
+   rectFromGameObject() {
+     return {
+       top: this.y,
+       left: this.x,
+       bottom: this.y + this.height,
+       right: this.x + this.width
+     }
+   }
+   ```
+
+2. O funcție de comparație, care poate arăta astfel:
+
+   ```javascript
+   function intersectRect(r1, r2) {
+     return !(r2.left > r1.right ||
+       r2.right < r1.left ||
+       r2.top > r1.bottom ||
+       r2.bottom < r1.top);
+   }
+   ```
+
+## Cum distrugem lucruri
+
+Pentru a distruge lucruri într-un joc, trebuie să informezi jocul că nu ar mai trebui să deseneze acel obiect în bucla jocului care se declanșează la un anumit interval. O modalitate de a face acest lucru este să marchezi un obiect de joc ca fiind *mort* atunci când se întâmplă ceva, astfel:
+
+```javascript
+// collision happened
+enemy.dead = true
+```
+
+Apoi poți elimina obiectele *moarte* înainte de a redesena ecranul, astfel:
+
+```javascript
+gameObjects = gameObject.filter(go => !go.dead);
+```
+
+## Cum tragem cu un laser
+
+Tragerea cu un laser înseamnă să răspunzi la un eveniment de tastatură și să creezi un obiect care se mișcă într-o anumită direcție. Prin urmare, trebuie să parcurgem următorii pași:
+
+1. **Creează un obiect laser**: din partea de sus a navei eroului, care, odată creat, începe să se deplaseze în sus spre partea de sus a ecranului.
+2. **Atașează cod la un eveniment de tastatură**: trebuie să alegem o tastă de pe tastatură care să reprezinte acțiunea de a trage cu laserul.
+3. **Creează un obiect de joc care arată ca un laser** atunci când tasta este apăsată.
+
+## Cooldown pentru laser
+
+Laserul trebuie să fie tras de fiecare dată când apeși o tastă, cum ar fi *space*. Pentru a preveni ca jocul să producă prea multe lasere într-un timp scurt, trebuie să rezolvăm acest lucru. Soluția este implementarea unui așa-numit *cooldown*, un cronometru, care asigură că un laser poate fi tras doar la anumite intervale. Poți implementa acest lucru astfel:
+
+```javascript
+class Cooldown {
+  constructor(time) {
+    this.cool = false;
+    setTimeout(() => {
+      this.cool = true;
+    }, time)
+  }
+}
+
+class Weapon {
+  constructor {
+  }
+  fire() {
+    if (!this.cooldown || this.cooldown.cool) {
+      // produce a laser
+      this.cooldown = new Cooldown(500);
+    } else {
+      // do nothing - it hasn't cooled down yet.
+    }
+  }
+}
+```
+
+✅ Consultă lecția 1 din seria jocului spațial pentru a-ți reaminti despre *cooldowns*.
+
+## Ce să construiești
+
+Vei lua codul existent (pe care ar fi trebuit să-l cureți și să-l refactorizezi) din lecția anterioară și îl vei extinde. Poți începe fie cu codul din partea a II-a, fie cu codul din [Partea III - starter](../../../../../../../../../your-work).
+
+> sfat: laserul cu care vei lucra este deja în folderul tău de resurse și este referit de codul tău
+
+- **Adaugă detectarea coliziunilor**, când un laser se ciocnește cu ceva, următoarele reguli ar trebui să se aplice:
+   1. **Laserul lovește inamicul**: inamicul moare dacă este lovit de un laser
+   2. **Laserul lovește partea de sus a ecranului**: Un laser este distrus dacă lovește partea de sus a ecranului
+   3. **Coliziunea dintre inamic și erou**: un inamic și eroul sunt distruși dacă se lovesc unul de altul
+   4. **Inamicul lovește partea de jos a ecranului**: Un inamic și eroul sunt distruși dacă inamicul ajunge în partea de jos a ecranului
+
+## Pași recomandați
+
+Găsește fișierele care au fost create pentru tine în subfolderul `your-work`. Acesta ar trebui să conțină următoarele:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+  -| laserRed.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Pornește proiectul din folderul `your_work` tastând:
+
+```bash
+cd your-work
+npm start
+```
+
+Comanda de mai sus va porni un server HTTP la adresa `http://localhost:5000`. Deschide un browser și introdu acea adresă, iar în acest moment ar trebui să afișeze eroul și toți inamicii, dar nimic nu se mișcă - încă :).
+
+### Adaugă cod
+
+1. **Configurează o reprezentare dreptunghiulară a obiectului tău de joc pentru a gestiona coliziunile** Codul de mai jos îți permite să obții o reprezentare dreptunghiulară a unui `GameObject`. Editează clasa GameObject pentru a o extinde:
+
+    ```javascript
+    rectFromGameObject() {
+        return {
+          top: this.y,
+          left: this.x,
+          bottom: this.y + this.height,
+          right: this.x + this.width,
+        };
+      }
+    ```
+
+2. **Adaugă cod care verifică coliziunile** Aceasta va fi o funcție nouă care testează dacă două dreptunghiuri se intersectează:
+
+    ```javascript
+    function intersectRect(r1, r2) {
+      return !(
+        r2.left > r1.right ||
+        r2.right < r1.left ||
+        r2.top > r1.bottom ||
+        r2.bottom < r1.top
+      );
+    }
+    ```
+
+3. **Adaugă capacitatea de a trage cu laserul**
+   1. **Adaugă un mesaj pentru evenimentul de tastatură**. Tasta *space* ar trebui să creeze un laser chiar deasupra navei eroului. Adaugă trei constante în obiectul Messages:
+
+       ```javascript
+        KEY_EVENT_SPACE: "KEY_EVENT_SPACE",
+        COLLISION_ENEMY_LASER: "COLLISION_ENEMY_LASER",
+        COLLISION_ENEMY_HERO: "COLLISION_ENEMY_HERO",
+       ```
+
+   1. **Gestionează tasta space**. Editează funcția `window.addEventListener` pentru evenimentul keyup pentru a gestiona tasta space:
+
+      ```javascript
+        } else if(evt.keyCode === 32) {
+          eventEmitter.emit(Messages.KEY_EVENT_SPACE);
+        }
+      ```
+
+    1. **Adaugă ascultători**. Editează funcția `initGame()` pentru a te asigura că eroul poate trage când tasta space este apăsată:
+
+       ```javascript
+       eventEmitter.on(Messages.KEY_EVENT_SPACE, () => {
+        if (hero.canFire()) {
+          hero.fire();
+        }
+       ```
+
+       și adaugă o nouă funcție `eventEmitter.on()` pentru a asigura comportamentul atunci când un inamic se ciocnește cu un laser:
+
+          ```javascript
+          eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
+            first.dead = true;
+            second.dead = true;
+          })
+          ```
+
+   1. **Mișcă obiectul**, Asigură-te că laserul se deplasează treptat spre partea de sus a ecranului. Vei crea o nouă clasă Laser care extinde `GameObject`, așa cum ai făcut înainte: 
+   
+      ```javascript
+        class Laser extends GameObject {
+        constructor(x, y) {
+          super(x,y);
+          (this.width = 9), (this.height = 33);
+          this.type = 'Laser';
+          this.img = laserImg;
+          let id = setInterval(() => {
+            if (this.y > 0) {
+              this.y -= 15;
+            } else {
+              this.dead = true;
+              clearInterval(id);
+            }
+          }, 100)
+        }
+      }
+      ```
+
+   1. **Gestionează coliziunile**, Implementează regulile de coliziune pentru laser. Adaugă o funcție `updateGameObjects()` care testează obiectele care se ciocnesc:
+
+      ```javascript
+      function updateGameObjects() {
+        const enemies = gameObjects.filter(go => go.type === 'Enemy');
+        const lasers = gameObjects.filter((go) => go.type === "Laser");
+      // laser hit something
+        lasers.forEach((l) => {
+          enemies.forEach((m) => {
+            if (intersectRect(l.rectFromGameObject(), m.rectFromGameObject())) {
+            eventEmitter.emit(Messages.COLLISION_ENEMY_LASER, {
+              first: l,
+              second: m,
+            });
+          }
+         });
+      });
+
+        gameObjects = gameObjects.filter(go => !go.dead);
+      }  
+      ```
+
+      Asigură-te că adaugi `updateGameObjects()` în bucla jocului din `window.onload`.
+
+   4. **Implementează cooldown** pentru laser, astfel încât să poată fi tras doar la anumite intervale.
+
+      În cele din urmă, editează clasa Hero astfel încât să poată gestiona cooldown-ul:
+
+       ```javascript
+      class Hero extends GameObject {
+        constructor(x, y) {
+          super(x, y);
+          (this.width = 99), (this.height = 75);
+          this.type = "Hero";
+          this.speed = { x: 0, y: 0 };
+          this.cooldown = 0;
+        }
+        fire() {
+          gameObjects.push(new Laser(this.x + 45, this.y - 10));
+          this.cooldown = 500;
+    
+          let id = setInterval(() => {
+            if (this.cooldown > 0) {
+              this.cooldown -= 100;
+            } else {
+              clearInterval(id);
+            }
+          }, 200);
+        }
+        canFire() {
+          return this.cooldown === 0;
+        }
+      }
+      ```
+
+În acest moment, jocul tău are ceva funcționalitate! Poți naviga cu tastele săgeți, trage cu laserul folosind tasta space, iar inamicii dispar când îi lovești. Bravo!
+
+---
+
+## 🚀 Provocare
+
+Adaugă o explozie! Uită-te la resursele jocului din [repo-ul Space Art](../../../../6-space-game/solution/spaceArt/readme.txt) și încearcă să adaugi o explozie atunci când laserul lovește un extraterestru.
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/36)
+
+## Recapitulare și Studiu Individual
+
+Experimentează cu intervalele din jocul tău de până acum. Ce se întâmplă când le schimbi? Citește mai multe despre [evenimentele de temporizare în JavaScript](https://www.freecodecamp.org/news/javascript-timing-events-settimeout-and-setinterval/).
+
+## Temă
+
+[Explorează coliziunile](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/4-collision-detection/assignment.md b/translations/ro/6-space-game/4-collision-detection/assignment.md
new file mode 100644
index 00000000..db645414
--- /dev/null
+++ b/translations/ro/6-space-game/4-collision-detection/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8a0a097b45e7c75a611e2795e4013f16",
+  "translation_date": "2025-08-28T07:58:02+00:00",
+  "source_file": "6-space-game/4-collision-detection/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Explorează Coliziunile
+
+## Instrucțiuni
+
+Pentru a înțelege mai bine cum funcționează coliziunile, construiește un joc foarte simplu cu câteva obiecte care se ciocnesc. Fă-le să se miște prin apăsări de taste sau clicuri de mouse și fă ca ceva să se întâmple cu unul dintre obiecte atunci când este lovit. Poate fi ceva de genul unui meteorit care lovește Pământul sau mașinuțe tamponându-se. Fii creativ!
+
+## Criterii de evaluare
+
+| Criteriu | Exemplu                                                                                                                  | Adecvat                       | Necesită îmbunătățiri |
+| -------- | ------------------------------------------------------------------------------------------------------------------------ | ----------------------------- | ---------------------- |
+|          | Este produs un exemplu complet de cod funcțional, cu obiecte desenate pe canvas, coliziuni de bază și reacții care apar  | Codul este incomplet într-un fel | Codul nu funcționează corect |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/4-collision-detection/solution/README.md b/translations/ro/6-space-game/4-collision-detection/solution/README.md
new file mode 100644
index 00000000..a86e399f
--- /dev/null
+++ b/translations/ro/6-space-game/4-collision-detection/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:58:20+00:00",
+  "source_file": "6-space-game/4-collision-detection/solution/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/4-collision-detection/your-work/README.md b/translations/ro/6-space-game/4-collision-detection/your-work/README.md
new file mode 100644
index 00000000..e6ee594f
--- /dev/null
+++ b/translations/ro/6-space-game/4-collision-detection/your-work/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:58:36+00:00",
+  "source_file": "6-space-game/4-collision-detection/your-work/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/5-keeping-score/README.md b/translations/ro/6-space-game/5-keeping-score/README.md
new file mode 100644
index 00000000..a2866ff7
--- /dev/null
+++ b/translations/ro/6-space-game/5-keeping-score/README.md
@@ -0,0 +1,203 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "4e8250db84b027c9ff816b4e4c093457",
+  "translation_date": "2025-08-28T07:55:15+00:00",
+  "source_file": "6-space-game/5-keeping-score/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial Partea 5: Scor și Vieți
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/37)
+
+În această lecție, vei învăța cum să adaugi un sistem de scor într-un joc și cum să calculezi viețile.
+
+## Afișarea textului pe ecran
+
+Pentru a putea afișa scorul jocului pe ecran, trebuie să știi cum să plasezi text pe ecran. Răspunsul este utilizarea metodei `fillText()` pe obiectul canvas. De asemenea, poți controla alte aspecte, cum ar fi fontul utilizat, culoarea textului și chiar alinierea acestuia (stânga, dreapta, centru). Mai jos este un exemplu de cod care afișează text pe ecran.
+
+```javascript
+ctx.font = "30px Arial";
+ctx.fillStyle = "red";
+ctx.textAlign = "right";
+ctx.fillText("show this on the screen", 0, 0);
+```
+
+✅ Citește mai multe despre [cum să adaugi text pe un canvas](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_text) și simte-te liber să-l faci să arate mai interesant!
+
+## Viața, ca un concept de joc
+
+Conceptul de viață într-un joc este doar un număr. În contextul unui joc spațial, este obișnuit să atribui un set de vieți care sunt scăzute una câte una atunci când nava ta suferă daune. Este plăcut să poți arăta o reprezentare grafică a acestora, cum ar fi mini-nave sau inimi, în loc de un număr.
+
+## Ce să construiești
+
+Adaugă următoarele în jocul tău:
+
+- **Scorul jocului**: Pentru fiecare navă inamică distrusă, eroul ar trebui să primească puncte, sugerăm 100 de puncte per navă. Scorul jocului ar trebui să fie afișat în colțul din stânga jos.
+- **Viață**: Nava ta are trei vieți. Pierzi o viață de fiecare dată când o navă inamică se ciocnește de tine. Scorul vieții ar trebui să fie afișat în colțul din dreapta jos și să fie reprezentat grafic prin următoarea imagine ![imagine viață](../../../../translated_images/life.6fb9f50d53ee0413cd91aa411f7c296e10a1a6de5c4a4197c718b49bf7d63ebf.ro.png).
+
+## Pași recomandați
+
+Localizează fișierele care au fost create pentru tine în subfolderul `your-work`. Acesta ar trebui să conțină următoarele:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+  -| laserRed.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Pornește proiectul tău din folderul `your_work` tastând:
+
+```bash
+cd your-work
+npm start
+```
+
+Comanda de mai sus va porni un server HTTP la adresa `http://localhost:5000`. Deschide un browser și introdu această adresă; în acest moment ar trebui să afișeze eroul și toți inamicii, iar când apeși săgețile stânga și dreapta, eroul se mișcă și poate doborî inamicii.
+
+### Adaugă cod
+
+1. **Copiază resursele necesare** din folderul `solution/assets/` în folderul `your-work`; vei adăuga resursa `life.png`. Adaugă `lifeImg` în funcția `window.onload`: 
+
+    ```javascript
+    lifeImg = await loadTexture("assets/life.png");
+    ```
+
+1. Adaugă `lifeImg` în lista de resurse:
+
+    ```javascript
+    let heroImg,
+    ...
+    lifeImg,
+    ...
+    eventEmitter = new EventEmitter();
+    ```
+  
+2. **Adaugă variabile**. Adaugă cod care să reprezinte scorul total (0) și viețile rămase (3), afișează aceste scoruri pe ecran.
+
+3. **Extinde funcția `updateGameObjects()`**. Extinde funcția `updateGameObjects()` pentru a gestiona coliziunile cu inamicii:
+
+    ```javascript
+    enemies.forEach(enemy => {
+        const heroRect = hero.rectFromGameObject();
+        if (intersectRect(heroRect, enemy.rectFromGameObject())) {
+          eventEmitter.emit(Messages.COLLISION_ENEMY_HERO, { enemy });
+        }
+      })
+    ```
+
+4. **Adaugă `life` și `points`**. 
+   1. **Inițializează variabilele**. Sub `this.cooldown = 0` în clasa `Hero`, setează viața și punctele:
+
+        ```javascript
+        this.life = 3;
+        this.points = 0;
+        ```
+
+   1. **Afișează variabilele pe ecran**. Desenează aceste valori pe ecran:
+
+        ```javascript
+        function drawLife() {
+          // TODO, 35, 27
+          const START_POS = canvas.width - 180;
+          for(let i=0; i < hero.life; i++ ) {
+            ctx.drawImage(
+              lifeImg, 
+              START_POS + (45 * (i+1) ), 
+              canvas.height - 37);
+          }
+        }
+        
+        function drawPoints() {
+          ctx.font = "30px Arial";
+          ctx.fillStyle = "red";
+          ctx.textAlign = "left";
+          drawText("Points: " + hero.points, 10, canvas.height-20);
+        }
+        
+        function drawText(message, x, y) {
+          ctx.fillText(message, x, y);
+        }
+
+        ```
+
+   1. **Adaugă metode în bucla jocului**. Asigură-te că adaugi aceste funcții în funcția `window.onload` sub `updateGameObjects()`:
+
+        ```javascript
+        drawPoints();
+        drawLife();
+        ```
+
+1. **Implementează regulile jocului**. Implementează următoarele reguli:
+
+   1. **Pentru fiecare coliziune între erou și inamic**, scade o viață.
+   
+      Extinde clasa `Hero` pentru a face această scădere:
+
+        ```javascript
+        decrementLife() {
+          this.life--;
+          if (this.life === 0) {
+            this.dead = true;
+          }
+        }
+        ```
+
+   2. **Pentru fiecare laser care lovește un inamic**, crește scorul jocului cu 100 de puncte.
+
+      Extinde clasa `Hero` pentru a face această creștere:
+    
+        ```javascript
+          incrementPoints() {
+            this.points += 100;
+          }
+        ```
+
+        Adaugă aceste funcții în emițătoarele de evenimente pentru coliziuni:
+
+        ```javascript
+        eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
+           first.dead = true;
+           second.dead = true;
+           hero.incrementPoints();
+        })
+
+        eventEmitter.on(Messages.COLLISION_ENEMY_HERO, (_, { enemy }) => {
+           enemy.dead = true;
+           hero.decrementLife();
+        });
+        ```
+
+✅ Fă puțină cercetare pentru a descoperi alte jocuri create folosind JavaScript/Canvas. Care sunt trăsăturile lor comune?
+
+La finalul acestei lucrări, ar trebui să vezi micile nave 'viață' în colțul din dreapta jos, punctele în colțul din stânga jos și ar trebui să vezi cum numărul de vieți scade când te ciocnești cu inamicii și cum punctele cresc când dobori inamicii. Bravo! Jocul tău este aproape complet.
+
+---
+
+## 🚀 Provocare
+
+Codul tău este aproape complet. Poți să-ți imaginezi următorii pași?
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/38)
+
+## Recapitulare și Studiu Individual
+
+Cercetează câteva modalități prin care poți crește sau scădea scorurile și viețile în jocuri. Există câteva motoare de joc interesante, cum ar fi [PlayFab](https://playfab.com). Cum ar putea utilizarea unuia dintre acestea să îmbunătățească jocul tău?
+
+## Temă
+
+[Construiește un Joc cu Scor](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/5-keeping-score/assignment.md b/translations/ro/6-space-game/5-keeping-score/assignment.md
new file mode 100644
index 00000000..5fa98a2b
--- /dev/null
+++ b/translations/ro/6-space-game/5-keeping-score/assignment.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "81f292dbda01685b91735e0398dc0504",
+  "translation_date": "2025-08-28T07:56:04+00:00",
+  "source_file": "6-space-game/5-keeping-score/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc de Scor
+
+## Instrucțiuni
+
+Creează un joc în care să afișezi viața și punctele într-un mod creativ. O sugestie ar fi să arăți viața sub formă de inimi și punctele ca un număr mare în partea de jos, centrat pe ecran. Aruncă o privire aici pentru [Resurse gratuite pentru jocuri](https://www.kenney.nl/)
+
+# Criterii de Evaluare
+
+| Criterii | Exemplară              | Adecvată                    | Necesită Îmbunătățiri      |
+| -------- | ---------------------- | --------------------------- | -------------------------- |
+|          | jocul complet este prezentat | jocul este parțial prezentat | jocul parțial conține erori |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți de faptul că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/5-keeping-score/solution/README.md b/translations/ro/6-space-game/5-keeping-score/solution/README.md
new file mode 100644
index 00000000..27bef604
--- /dev/null
+++ b/translations/ro/6-space-game/5-keeping-score/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:56:18+00:00",
+  "source_file": "6-space-game/5-keeping-score/solution/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/5-keeping-score/your-work/README.md b/translations/ro/6-space-game/5-keeping-score/your-work/README.md
new file mode 100644
index 00000000..36c2d381
--- /dev/null
+++ b/translations/ro/6-space-game/5-keeping-score/your-work/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:56:27+00:00",
+  "source_file": "6-space-game/5-keeping-score/your-work/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/6-end-condition/README.md b/translations/ro/6-space-game/6-end-condition/README.md
new file mode 100644
index 00000000..02a53e15
--- /dev/null
+++ b/translations/ro/6-space-game/6-end-condition/README.md
@@ -0,0 +1,236 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "01336cddd638242e99b133614111ea40",
+  "translation_date": "2025-08-28T07:59:59+00:00",
+  "source_file": "6-space-game/6-end-condition/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial Partea 6: Final și Restart
+
+## Chestionar Pre-Lecție
+
+[Chestionar pre-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/39)
+
+Există diferite moduri de a exprima o *condiție de final* într-un joc. Depinde de tine, ca creator al jocului, să decizi de ce jocul se termină. Iată câteva motive, presupunând că vorbim despre jocul spațial pe care l-ai construit până acum:
+
+- **Au fost distruse `N` nave inamice**: Este destul de comun ca, dacă împarți un joc în diferite niveluri, să fie necesar să distrugi `N` nave inamice pentru a completa un nivel.
+- **Nava ta a fost distrusă**: Există cu siguranță jocuri în care pierzi dacă nava ta este distrusă. O altă abordare comună este conceptul de vieți. De fiecare dată când nava ta este distrusă, pierzi o viață. Odată ce toate viețile sunt pierdute, pierzi jocul.
+- **Ai colectat `N` puncte**: O altă condiție comună de final este să colectezi puncte. Modul în care obții punctele depinde de tine, dar este destul de obișnuit să atribui puncte diferitelor activități, cum ar fi distrugerea unei nave inamice sau colectarea unor obiecte care *cad* atunci când sunt distruse.
+- **Completează un nivel**: Acest lucru poate implica mai multe condiții, cum ar fi distrugerea a `X` nave inamice, colectarea a `Y` puncte sau poate colectarea unui obiect specific.
+
+## Restart
+
+Dacă oamenilor le place jocul tău, este probabil să dorească să-l rejocă. Odată ce jocul se termină, indiferent de motiv, ar trebui să oferi o opțiune de restart.
+
+✅ Gândește-te puțin la condițiile în care consideri că un joc se termină și cum ești invitat să-l repornești.
+
+## Ce să construiești
+
+Vei adăuga aceste reguli jocului tău:
+
+1. **Câștigarea jocului**. Odată ce toate navele inamice au fost distruse, câștigi jocul. În plus, afișează un mesaj de victorie.
+1. **Restart**. Odată ce toate viețile sunt pierdute sau jocul este câștigat, ar trebui să oferi o modalitate de a reporni jocul. Amintește-ți! Va trebui să reinitializezi jocul, iar starea anterioară a jocului ar trebui să fie ștearsă.
+
+## Pași recomandați
+
+Găsește fișierele care au fost create pentru tine în subfolderul `your-work`. Acesta ar trebui să conțină următoarele:
+
+```bash
+-| assets
+  -| enemyShip.png
+  -| player.png
+  -| laserRed.png
+  -| life.png
+-| index.html
+-| app.js
+-| package.json
+```
+
+Pornește proiectul din folderul `your_work` tastând:
+
+```bash
+cd your-work
+npm start
+```
+
+Comanda de mai sus va porni un server HTTP la adresa `http://localhost:5000`. Deschide un browser și introdu această adresă. Jocul tău ar trebui să fie într-o stare jucabilă.
+
+> sfat: pentru a evita avertismentele în Visual Studio Code, editează funcția `window.onload` pentru a apela `gameLoopId` așa cum este (fără `let`) și declară `gameLoopId` în partea de sus a fișierului, independent: `let gameLoopId;`
+
+### Adaugă cod
+
+1. **Urmărește condiția de final**. Adaugă cod care ține evidența numărului de inamici sau dacă nava eroului a fost distrusă, adăugând aceste două funcții:
+
+    ```javascript
+    function isHeroDead() {
+      return hero.life <= 0;
+    }
+
+    function isEnemiesDead() {
+      const enemies = gameObjects.filter((go) => go.type === "Enemy" && !go.dead);
+      return enemies.length === 0;
+    }
+    ```
+
+1. **Adaugă logică în handler-ele de mesaje**. Editează `eventEmitter` pentru a gestiona aceste condiții:
+
+    ```javascript
+    eventEmitter.on(Messages.COLLISION_ENEMY_LASER, (_, { first, second }) => {
+        first.dead = true;
+        second.dead = true;
+        hero.incrementPoints();
+
+        if (isEnemiesDead()) {
+          eventEmitter.emit(Messages.GAME_END_WIN);
+        }
+    });
+
+    eventEmitter.on(Messages.COLLISION_ENEMY_HERO, (_, { enemy }) => {
+        enemy.dead = true;
+        hero.decrementLife();
+        if (isHeroDead())  {
+          eventEmitter.emit(Messages.GAME_END_LOSS);
+          return; // loss before victory
+        }
+        if (isEnemiesDead()) {
+          eventEmitter.emit(Messages.GAME_END_WIN);
+        }
+    });
+    
+    eventEmitter.on(Messages.GAME_END_WIN, () => {
+        endGame(true);
+    });
+      
+    eventEmitter.on(Messages.GAME_END_LOSS, () => {
+      endGame(false);
+    });
+    ```
+
+1. **Adaugă noi tipuri de mesaje**. Adaugă aceste Mesaje în obiectul constants:
+
+    ```javascript
+    GAME_END_LOSS: "GAME_END_LOSS",
+    GAME_END_WIN: "GAME_END_WIN",
+    ```
+
+2. **Adaugă cod pentru restart** care repornește jocul la apăsarea unui buton selectat.
+
+   1. **Ascultă apăsarea tastei `Enter`**. Editează eventListener-ul ferestrei pentru a asculta această apăsare:
+
+    ```javascript
+     else if(evt.key === "Enter") {
+        eventEmitter.emit(Messages.KEY_EVENT_ENTER);
+      }
+    ```
+
+   1. **Adaugă mesajul de restart**. Adaugă acest Mesaj în constantul Messages:
+
+        ```javascript
+        KEY_EVENT_ENTER: "KEY_EVENT_ENTER",
+        ```
+
+1. **Implementează regulile jocului**. Implementează următoarele reguli:
+
+   1. **Condiția de câștig a jucătorului**. Când toate navele inamice sunt distruse, afișează un mesaj de victorie.
+
+      1. Mai întâi, creează o funcție `displayMessage()`:
+
+        ```javascript
+        function displayMessage(message, color = "red") {
+          ctx.font = "30px Arial";
+          ctx.fillStyle = color;
+          ctx.textAlign = "center";
+          ctx.fillText(message, canvas.width / 2, canvas.height / 2);
+        }
+        ```
+
+      1. Creează o funcție `endGame()`:
+
+        ```javascript
+        function endGame(win) {
+          clearInterval(gameLoopId);
+        
+          // set a delay so we are sure any paints have finished
+          setTimeout(() => {
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            ctx.fillStyle = "black";
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+            if (win) {
+              displayMessage(
+                "Victory!!! Pew Pew... - Press [Enter] to start a new game Captain Pew Pew",
+                "green"
+              );
+            } else {
+              displayMessage(
+                "You died !!! Press [Enter] to start a new game Captain Pew Pew"
+              );
+            }
+          }, 200)  
+        }
+        ```
+
+   1. **Logica de restart**. Când toate viețile sunt pierdute sau jucătorul a câștigat jocul, afișează că jocul poate fi repornit. În plus, repornește jocul când tasta de *restart* este apăsată (poți decide ce tastă să fie mapată pentru restart).
+
+      1. Creează funcția `resetGame()`:
+
+        ```javascript
+        function resetGame() {
+          if (gameLoopId) {
+            clearInterval(gameLoopId);
+            eventEmitter.clear();
+            initGame();
+            gameLoopId = setInterval(() => {
+              ctx.clearRect(0, 0, canvas.width, canvas.height);
+              ctx.fillStyle = "black";
+              ctx.fillRect(0, 0, canvas.width, canvas.height);
+              drawPoints();
+              drawLife();
+              updateGameObjects();
+              drawGameObjects(ctx);
+            }, 100);
+          }
+        }
+        ```
+
+     1. Adaugă un apel la `eventEmitter` pentru a reseta jocul în `initGame()`:
+
+        ```javascript
+        eventEmitter.on(Messages.KEY_EVENT_ENTER, () => {
+          resetGame();
+        });
+        ```
+
+     1. Adaugă o funcție `clear()` în EventEmitter:
+
+        ```javascript
+        clear() {
+          this.listeners = {};
+        }
+        ```
+
+👽 💥 🚀 Felicitări, Căpitane! Jocul tău este complet! Bravo! 🚀 💥 👽
+
+---
+
+## 🚀 Provocare
+
+Adaugă un sunet! Poți adăuga un sunet pentru a îmbunătăți experiența de joc, poate atunci când există o lovitură de laser, sau când eroul moare sau câștigă? Aruncă o privire la acest [sandbox](https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_audio_play) pentru a învăța cum să redai sunete folosind JavaScript.
+
+## Chestionar Post-Lecție
+
+[Chestionar post-lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/40)
+
+## Recapitulare și Studiu Individual
+
+Sarcina ta este să creezi un joc nou, așa că explorează câteva jocuri interesante pentru a vedea ce tip de joc ai putea construi.
+
+## Temă
+
+[Construiește un Joc Exemplu](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/6-end-condition/assignment.md b/translations/ro/6-space-game/6-end-condition/assignment.md
new file mode 100644
index 00000000..f4e1a144
--- /dev/null
+++ b/translations/ro/6-space-game/6-end-condition/assignment.md
@@ -0,0 +1,33 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "24201cf428c7edba1ccec2a78a0dd8f8",
+  "translation_date": "2025-08-28T08:00:49+00:00",
+  "source_file": "6-space-game/6-end-condition/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Simplu
+
+## Instrucțiuni
+
+Încearcă să construiești un joc mic în care să exersezi diferite condiții de final. Variază între obținerea unui număr de puncte, eroul pierde toate viețile sau toți monștrii sunt învinși. Construiește ceva simplu, cum ar fi un joc de aventură bazat pe consolă. Folosește fluxul de joc de mai jos ca inspirație:
+
+```
+Hero> Strikes with broadsword - orc takes 3p damage
+Orc> Hits with club - hero takes 2p damage
+Hero> Kicks - orc takes 1p damage
+Game> Orc is defeated - Hero collects 2 coins
+Game> ****No more monsters, you have conquered the evil fortress****
+```
+
+## Criterii de Evaluare
+
+| Criteriu | Exemplar               | Adecvat                     | Necesită Îmbunătățiri      |
+| -------- | ---------------------- | --------------------------- | -------------------------- |
+|          | jocul complet este prezentat | jocul este parțial prezentat | jocul parțial conține erori |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/6-end-condition/solution/README.md b/translations/ro/6-space-game/6-end-condition/solution/README.md
new file mode 100644
index 00000000..e86a0305
--- /dev/null
+++ b/translations/ro/6-space-game/6-end-condition/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T08:01:04+00:00",
+  "source_file": "6-space-game/6-end-condition/solution/README.md",
+  "language_code": "ro"
+}
+-->
+Aceasta este o rezervare, lăsată goală în mod intenționat
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea umană realizată de profesioniști. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/6-end-condition/your-work/README.md b/translations/ro/6-space-game/6-end-condition/your-work/README.md
new file mode 100644
index 00000000..fb1db4ee
--- /dev/null
+++ b/translations/ro/6-space-game/6-end-condition/your-work/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T08:01:16+00:00",
+  "source_file": "6-space-game/6-end-condition/your-work/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/README.md b/translations/ro/6-space-game/README.md
new file mode 100644
index 00000000..a96c9d9b
--- /dev/null
+++ b/translations/ro/6-space-game/README.md
@@ -0,0 +1,45 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "c40a698395ee5102715f7880bba3f2e7",
+  "translation_date": "2025-08-28T07:53:05+00:00",
+  "source_file": "6-space-game/README.md",
+  "language_code": "ro"
+}
+-->
+# Construiește un Joc Spațial
+
+Un joc spațial pentru a învăța concepte mai avansate de JavaScript
+
+În această lecție vei învăța cum să construiești propriul tău joc spațial. Dacă ai jucat vreodată "Space Invaders", acest joc are aceeași idee: să controlezi o navă spațială și să tragi în monștrii care coboară din partea de sus. Iată cum va arăta jocul finalizat:
+
+![Joc finalizat](../../../6-space-game/images/pewpew.gif)
+
+În aceste șase lecții vei învăța următoarele:
+
+- **Interacționează** cu elementul Canvas pentru a desena lucruri pe ecran
+- **Înțelege** sistemul de coordonate cartezian
+- **Învață** modelul Pub-Sub pentru a crea o arhitectură de joc solidă, ușor de întreținut și extins
+- **Folosește** Async/Await pentru a încărca resursele jocului
+- **Gestionează** evenimentele de la tastatură
+
+## Prezentare generală
+
+- Teorie
+   - [Introducere în construirea jocurilor cu JavaScript](1-introduction/README.md)
+- Practică
+   - [Desenarea pe canvas](2-drawing-to-canvas/README.md)
+   - [Mutarea elementelor pe ecran](3-moving-elements-around/README.md)
+   - [Detectarea coliziunilor](4-collision-detection/README.md)
+   - [Păstrarea scorului](5-keeping-score/README.md)
+   - [Încheierea și repornirea jocului](6-end-condition/README.md)
+
+## Credite
+
+Resursele utilizate pentru acest proiect provin de la https://www.kenney.nl/.  
+Dacă ești pasionat de construirea jocurilor, acestea sunt niște resurse excelente, multe sunt gratuite, iar altele sunt contra cost.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de oameni. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/6-space-game/solution/README.md b/translations/ro/6-space-game/solution/README.md
new file mode 100644
index 00000000..0a5c54a8
--- /dev/null
+++ b/translations/ro/6-space-game/solution/README.md
@@ -0,0 +1,15 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "068cbb9b3c10a96d503f6cdd6c9ace8c",
+  "translation_date": "2025-08-28T07:56:46+00:00",
+  "source_file": "6-space-game/solution/README.md",
+  "language_code": "ro"
+}
+-->
+Acesta este un substitut, lăsat gol în mod intenționat
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/1-template-route/README.md b/translations/ro/7-bank-project/1-template-route/README.md
new file mode 100644
index 00000000..f1f3dad3
--- /dev/null
+++ b/translations/ro/7-bank-project/1-template-route/README.md
@@ -0,0 +1,322 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8da1b5e2c63f749808858c53f37b8ce7",
+  "translation_date": "2025-08-28T07:39:05+00:00",
+  "source_file": "7-bank-project/1-template-route/README.md",
+  "language_code": "ro"
+}
+-->
+# Construirea unei aplicații bancare Partea 1: Șabloane HTML și rute într-o aplicație web
+
+## Chestionar înainte de curs
+
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/41)
+
+### Introducere
+
+De la apariția JavaScript în browsere, site-urile web au devenit mai interactive și mai complexe ca niciodată. Tehnologiile web sunt acum utilizate frecvent pentru a crea aplicații complet funcționale care rulează direct în browser, pe care le numim [aplicații web](https://en.wikipedia.org/wiki/Web_application). Deoarece aplicațiile web sunt foarte interactive, utilizatorii nu doresc să aștepte reîncărcarea completă a paginii de fiecare dată când se efectuează o acțiune. De aceea, JavaScript este utilizat pentru a actualiza direct HTML-ul folosind DOM, oferind o experiență mai fluidă utilizatorului.
+
+În această lecție, vom pune bazele pentru a crea o aplicație bancară web, utilizând șabloane HTML pentru a crea mai multe ecrane care pot fi afișate și actualizate fără a fi nevoie să reîncărcăm întreaga pagină HTML.
+
+### Cerințe preliminare
+
+Ai nevoie de un server web local pentru a testa aplicația web pe care o vom construi în această lecție. Dacă nu ai unul, poți instala [Node.js](https://nodejs.org) și utiliza comanda `npx lite-server` din folderul proiectului tău. Aceasta va crea un server web local și va deschide aplicația ta într-un browser.
+
+### Pregătire
+
+Pe computerul tău, creează un folder numit `bank` cu un fișier numit `index.html` în interiorul său. Vom începe cu acest [șablon HTML de bază](https://en.wikipedia.org/wiki/Boilerplate_code):
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Bank App</title>
+  </head>
+  <body>
+    <!-- This is where you'll work -->
+  </body>
+</html>
+```
+
+---
+
+## Șabloane HTML
+
+Dacă dorești să creezi mai multe ecrane pentru o pagină web, o soluție ar fi să creezi un fișier HTML pentru fiecare ecran pe care dorești să-l afișezi. Totuși, această soluție vine cu unele inconveniente:
+
+- Trebuie să reîncarci întregul HTML atunci când schimbi ecranul, ceea ce poate fi lent.
+- Este dificil să partajezi date între diferitele ecrane.
+
+O altă abordare este să ai un singur fișier HTML și să definești mai multe [șabloane HTML](https://developer.mozilla.org/docs/Web/HTML/Element/template) folosind elementul `<template>`. Un șablon este un bloc HTML reutilizabil care nu este afișat de browser și trebuie instanțiat la momentul rulării folosind JavaScript.
+
+### Sarcină
+
+Vom crea o aplicație bancară cu două ecrane: pagina de autentificare și tabloul de bord. Mai întâi, să adăugăm în corpul HTML un element de tip placeholder pe care îl vom folosi pentru a instanția diferitele ecrane ale aplicației noastre:
+
+```html
+<div id="app">Loading...</div>
+```
+
+I-am atribuit un `id` pentru a-l localiza mai ușor cu JavaScript mai târziu.
+
+> Sfat: deoarece conținutul acestui element va fi înlocuit, putem pune un mesaj sau un indicator de încărcare care va fi afișat în timp ce aplicația se încarcă.
+
+Apoi, să adăugăm mai jos șablonul HTML pentru pagina de autentificare. Deocamdată, vom pune acolo doar un titlu și o secțiune care conține un link pe care îl vom folosi pentru navigare.
+
+```html
+<template id="login">
+  <h1>Bank App</h1>
+  <section>
+    <a href="/dashboard">Login</a>
+  </section>
+</template>
+```
+
+Apoi vom adăuga un alt șablon HTML pentru pagina tabloului de bord. Această pagină va conține diferite secțiuni:
+
+- Un antet cu un titlu și un link de deconectare
+- Soldul curent al contului bancar
+- O listă de tranzacții, afișată într-un tabel
+
+```html
+<template id="dashboard">
+  <header>
+    <h1>Bank App</h1>
+    <a href="/login">Logout</a>
+  </header>
+  <section>
+    Balance: 100$
+  </section>
+  <section>
+    <h2>Transactions</h2>
+    <table>
+      <thead>
+        <tr>
+          <th>Date</th>
+          <th>Object</th>
+          <th>Amount</th>
+        </tr>
+      </thead>
+      <tbody></tbody>
+    </table>
+  </section>
+</template>
+```
+
+> Sfat: când creezi șabloane HTML, dacă dorești să vezi cum vor arăta, poți comenta liniile `<template>` și `</template>` înconjurându-le cu `<!-- -->`.
+
+✅ De ce crezi că folosim atributele `id` pe șabloane? Am putea folosi altceva, cum ar fi clasele?
+
+## Afișarea șabloanelor cu JavaScript
+
+Dacă încerci fișierul HTML curent într-un browser, vei vedea că rămâne blocat afișând `Loading...`. Asta pentru că trebuie să adăugăm ceva cod JavaScript pentru a instanția și afișa șabloanele HTML.
+
+Instanțierea unui șablon se face de obicei în 3 pași:
+
+1. Recuperarea elementului șablon din DOM, de exemplu folosind [`document.getElementById`](https://developer.mozilla.org/docs/Web/API/Document/getElementById).
+2. Clonarea elementului șablon, folosind [`cloneNode`](https://developer.mozilla.org/docs/Web/API/Node/cloneNode).
+3. Atașarea acestuia la DOM sub un element vizibil, de exemplu folosind [`appendChild`](https://developer.mozilla.org/docs/Web/API/Node/appendChild).
+
+✅ De ce trebuie să clonăm șablonul înainte de a-l atașa la DOM? Ce crezi că s-ar întâmpla dacă am sări peste acest pas?
+
+### Sarcină
+
+Creează un fișier nou numit `app.js` în folderul proiectului tău și importă acel fișier în secțiunea `<head>` a HTML-ului:
+
+```html
+<script src="app.js" defer></script>
+```
+
+Acum, în `app.js`, vom crea o nouă funcție `updateRoute`:
+
+```js
+function updateRoute(templateId) {
+  const template = document.getElementById(templateId);
+  const view = template.content.cloneNode(true);
+  const app = document.getElementById('app');
+  app.innerHTML = '';
+  app.appendChild(view);
+}
+```
+
+Ceea ce facem aici sunt exact cei 3 pași descriși mai sus. Instanțiem șablonul cu id-ul `templateId` și punem conținutul clonat în placeholder-ul aplicației noastre. Observă că trebuie să folosim `cloneNode(true)` pentru a copia întreaga subarbore a șablonului.
+
+Acum apelează această funcție cu unul dintre șabloane și verifică rezultatul.
+
+```js
+updateRoute('login');
+```
+
+✅ Care este scopul acestui cod `app.innerHTML = '';`? Ce se întâmplă fără el?
+
+## Crearea rutelor
+
+Când vorbim despre o aplicație web, numim *Routing* intenția de a mapa **URL-urile** la ecranele specifice care ar trebui afișate. Pe un site web cu mai multe fișiere HTML, acest lucru se face automat, deoarece căile fișierelor sunt reflectate în URL. De exemplu, cu aceste fișiere în folderul proiectului tău:
+
+```
+mywebsite/index.html
+mywebsite/login.html
+mywebsite/admin/index.html
+```
+
+Dacă creezi un server web cu `mywebsite` ca rădăcină, maparea URL-urilor va fi:
+
+```
+https://site.com            --> mywebsite/index.html
+https://site.com/login.html --> mywebsite/login.html
+https://site.com/admin/     --> mywebsite/admin/index.html
+```
+
+Totuși, pentru aplicația noastră web folosim un singur fișier HTML care conține toate ecranele, așa că acest comportament implicit nu ne va ajuta. Trebuie să creăm această mapare manual și să actualizăm șablonul afișat folosind JavaScript.
+
+### Sarcină
+
+Vom folosi un obiect simplu pentru a implementa o [mapare](https://en.wikipedia.org/wiki/Associative_array) între căile URL și șabloanele noastre. Adaugă acest obiect în partea de sus a fișierului `app.js`.
+
+```js
+const routes = {
+  '/login': { templateId: 'login' },
+  '/dashboard': { templateId: 'dashboard' },
+};
+```
+
+Acum să modificăm puțin funcția `updateRoute`. În loc să trecem direct `templateId` ca argument, dorim să-l recuperăm mai întâi uitându-ne la URL-ul curent, apoi să folosim maparea noastră pentru a obține valoarea corespunzătoare a id-ului șablonului. Putem folosi [`window.location.pathname`](https://developer.mozilla.org/docs/Web/API/Location/pathname) pentru a obține doar secțiunea de cale din URL.
+
+```js
+function updateRoute() {
+  const path = window.location.pathname;
+  const route = routes[path];
+
+  const template = document.getElementById(route.templateId);
+  const view = template.content.cloneNode(true);
+  const app = document.getElementById('app');
+  app.innerHTML = '';
+  app.appendChild(view);
+}
+```
+
+Aici am mapat rutele declarate la șablonul corespunzător. Poți verifica dacă funcționează corect schimbând URL-ul manual în browser.
+
+✅ Ce se întâmplă dacă introduci o cale necunoscută în URL? Cum am putea rezolva acest lucru?
+
+## Adăugarea navigației
+
+Următorul pas pentru aplicația noastră este să adăugăm posibilitatea de a naviga între pagini fără a fi nevoie să schimbăm URL-ul manual. Aceasta implică două lucruri:
+
+1. Actualizarea URL-ului curent
+2. Actualizarea șablonului afișat pe baza noului URL
+
+Am rezolvat deja a doua parte cu funcția `updateRoute`, așa că trebuie să ne dăm seama cum să actualizăm URL-ul curent.
+
+Va trebui să folosim JavaScript și, mai exact, [`history.pushState`](https://developer.mozilla.org/docs/Web/API/History/pushState), care permite actualizarea URL-ului și crearea unei noi intrări în istoricul de navigare, fără a reîncărca HTML-ul.
+
+> Notă: Deși elementul HTML de ancoră [`<a href>`](https://developer.mozilla.org/docs/Web/HTML/Element/a) poate fi utilizat singur pentru a crea hyperlinkuri către diferite URL-uri, acesta va face ca browserul să reîncarce HTML-ul în mod implicit. Este necesar să prevenim acest comportament atunci când gestionăm rutarea cu JavaScript personalizat, folosind funcția `preventDefault()` pe evenimentul de clic.
+
+### Sarcină
+
+Să creăm o nouă funcție pe care o putem folosi pentru a naviga în aplicația noastră:
+
+```js
+function navigate(path) {
+  window.history.pushState({}, path, path);
+  updateRoute();
+}
+```
+
+Această metodă actualizează mai întâi URL-ul curent pe baza căii date, apoi actualizează șablonul. Proprietatea `window.location.origin` returnează rădăcina URL-ului, permițându-ne să reconstruim un URL complet dintr-o cale dată.
+
+Acum că avem această funcție, putem rezolva problema pe care o avem dacă o cale nu se potrivește cu nicio rută definită. Vom modifica funcția `updateRoute` adăugând o soluție de rezervă către una dintre rutele existente dacă nu găsim o potrivire.
+
+```js
+function updateRoute() {
+  const path = window.location.pathname;
+  const route = routes[path];
+
+  if (!route) {
+    return navigate('/login');
+  }
+
+  ...
+```
+
+Dacă o rută nu poate fi găsită, acum vom redirecționa către pagina de `login`.
+
+Acum să creăm o funcție pentru a obține URL-ul atunci când se face clic pe un link și pentru a preveni comportamentul implicit al browserului pentru linkuri:
+
+```js
+function onLinkClick(event) {
+  event.preventDefault();
+  navigate(event.target.href);
+}
+```
+
+Să completăm sistemul de navigație adăugând legături pentru *Login* și *Logout* în HTML.
+
+```html
+<a href="/dashboard" onclick="onLinkClick(event)">Login</a>
+...
+<a href="/login" onclick="onLinkClick(event)">Logout</a>
+```
+
+Obiectul `event` de mai sus capturează evenimentul `click` și îl transmite funcției noastre `onLinkClick`.
+
+Folosind atributul [`onclick`](https://developer.mozilla.org/docs/Web/API/GlobalEventHandlers/onclick), leagă evenimentul `click` de codul JavaScript, aici apelul funcției `navigate()`.
+
+Încearcă să faci clic pe aceste linkuri, acum ar trebui să poți naviga între diferitele ecrane ale aplicației tale.
+
+✅ Metoda `history.pushState` face parte din standardul HTML5 și este implementată în [toate browserele moderne](https://caniuse.com/?search=pushState). Dacă construiești o aplicație web pentru browsere mai vechi, există un truc pe care îl poți folosi în locul acestei API: utilizând un [hash (`#`)](https://en.wikipedia.org/wiki/URI_fragment) înainte de cale, poți implementa rutarea care funcționează cu navigarea obișnuită a ancorelor și nu reîncarcă pagina, deoarece scopul său a fost să creeze linkuri interne într-o pagină.
+
+## Gestionarea butoanelor de înainte și înapoi ale browserului
+
+Folosirea `history.pushState` creează noi intrări în istoricul de navigare al browserului. Poți verifica acest lucru ținând apăsat *butonul înapoi* al browserului, ar trebui să afișeze ceva de genul:
+
+![Captură de ecran a istoricului de navigare](../../../../translated_images/history.7fdabbafa521e06455b738d3dafa3ff41d3071deae60ead8c7e0844b9ed987d8.ro.png)
+
+Dacă încerci să faci clic pe butonul înapoi de câteva ori, vei vedea că URL-ul curent se schimbă și istoricul este actualizat, dar același șablon continuă să fie afișat.
+
+Asta pentru că aplicația nu știe că trebuie să apelăm `updateRoute()` de fiecare dată când istoricul se schimbă. Dacă te uiți la documentația [`history.pushState`](https://developer.mozilla.org/docs/Web/API/History/pushState), poți vedea că dacă starea se schimbă - adică am trecut la un alt URL - evenimentul [`popstate`](https://developer.mozilla.org/docs/Web/API/Window/popstate_event) este declanșat. Vom folosi acest lucru pentru a rezolva problema.
+
+### Sarcină
+
+Pentru a ne asigura că șablonul afișat este actualizat atunci când istoricul browserului se schimbă, vom atașa o nouă funcție care apelează `updateRoute()`. Vom face acest lucru la sfârșitul fișierului `app.js`:
+
+```js
+window.onpopstate = () => updateRoute();
+updateRoute();
+```
+
+> Notă: am folosit o [funcție săgeată](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Functions/Arrow_functions) aici pentru a declara handler-ul evenimentului `popstate` pentru concizie, dar o funcție obișnuită ar funcționa la fel.
+
+Iată un videoclip de reîmprospătare despre funcțiile săgeată:
+
+[![Funcții săgeată](https://img.youtube.com/vi/OP6eEbOj2sc/0.jpg)](https://youtube.com/watch?v=OP6eEbOj2sc "Funcții săgeată")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre funcțiile săgeată.
+
+Acum încearcă să folosești butoanele de înainte și înapoi ale browserului și verifică dacă ruta afișată este actualizată corect de această dată.
+
+---
+
+## 🚀 Provocare
+
+Adaugă un nou șablon și o rută pentru o a treia pagină care afișează creditele pentru această aplicație.
+
+## Chestionar după curs
+
+[Chestionar după curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/42)
+
+## Recapitulare și studiu individual
+
+Rutarea este una dintre părțile surprinzător de dificile ale dezvoltării web, mai ales pe măsură ce web-ul trece de la comportamentele de reîmprospătare a paginilor la reîmprospătările aplicațiilor de tip Single Page Application. Citește puțin despre [cum serviciul Azure Static Web App](https://docs.microsoft.com/azure/static-web-apps/routes/?WT.mc_id=academic-77807-sagibbon) gestionează rutarea. Poți explica de ce unele dintre deciziile descrise în acel document sunt necesare?
+
+## Temă
+
+[Îmbunătățește rutarea](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/1-template-route/assignment.md b/translations/ro/7-bank-project/1-template-route/assignment.md
new file mode 100644
index 00000000..8f75380c
--- /dev/null
+++ b/translations/ro/7-bank-project/1-template-route/assignment.md
@@ -0,0 +1,28 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "8223e429218befa731dd5bfd22299520",
+  "translation_date": "2025-08-28T07:40:53+00:00",
+  "source_file": "7-bank-project/1-template-route/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Îmbunătățirea rutării
+
+## Instrucțiuni
+
+Declarația rutelor conține în prezent doar ID-ul șablonului care trebuie utilizat. Dar, atunci când se afișează o pagină nouă, uneori este nevoie de ceva mai mult. Să îmbunătățim implementarea rutării cu două funcționalități suplimentare:
+
+- Atribuie titluri fiecărui șablon și actualizează titlul ferestrei cu acest nou titlu atunci când șablonul se schimbă.
+- Adaugă o opțiune pentru a rula un cod după ce șablonul se schimbă. Dorim să afișăm `'Dashboard is shown'` în consola dezvoltatorului de fiecare dată când pagina tabloului de bord este afișată.
+
+## Criterii de evaluare
+
+| Criterii | Exemplu                                                                                                                            | Adequat                                                                                                                                                                                   | Necesită îmbunătățiri                                  |
+| -------- | ----------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- |
+|          | Cele două funcționalități sunt implementate și funcționează. Titlul și adăugarea codului funcționează și pentru o rută nouă adăugată în declarația `routes`. | Cele două funcționalități funcționează, dar comportamentul este hardcodat și nu configurabil prin declarația `routes`. Adăugarea unei a treia rute cu titlu și cod funcționează parțial sau deloc. | Una dintre funcționalități lipsește sau nu funcționează corect. |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/2-forms/README.md b/translations/ro/7-bank-project/2-forms/README.md
new file mode 100644
index 00000000..a65b3e93
--- /dev/null
+++ b/translations/ro/7-bank-project/2-forms/README.md
@@ -0,0 +1,313 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b667b7d601e2ee19acb5aa9d102dc9f3",
+  "translation_date": "2025-08-28T07:33:56+00:00",
+  "source_file": "7-bank-project/2-forms/README.md",
+  "language_code": "ro"
+}
+-->
+# Construirea unei aplicații bancare Partea 2: Crearea unui formular de autentificare și înregistrare
+
+## Chestionar înainte de lecție
+
+[Chestionar înainte de lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/43)
+
+### Introducere
+
+În aproape toate aplicațiile web moderne, poți crea un cont pentru a avea propriul spațiu privat. Deoarece mai mulți utilizatori pot accesa o aplicație web simultan, este nevoie de un mecanism pentru a stoca separat datele personale ale fiecărui utilizator și pentru a selecta ce informații să fie afișate. Nu vom acoperi modul de gestionare [securizată a identității utilizatorului](https://en.wikipedia.org/wiki/Authentication), deoarece este un subiect amplu în sine, dar vom asigura că fiecare utilizator poate crea unul (sau mai multe) conturi bancare în aplicația noastră.
+
+În această parte vom folosi formulare HTML pentru a adăuga autentificare și înregistrare în aplicația noastră web. Vom vedea cum să trimitem datele către un API de server programatic și, în cele din urmă, cum să definim reguli de validare de bază pentru datele introduse de utilizatori.
+
+### Prerechizite
+
+Trebuie să fi finalizat [șabloanele HTML și rutarea](../1-template-route/README.md) aplicației web pentru această lecție. De asemenea, trebuie să instalezi [Node.js](https://nodejs.org) și să [rulezi API-ul serverului](../api/README.md) local, astfel încât să poți trimite date pentru a crea conturi.
+
+**Notă importantă**  
+Vei avea două terminale deschise simultan, așa cum este indicat mai jos:  
+1. Pentru aplicația bancară principală pe care am construit-o în lecția [șabloane HTML și rutare](../1-template-route/README.md)  
+2. Pentru [API-ul serverului aplicației bancare](../api/README.md) pe care tocmai l-am configurat mai sus.  
+
+Trebuie să ai ambele servere pornite pentru a putea urma restul lecției. Ele ascultă pe porturi diferite (portul `3000` și portul `5000`), astfel încât totul ar trebui să funcționeze corect.
+
+Poți testa dacă serverul funcționează corect executând această comandă într-un terminal:
+
+```sh
+curl http://localhost:5000/api
+# -> should return "Bank API v1.0.0" as a result
+```
+
+---
+
+## Formular și controale
+
+Elementul `<form>` încadrează o secțiune a unui document HTML unde utilizatorul poate introduce și trimite date folosind controale interactive. Există o mulțime de controale de interfață utilizator (UI) care pot fi utilizate într-un formular, cel mai comun fiind elementele `<input>` și `<button>`.
+
+Există multe [tipuri](https://developer.mozilla.org/docs/Web/HTML/Element/input) de `<input>`, de exemplu, pentru a crea un câmp unde utilizatorul poate introduce numele de utilizator, poți folosi:
+
+```html
+<input id="username" name="username" type="text">
+```
+
+Atributul `name` va fi utilizat ca nume de proprietate atunci când datele formularului vor fi trimise. Atributul `id` este utilizat pentru a asocia un `<label>` cu controlul formularului.
+
+> Consultă lista completă de [tipuri de `<input>`](https://developer.mozilla.org/docs/Web/HTML/Element/input) și [alte controale de formular](https://developer.mozilla.org/docs/Learn/Forms/Other_form_controls) pentru a avea o idee despre toate elementele UI native pe care le poți folosi în construirea interfeței tale.
+
+✅ Reține că `<input>` este un [element gol](https://developer.mozilla.org/docs/Glossary/Empty_element) pe care *nu* ar trebui să adaugi o etichetă de închidere corespunzătoare. Totuși, poți folosi notația auto-închidere `<input/>`, dar nu este necesar.
+
+Elementul `<button>` dintr-un formular este puțin special. Dacă nu specifici atributul `type`, acesta va trimite automat datele formularului către server atunci când este apăsat. Iată valorile posibile pentru `type`:
+
+- `submit`: Implicit într-un `<form>`, butonul declanșează acțiunea de trimitere a formularului.
+- `reset`: Butonul resetează toate controalele formularului la valorile lor inițiale.
+- `button`: Nu atribuie un comportament implicit când butonul este apăsat. Poți apoi să atribui acțiuni personalizate folosind JavaScript.
+
+### Sarcină
+
+Să începem prin adăugarea unui formular în șablonul `login`. Vom avea nevoie de un câmp pentru *nume de utilizator* și un buton *Login*.
+
+```html
+<template id="login">
+  <h1>Bank App</h1>
+  <section>
+    <h2>Login</h2>
+    <form id="loginForm">
+      <label for="username">Username</label>
+      <input id="username" name="user" type="text">
+      <button>Login</button>
+    </form>
+  </section>
+</template>
+```
+
+Dacă te uiți mai atent, poți observa că am adăugat și un element `<label>` aici. Elementele `<label>` sunt utilizate pentru a adăuga un nume controalelor UI, cum ar fi câmpul nostru pentru numele de utilizator. Etichetele sunt importante pentru lizibilitatea formularelor tale, dar vin și cu beneficii suplimentare:
+
+- Prin asocierea unei etichete cu un control de formular, ajută utilizatorii care folosesc tehnologii asistive (cum ar fi un cititor de ecran) să înțeleagă ce date li se cere să furnizeze.
+- Poți face clic pe etichetă pentru a pune direct focus pe controlul asociat, făcându-l mai ușor de accesat pe dispozitivele cu ecran tactil.
+
+> [Accesibilitatea](https://developer.mozilla.org/docs/Learn/Accessibility/What_is_accessibility) pe web este un subiect foarte important care este adesea trecut cu vederea. Datorită [elementelor HTML semantice](https://developer.mozilla.org/docs/Learn/Accessibility/HTML), nu este dificil să creezi conținut accesibil dacă le folosești corect. Poți [citi mai multe despre accesibilitate](https://developer.mozilla.org/docs/Web/Accessibility) pentru a evita greșelile comune și pentru a deveni un dezvoltator responsabil.
+
+Acum vom adăuga un al doilea formular pentru înregistrare, chiar sub cel anterior:
+
+```html
+<hr/>
+<h2>Register</h2>
+<form id="registerForm">
+  <label for="user">Username</label>
+  <input id="user" name="user" type="text">
+  <label for="currency">Currency</label>
+  <input id="currency" name="currency" type="text" value="$">
+  <label for="description">Description</label>
+  <input id="description" name="description" type="text">
+  <label for="balance">Current balance</label>
+  <input id="balance" name="balance" type="number" value="0">
+  <button>Register</button>
+</form>
+```
+
+Folosind atributul `value` putem defini o valoare implicită pentru un anumit câmp.  
+Observă, de asemenea, că câmpul pentru `balance` are tipul `number`. Arată diferit față de celelalte câmpuri? Încearcă să interacționezi cu el.
+
+✅ Poți naviga și interacționa cu formularele folosind doar tastatura? Cum ai face asta?
+
+## Trimiterea datelor către server
+
+Acum că avem o interfață funcțională, următorul pas este să trimitem datele către server. Să facem un test rapid folosind codul nostru actual: ce se întâmplă dacă faci clic pe butonul *Login* sau *Register*?
+
+Ai observat schimbarea în secțiunea URL a browserului?
+
+![Captură de ecran cu schimbarea URL-ului browserului după ce s-a făcut clic pe butonul Register](../../../../translated_images/click-register.e89a30bf0d4bc9ca867dc537c4cea679a7c26368bd790969082f524fed2355bc.ro.png)
+
+Acțiunea implicită pentru un `<form>` este să trimită formularul către URL-ul curent al serverului folosind metoda [GET](https://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3), adăugând datele formularului direct în URL. Totuși, această metodă are unele dezavantaje:
+
+- Datele trimise sunt foarte limitate ca dimensiune (aproximativ 2000 de caractere)
+- Datele sunt vizibile direct în URL (nu este ideal pentru parole)
+- Nu funcționează cu încărcări de fișiere
+
+De aceea poți schimba metoda pentru a folosi [POST](https://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5), care trimite datele formularului către server în corpul cererii HTTP, fără limitările anterioare.
+
+> Deși POST este metoda cea mai utilizată pentru trimiterea datelor, [în unele scenarii specifice](https://www.w3.org/2001/tag/doc/whenToUseGet.html) este preferabil să folosești metoda GET, cum ar fi implementarea unui câmp de căutare.
+
+### Sarcină
+
+Adaugă proprietățile `action` și `method` formularului de înregistrare:
+
+```html
+<form id="registerForm" action="//localhost:5000/api/accounts" method="POST">
+```
+
+Acum încearcă să înregistrezi un nou cont cu numele tău. După ce faci clic pe butonul *Register*, ar trebui să vezi ceva de genul acesta:
+
+![O fereastră de browser la adresa localhost:5000/api/accounts, afișând un șir JSON cu datele utilizatorului](../../../../translated_images/form-post.61de4ca1b964d91a9e338416e19f218504dd0af5f762fbebabfe7ae80edf885f.ro.png)
+
+Dacă totul merge bine, serverul ar trebui să răspundă cererii tale cu un răspuns [JSON](https://www.json.org/json-en.html) care conține datele contului creat.
+
+✅ Încearcă să te înregistrezi din nou cu același nume. Ce se întâmplă?
+
+## Trimiterea datelor fără reîncărcarea paginii
+
+După cum probabil ai observat, există o mică problemă cu abordarea pe care tocmai am folosit-o: când trimitem formularul, ieșim din aplicația noastră și browserul redirecționează către URL-ul serverului. Încercăm să evităm toate reîncărcările paginii în aplicația noastră web, deoarece construim o [aplicație cu o singură pagină (SPA)](https://en.wikipedia.org/wiki/Single-page_application).
+
+Pentru a trimite datele formularului către server fără a forța reîncărcarea paginii, trebuie să folosim cod JavaScript. În loc să punem un URL în proprietatea `action` a unui element `<form>`, poți folosi orice cod JavaScript precedat de șirul `javascript:` pentru a efectua o acțiune personalizată. Folosind aceasta înseamnă că va trebui să implementezi unele sarcini care anterior erau realizate automat de browser:
+
+- Preluarea datelor formularului
+- Convertirea și codificarea datelor formularului într-un format adecvat
+- Crearea cererii HTTP și trimiterea acesteia către server
+
+### Sarcină
+
+Înlocuiește `action` din formularul de înregistrare cu:
+
+```html
+<form id="registerForm" action="javascript:register()">
+```
+
+Deschide `app.js` și adaugă o funcție nouă numită `register`:
+
+```js
+function register() {
+  const registerForm = document.getElementById('registerForm');
+  const formData = new FormData(registerForm);
+  const data = Object.fromEntries(formData);
+  const jsonData = JSON.stringify(data);
+}
+```
+
+Aici preluăm elementul formular folosind `getElementById()` și folosim ajutorul [`FormData`](https://developer.mozilla.org/docs/Web/API/FormData) pentru a extrage valorile din controalele formularului ca un set de perechi cheie/valoare. Apoi convertim datele într-un obiect obișnuit folosind [`Object.fromEntries()`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object/fromEntries) și, în cele din urmă, serializăm datele în [JSON](https://www.json.org/json-en.html), un format utilizat frecvent pentru schimbul de date pe web.
+
+Datele sunt acum pregătite pentru a fi trimise către server. Creează o funcție nouă numită `createAccount`:
+
+```js
+async function createAccount(account) {
+  try {
+    const response = await fetch('//localhost:5000/api/accounts', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: account
+    });
+    return await response.json();
+  } catch (error) {
+    return { error: error.message || 'Unknown error' };
+  }
+}
+```
+
+Ce face această funcție? În primul rând, observă cuvântul cheie `async` aici. Acesta înseamnă că funcția conține cod care va fi executat [**asincron**](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/async_function). Când este utilizat împreună cu cuvântul cheie `await`, permite așteptarea executării codului asincron - cum ar fi așteptarea răspunsului serverului aici - înainte de a continua.
+
+Iată un videoclip rapid despre utilizarea `async/await`:
+
+[![Async și Await pentru gestionarea promisiunilor](https://img.youtube.com/vi/YwmlRkrxvkk/0.jpg)](https://youtube.com/watch?v=YwmlRkrxvkk "Async și Await pentru gestionarea promisiunilor")
+
+> 🎥 Fă clic pe imaginea de mai sus pentru un videoclip despre async/await.
+
+Folosim API-ul `fetch()` pentru a trimite date JSON către server. Această metodă ia 2 parametri:
+
+- URL-ul serverului, așa că punem `//localhost:5000/api/accounts` aici.
+- Setările cererii. Aici setăm metoda la `POST` și furnizăm `body` pentru cerere. Deoarece trimitem date JSON către server, trebuie să setăm și antetul `Content-Type` la `application/json`, astfel încât serverul să știe cum să interpreteze conținutul.
+
+Deoarece serverul va răspunde cererii cu JSON, putem folosi `await response.json()` pentru a analiza conținutul JSON și a returna obiectul rezultat. Reține că această metodă este asincronă, așa că folosim cuvântul cheie `await` aici înainte de a returna pentru a ne asigura că orice erori în timpul analizei sunt de asemenea capturate.
+
+Acum adaugă ceva cod în funcția `register` pentru a apela `createAccount()`:
+
+```js
+const result = await createAccount(jsonData);
+```
+
+Deoarece folosim cuvântul cheie `await` aici, trebuie să adăugăm cuvântul cheie `async` înaintea funcției register:
+
+```js
+async function register() {
+```
+
+În cele din urmă, să adăugăm câteva loguri pentru a verifica rezultatul. Funcția finală ar trebui să arate astfel:
+
+```js
+async function register() {
+  const registerForm = document.getElementById('registerForm');
+  const formData = new FormData(registerForm);
+  const jsonData = JSON.stringify(Object.fromEntries(formData));
+  const result = await createAccount(jsonData);
+
+  if (result.error) {
+    return console.log('An error occurred:', result.error);
+  }
+
+  console.log('Account created!', result);
+}
+```
+
+A fost un pic lung, dar am ajuns acolo! Dacă deschizi [instrumentele pentru dezvoltatori ale browserului](https://developer.mozilla.org/docs/Learn/Common_questions/What_are_browser_developer_tools) și încerci să înregistrezi un nou cont, nu ar trebui să vezi nicio schimbare pe pagina web, dar un mesaj va apărea în consolă confirmând că totul funcționează.
+
+![Captură de ecran care arată mesajul de log în consola browserului](../../../../translated_images/browser-console.efaf0b51aaaf67782a29e1a0bb32cc063f189b18e894eb5926e02f1abe864ec2.ro.png)
+
+✅ Crezi că datele sunt trimise către server în mod securizat? Ce se întâmplă dacă cineva ar putea intercepta cererea? Poți citi despre [HTTPS](https://en.wikipedia.org/wiki/HTTPS) pentru a afla mai multe despre comunicarea securizată a datelor.
+
+## Validarea datelor
+
+Dacă încerci să înregistrezi un nou cont fără a seta mai întâi un nume de utilizator, poți vedea că serverul returnează o eroare cu codul de stare [400 (Bad Request)](https://developer.mozilla.org/docs/Web/HTTP/Status/400#:~:text=The%20HyperText%20Transfer%20Protocol%20(HTTP,%2C%20or%20deceptive%20request%20routing).).
+
+Înainte de a trimite date către un server, este o practică bună să [validezi datele formularului](https://developer.mozilla.org/docs/Learn/Forms/Form_validation) în prealabil, atunci când este posibil, pentru a te asigura că trimiți o cerere validă. Controalele formularului HTML5 oferă validare încorporată folosind diverse atribute:
+
+- `required`: câmpul trebuie completat, altfel formularul nu poate fi trimis.
+- `minlength` și `maxlength`: definește numărul minim și maxim de caractere în câmpurile text.
+- `min` și `max`: definește valoarea minimă și maximă a unui câmp numeric.
+- `type`: definește tipul de date așteptat, cum ar fi `number`, `email`, `file` sau [alte tipuri încorporate](https://developer.mozilla.org/docs/Web/HTML/Element/input). Acest atribut poate schimba și redarea vizuală a controlului formularului.
+- `pattern`: permite definirea unui model de [expresie regulată](https://developer.mozilla.org/docs/Web/JavaScript/Guide/Regular_Expressions) pentru a testa dacă datele introduse sunt valide sau nu.
+Sfat: poți personaliza aspectul controalelor formularului în funcție de validitatea lor, folosind pseudo-clasele CSS `:valid` și `:invalid`.
+### Sarcină
+
+Există 2 câmpuri obligatorii pentru a crea un cont nou valid: numele de utilizator și moneda, celelalte câmpuri fiind opționale. Actualizează HTML-ul formularului, folosind atât atributul `required`, cât și textul din eticheta câmpului, astfel încât:
+
+```html
+<label for="user">Username (required)</label>
+<input id="user" name="user" type="text" required>
+...
+<label for="currency">Currency (required)</label>
+<input id="currency" name="currency" type="text" value="$" required>
+```
+
+Deși această implementare a serverului nu impune limite specifice pentru lungimea maximă a câmpurilor, este întotdeauna o practică bună să definești limite rezonabile pentru orice introducere de text de către utilizator.
+
+Adaugă un atribut `maxlength` câmpurilor de text:
+
+```html
+<input id="user" name="user" type="text" maxlength="20" required>
+...
+<input id="currency" name="currency" type="text" value="$" maxlength="5" required>
+...
+<input id="description" name="description" type="text" maxlength="100">
+```
+
+Acum, dacă apeși butonul *Register* și un câmp nu respectă o regulă de validare pe care am definit-o, ar trebui să vezi ceva de genul acesta:
+
+![Captură de ecran care arată eroarea de validare atunci când încerci să trimiți formularul](../../../../translated_images/validation-error.8bd23e98d416c22f80076d04829a4bb718e0e550fd622862ef59008ccf0d5dce.ro.png)
+
+Validarea de acest tip, efectuată *înainte* de a trimite orice date către server, se numește validare **pe partea clientului**. Totuși, reține că nu este întotdeauna posibil să efectuezi toate verificările fără a trimite datele. De exemplu, nu putem verifica aici dacă există deja un cont cu același nume de utilizator fără a trimite o cerere către server. Validarea suplimentară efectuată pe server se numește validare **pe partea serverului**.
+
+De obicei, ambele trebuie implementate, iar utilizarea validării pe partea clientului îmbunătățește experiența utilizatorului prin oferirea unui feedback instantaneu, însă validarea pe partea serverului este esențială pentru a te asigura că datele utilizatorului pe care le manipulezi sunt corecte și sigure.
+
+---
+
+## 🚀 Provocare
+
+Afișează un mesaj de eroare în HTML dacă utilizatorul există deja.
+
+Iată un exemplu de cum poate arăta pagina finală de autentificare după puțină stilizare:
+
+![Captură de ecran a paginii de autentificare după adăugarea stilurilor CSS](../../../../translated_images/result.96ef01f607bf856aa9789078633e94a4f7664d912f235efce2657299becca483.ro.png)
+
+## Chestionar post-lectură
+
+[Chestionar post-lectură](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/44)
+
+## Recapitulare și studiu individual
+
+Dezvoltatorii au devenit foarte creativi în ceea ce privește eforturile lor de construire a formularelor, mai ales în ceea ce privește strategiile de validare. Află despre diferite fluxuri de formulare explorând [CodePen](https://codepen.com); poți găsi formulare interesante și inspiraționale?
+
+## Temă
+
+[Stilizează aplicația ta bancară](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/2-forms/assignment.md b/translations/ro/7-bank-project/2-forms/assignment.md
new file mode 100644
index 00000000..a728399a
--- /dev/null
+++ b/translations/ro/7-bank-project/2-forms/assignment.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "474f3ab1ee755ca980fc9104a0316e17",
+  "translation_date": "2025-08-28T07:36:35+00:00",
+  "source_file": "7-bank-project/2-forms/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Stilizează aplicația ta bancară
+
+## Instrucțiuni
+
+Creează un fișier nou `styles.css` și adaugă un link către acesta în fișierul tău actual `index.html`. În fișierul CSS pe care tocmai l-ai creat, adaugă câteva stiluri pentru a face paginile *Login* și *Dashboard* să arate plăcut și ordonat. Încearcă să creezi o temă de culori pentru a oferi aplicației tale o identitate proprie.
+
+> Sfat: poți modifica HTML-ul și să adaugi elemente și clase noi, dacă este necesar.
+
+## Criterii de evaluare
+
+| Criteriu | Exemplu                                                                                                                | Adequat                                                                       | Necesită îmbunătățiri                                                                       |
+| -------- | ---------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- |
+|          | Toate paginile arată curate și ușor de citit, cu o temă de culori consistentă și secțiunile evidențiate corespunzător. | Paginile sunt stilizate, dar fără o temă sau cu secțiuni care nu sunt clar delimitate. | Paginile lipsesc de stilizare, secțiunile arată dezordonat și informațiile sunt greu de citit. |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/3-data/README.md b/translations/ro/7-bank-project/3-data/README.md
new file mode 100644
index 00000000..41c5ded9
--- /dev/null
+++ b/translations/ro/7-bank-project/3-data/README.md
@@ -0,0 +1,347 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "f587e913e3f7c0b1c549a05dd74ee8e5",
+  "translation_date": "2025-08-28T07:30:53+00:00",
+  "source_file": "7-bank-project/3-data/README.md",
+  "language_code": "ro"
+}
+-->
+# Construirea unei aplicații bancare Partea 3: Metode de preluare și utilizare a datelor
+
+## Chestionar înainte de curs
+
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/45)
+
+### Introducere
+
+La baza fiecărei aplicații web se află *datele*. Datele pot lua multe forme, dar scopul lor principal este întotdeauna să afișeze informații utilizatorului. Pe măsură ce aplicațiile web devin din ce în ce mai interactive și complexe, modul în care utilizatorul accesează și interacționează cu informațiile a devenit o parte esențială a dezvoltării web.
+
+În această lecție, vom vedea cum să preluăm date de la un server în mod asincron și să folosim aceste date pentru a afișa informații pe o pagină web fără a reîncărca HTML-ul.
+
+### Cerințe preliminare
+
+Trebuie să fi construit partea [Formular de autentificare și înregistrare](../2-forms/README.md) a aplicației web pentru această lecție. De asemenea, trebuie să instalați [Node.js](https://nodejs.org) și să [rulați API-ul serverului](../api/README.md) local pentru a obține datele contului.
+
+Puteți testa dacă serverul funcționează corect executând această comandă într-un terminal:
+
+```sh
+curl http://localhost:5000/api
+# -> should return "Bank API v1.0.0" as a result
+```
+
+---
+
+## AJAX și preluarea datelor
+
+Site-urile web tradiționale actualizează conținutul afișat atunci când utilizatorul selectează un link sau trimite date printr-un formular, reîncărcând întreaga pagină HTML. De fiecare dată când trebuie încărcate date noi, serverul web returnează o pagină HTML complet nouă care trebuie procesată de browser, întrerupând acțiunea curentă a utilizatorului și limitând interacțiunile în timpul reîncărcării. Acest flux de lucru este cunoscut și sub denumirea de *Aplicație Multi-Pagină* sau *MPA*.
+
+![Fluxul de actualizare într-o aplicație multi-pagină](../../../../translated_images/mpa.7f7375a1a2d4aa779d3f928a2aaaf9ad76bcdeb05cfce2dc27ab126024050f51.ro.png)
+
+Când aplicațiile web au început să devină mai complexe și interactive, a apărut o tehnică nouă numită [AJAX (JavaScript și XML asincron)](https://en.wikipedia.org/wiki/Ajax_(programming)). Această tehnică permite aplicațiilor web să trimită și să preia date de la un server în mod asincron folosind JavaScript, fără a reîncărca pagina HTML, rezultând actualizări mai rapide și interacțiuni mai fluide pentru utilizator. Când datele noi sunt primite de la server, pagina HTML curentă poate fi actualizată cu JavaScript folosind API-ul [DOM](https://developer.mozilla.org/docs/Web/API/Document_Object_Model). În timp, această abordare a evoluat în ceea ce acum se numește [*Aplicație cu o singură pagină* sau *SPA*](https://en.wikipedia.org/wiki/Single-page_application).
+
+![Fluxul de actualizare într-o aplicație cu o singură pagină](../../../../translated_images/spa.268ec73b41f992c2a21ef9294235c6ae597b3c37e2c03f0494c2d8857325cc57.ro.png)
+
+Când AJAX a fost introdus pentru prima dată, singurul API disponibil pentru preluarea datelor în mod asincron era [`XMLHttpRequest`](https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest). Dar browserele moderne implementează acum și API-ul mai convenabil și mai puternic [`Fetch`](https://developer.mozilla.org/docs/Web/API/Fetch_API), care folosește promisiuni și este mai potrivit pentru manipularea datelor JSON.
+
+> Deși toate browserele moderne acceptă `Fetch API`, dacă doriți ca aplicația dvs. web să funcționeze pe browsere vechi sau depășite, este întotdeauna o idee bună să verificați mai întâi [tabelul de compatibilitate pe caniuse.com](https://caniuse.com/fetch).
+
+### Sarcină
+
+În [lecția anterioară](../2-forms/README.md) am implementat formularul de înregistrare pentru a crea un cont. Acum vom adăuga cod pentru a ne autentifica folosind un cont existent și pentru a prelua datele acestuia. Deschideți fișierul `app.js` și adăugați o nouă funcție `login`:
+
+```js
+async function login() {
+  const loginForm = document.getElementById('loginForm')
+  const user = loginForm.user.value;
+}
+```
+
+Aici începem prin a prelua elementul formularului cu `getElementById()`, iar apoi obținem numele de utilizator din câmpul de intrare cu `loginForm.user.value`. Fiecare control al formularului poate fi accesat prin numele său (setat în HTML folosind atributul `name`) ca proprietate a formularului.
+
+În mod similar cu ceea ce am făcut pentru înregistrare, vom crea o altă funcție pentru a efectua o cerere către server, dar de data aceasta pentru a prelua datele contului:
+
+```js
+async function getAccount(user) {
+  try {
+    const response = await fetch('//localhost:5000/api/accounts/' + encodeURIComponent(user));
+    return await response.json();
+  } catch (error) {
+    return { error: error.message || 'Unknown error' };
+  }
+}
+```
+
+Folosim API-ul `fetch` pentru a solicita datele în mod asincron de la server, dar de data aceasta nu avem nevoie de alți parametri în afară de URL-ul pe care îl apelăm, deoarece doar interogăm date. În mod implicit, `fetch` creează o cerere HTTP [`GET`](https://developer.mozilla.org/docs/Web/HTTP/Methods/GET), care este exact ceea ce căutăm aici.
+
+✅ `encodeURIComponent()` este o funcție care scăpa caracterele speciale pentru URL. Ce probleme am putea avea dacă nu apelăm această funcție și folosim direct valoarea `user` în URL?
+
+Acum să actualizăm funcția noastră `login` pentru a folosi `getAccount`:
+
+```js
+async function login() {
+  const loginForm = document.getElementById('loginForm')
+  const user = loginForm.user.value;
+  const data = await getAccount(user);
+
+  if (data.error) {
+    return console.log('loginError', data.error);
+  }
+
+  account = data;
+  navigate('/dashboard');
+}
+```
+
+Mai întâi, deoarece `getAccount` este o funcție asincronă, trebuie să o potrivim cu cuvântul cheie `await` pentru a aștepta rezultatul serverului. Ca în cazul oricărei cereri către server, trebuie să gestionăm și cazurile de eroare. Deocamdată vom adăuga doar un mesaj de jurnal pentru a afișa eroarea și ne vom întoarce la aceasta mai târziu.
+
+Apoi trebuie să stocăm datele undeva pentru a le putea folosi ulterior pentru a afișa informațiile din tabloul de bord. Deoarece variabila `account` nu există încă, vom crea o variabilă globală pentru aceasta în partea de sus a fișierului nostru:
+
+```js
+let account = null;
+```
+
+După ce datele utilizatorului sunt salvate într-o variabilă, putem naviga de la pagina de *login* la *dashboard* folosind funcția `navigate()` pe care o avem deja.
+
+În cele din urmă, trebuie să apelăm funcția noastră `login` atunci când formularul de autentificare este trimis, modificând HTML-ul:
+
+```html
+<form id="loginForm" action="javascript:login()">
+```
+
+Testați că totul funcționează corect înregistrând un cont nou și încercând să vă autentificați folosind același cont.
+
+Înainte de a trece la partea următoare, putem completa și funcția `register` adăugând acest lucru la sfârșitul funcției:
+
+```js
+account = result;
+navigate('/dashboard');
+```
+
+✅ Știați că, în mod implicit, puteți apela API-uri de server doar de pe *același domeniu și port* ca pagina web pe care o vizualizați? Acesta este un mecanism de securitate impus de browsere. Dar stați, aplicația noastră web rulează pe `localhost:3000`, în timp ce API-ul serverului rulează pe `localhost:5000`, de ce funcționează? Folosind o tehnică numită [Partajare a resurselor între origini (CORS)](https://developer.mozilla.org/docs/Web/HTTP/CORS), este posibil să efectuați cereri HTTP între origini dacă serverul adaugă antete speciale la răspuns, permițând excepții pentru domenii specifice.
+
+> Aflați mai multe despre API-uri urmând această [lecție](https://docs.microsoft.com/learn/modules/use-apis-discover-museum-art/?WT.mc_id=academic-77807-sagibbon)
+
+## Actualizarea HTML-ului pentru a afișa date
+
+Acum că avem datele utilizatorului, trebuie să actualizăm HTML-ul existent pentru a le afișa. Știm deja cum să preluăm un element din DOM folosind, de exemplu, `document.getElementById()`. După ce aveți un element de bază, iată câteva API-uri pe care le puteți folosi pentru a-l modifica sau pentru a adăuga elemente copil:
+
+- Folosind proprietatea [`textContent`](https://developer.mozilla.org/docs/Web/API/Node/textContent) puteți schimba textul unui element. Rețineți că schimbarea acestei valori elimină toți copiii elementului (dacă există) și îi înlocuiește cu textul furnizat. Astfel, este și o metodă eficientă de a elimina toți copiii unui element dat atribuindu-i un șir gol `''`.
+
+- Folosind [`document.createElement()`](https://developer.mozilla.org/docs/Web/API/Document/createElement) împreună cu metoda [`append()`](https://developer.mozilla.org/docs/Web/API/ParentNode/append) puteți crea și atașa unul sau mai multe elemente copil noi.
+
+✅ Folosind proprietatea [`innerHTML`](https://developer.mozilla.org/docs/Web/API/Element/innerHTML) a unui element este, de asemenea, posibil să schimbați conținutul HTML al acestuia, dar aceasta ar trebui evitată deoarece este vulnerabilă la atacuri de tip [cross-site scripting (XSS)](https://developer.mozilla.org/docs/Glossary/Cross-site_scripting).
+
+### Sarcină
+
+Înainte de a trece la ecranul tabloului de bord, mai este un lucru pe care ar trebui să-l facem pe pagina de *login*. În prezent, dacă încercați să vă autentificați cu un nume de utilizator care nu există, un mesaj este afișat în consolă, dar pentru un utilizator obișnuit nu se întâmplă nimic și nu știți ce se întâmplă.
+
+Să adăugăm un element de tip placeholder în formularul de autentificare unde putem afișa un mesaj de eroare, dacă este necesar. Un loc bun ar fi chiar înainte de butonul de *login*:
+
+```html
+...
+<div id="loginError"></div>
+<button>Login</button>
+...
+```
+
+Acest element `<div>` este gol, ceea ce înseamnă că nimic nu va fi afișat pe ecran până când nu adăugăm conținut în el. De asemenea, îi atribuim un `id` pentru a-l putea prelua ușor cu JavaScript.
+
+Reveniți la fișierul `app.js` și creați o nouă funcție helper `updateElement`:
+
+```js
+function updateElement(id, text) {
+  const element = document.getElementById(id);
+  element.textContent = text;
+}
+```
+
+Aceasta este destul de simplă: dat fiind un *id* de element și un *text*, va actualiza conținutul text al elementului DOM cu `id`-ul corespunzător. Să folosim această metodă în locul mesajului de eroare anterior din funcția `login`:
+
+```js
+if (data.error) {
+  return updateElement('loginError', data.error);
+}
+```
+
+Acum, dacă încercați să vă autentificați cu un cont invalid, ar trebui să vedeți ceva de genul acesta:
+
+![Captură de ecran care arată mesajul de eroare afișat în timpul autentificării](../../../../translated_images/login-error.416fe019b36a63276764c2349df5d99e04ebda54fefe60c715ee87a28d5d4ad0.ro.png)
+
+Acum avem un text de eroare care apare vizual, dar dacă încercați să-l utilizați cu un cititor de ecran, veți observa că nu este anunțat nimic. Pentru ca textul adăugat dinamic pe o pagină să fie anunțat de cititoarele de ecran, va trebui să folosească ceva numit [Regiune Live](https://developer.mozilla.org/docs/Web/Accessibility/ARIA/ARIA_Live_Regions). Aici vom folosi un tip specific de regiune live numit alertă:
+
+```html
+<div id="loginError" role="alert"></div>
+```
+
+Implementați același comportament pentru erorile funcției `register` (nu uitați să actualizați HTML-ul).
+
+## Afișarea informațiilor pe tabloul de bord
+
+Folosind aceleași tehnici pe care tocmai le-am văzut, ne vom ocupa și de afișarea informațiilor despre cont pe pagina tabloului de bord.
+
+Acesta este aspectul unui obiect de cont primit de la server:
+
+```json
+{
+  "user": "test",
+  "currency": "$",
+  "description": "Test account",
+  "balance": 75,
+  "transactions": [
+    { "id": "1", "date": "2020-10-01", "object": "Pocket money", "amount": 50 },
+    { "id": "2", "date": "2020-10-03", "object": "Book", "amount": -10 },
+    { "id": "3", "date": "2020-10-04", "object": "Sandwich", "amount": -5 }
+  ],
+}
+```
+
+> Notă: pentru a vă ușura munca, puteți folosi contul `test` preexistent, care este deja populat cu date.
+
+### Sarcină
+
+Să începem prin a înlocui secțiunea "Balance" din HTML pentru a adăuga elemente de tip placeholder:
+
+```html
+<section>
+  Balance: <span id="balance"></span><span id="currency"></span>
+</section>
+```
+
+Vom adăuga, de asemenea, o nouă secțiune chiar dedesubt pentru a afișa descrierea contului:
+
+```html
+<h2 id="description"></h2>
+```
+
+✅ Deoarece descrierea contului funcționează ca un titlu pentru conținutul de dedesubt, este marcată semantic ca un titlu. Aflați mai multe despre cum [structura titlurilor](https://www.nomensa.com/blog/2017/how-structure-headings-web-accessibility) este importantă pentru accesibilitate și analizați critic pagina pentru a determina ce altceva ar putea fi un titlu.
+
+În continuare, vom crea o nouă funcție în `app.js` pentru a completa placeholder-ul:
+
+```js
+function updateDashboard() {
+  if (!account) {
+    return navigate('/login');
+  }
+
+  updateElement('description', account.description);
+  updateElement('balance', account.balance.toFixed(2));
+  updateElement('currency', account.currency);
+}
+```
+
+Mai întâi, verificăm că avem datele contului de care avem nevoie înainte de a merge mai departe. Apoi folosim funcția `updateElement()` pe care am creat-o mai devreme pentru a actualiza HTML-ul.
+
+> Pentru a face afișarea soldului mai atractivă, folosim metoda [`toFixed(2)`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed) pentru a forța afișarea valorii cu 2 zecimale.
+
+Acum trebuie să apelăm funcția noastră `updateDashboard()` de fiecare dată când tabloul de bord este încărcat. Dacă ați terminat deja [tema lecției 1](../1-template-route/assignment.md), acest lucru ar trebui să fie simplu, altfel puteți folosi următoarea implementare.
+
+Adăugați acest cod la sfârșitul funcției `updateRoute()`:
+
+```js
+if (typeof route.init === 'function') {
+  route.init();
+}
+```
+
+Și actualizați definiția rutelor cu:
+
+```js
+const routes = {
+  '/login': { templateId: 'login' },
+  '/dashboard': { templateId: 'dashboard', init: updateDashboard }
+};
+```
+
+Cu această modificare, de fiecare dată când pagina tabloului de bord este afișată, funcția `updateDashboard()` este apelată. După o autentificare, ar trebui să puteți vedea soldul contului, moneda și descrierea.
+
+## Crearea rândurilor tabelului dinamic cu șabloane HTML
+
+În [prima lecție](../1-template-route/README.md) am folosit șabloane HTML împreună cu metoda [`appendChild()`](https://developer.mozilla.org/docs/Web/API/Node/appendChild) pentru a implementa navigarea în aplicația noastră. Șabloanele pot fi, de asemenea, mai mici și utilizate pentru a popula dinamic părți repetitive ale unei pagini.
+
+Vom folosi o abordare similară pentru a afișa lista tranzacțiilor în tabelul HTML.
+
+### Sarcină
+
+Adăugați un nou șablon în `<body>`-ul HTML:
+
+```html
+<template id="transaction">
+  <tr>
+    <td></td>
+    <td></td>
+    <td></td>
+  </tr>
+</template>
+```
+
+Acest șablon reprezintă un singur rând de tabel, cu cele 3 coloane pe care dorim să le populăm: *data*, *obiectul* și *suma* unei tranzacții.
+
+Apoi, adăugați această proprietate `id` elementului `<tbody>` al tabelului din șablonul tabloului de bord pentru a-l face mai ușor de găsit folosind JavaScript:
+
+```html
+<tbody id="transactions"></tbody>
+```
+
+HTML-ul nostru este gata, să trecem la codul JavaScript și să creăm o nouă funcție `createTransactionRow`:
+
+```js
+function createTransactionRow(transaction) {
+  const template = document.getElementById('transaction');
+  const transactionRow = template.content.cloneNode(true);
+  const tr = transactionRow.querySelector('tr');
+  tr.children[0].textContent = transaction.date;
+  tr.children[1].textContent = transaction.object;
+  tr.children[2].textContent = transaction.amount.toFixed(2);
+  return transactionRow;
+}
+```
+
+Această funcție face exact ceea ce sugerează numele său: folosind șablonul pe care l-am creat mai devreme, creează un nou rând de tabel și completează conținutul acestuia folosind datele tranzacției. Vom folosi aceasta în funcția noastră `updateDashboard()` pentru a popula tabelul:
+
+```js
+const transactionsRows = document.createDocumentFragment();
+for (const transaction of account.transactions) {
+  const transactionRow = createTransactionRow(transaction);
+  transactionsRows.appendChild(transactionRow);
+}
+updateElement('transactions', transactionsRows);
+```
+
+Aici folosim metoda [`document.createDocumentFragment()`](https://developer.mozilla.org/docs/Web/API/Document/createDocumentFragment) care creează un nou fragment DOM pe care putem lucra, înainte de a-l atașa în final tabelului nostru HTML.
+
+Mai este un lucru pe care trebuie să-l facem înainte ca acest cod să funcționeze, deoarece funcția noastră `updateElement()` acceptă în prezent doar conținut text. Să schimbăm puțin codul acesteia:
+
+```js
+function updateElement(id, textOrNode) {
+  const element = document.getElementById(id);
+  element.textContent = ''; // Removes all children
+  element.append(textOrNode);
+}
+```
+
+Folosim metoda [`append()`](https://developer.mozilla.org/docs/Web/API/ParentNode/append) deoarece permite atașarea fie a textului, fie a [nodurilor DOM](https://developer.mozilla.org/docs/Web/API/Node) la un element părinte, ceea ce este perfect pentru toate cazurile noastre de utilizare.
+Dacă încercați să vă autentificați folosind contul `test`, ar trebui să vedeți acum o listă de tranzacții pe tabloul de bord 🎉.
+
+---
+
+## 🚀 Provocare
+
+Lucrați împreună pentru a face pagina tabloului de bord să arate ca o aplicație bancară reală. Dacă deja ați stilizat aplicația, încercați să folosiți [media queries](https://developer.mozilla.org/docs/Web/CSS/Media_Queries) pentru a crea un [design responsiv](https://developer.mozilla.org/docs/Web/Progressive_web_apps/Responsive/responsive_design_building_blocks) care funcționează bine atât pe dispozitive desktop, cât și pe cele mobile.
+
+Iată un exemplu de pagină de tabloul de bord stilizată:
+
+![Captură de ecran a unui exemplu de rezultat al tabloului de bord după stilizare](../../../../translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.ro.png)
+
+## Quiz de după lecție
+
+[Quiz de după lecție](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/46)
+
+## Temă
+
+[Refactorizați și comentați codul](assignment.md)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/3-data/assignment.md b/translations/ro/7-bank-project/3-data/assignment.md
new file mode 100644
index 00000000..99aca57b
--- /dev/null
+++ b/translations/ro/7-bank-project/3-data/assignment.md
@@ -0,0 +1,29 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "a4abf305ede1cfaadd56a8fab4b4c288",
+  "translation_date": "2025-08-28T07:33:01+00:00",
+  "source_file": "7-bank-project/3-data/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Refactorizează și comentează codul tău
+
+## Instrucțiuni
+
+Pe măsură ce baza ta de cod crește, este important să refactorizezi codul frecvent pentru a-l menține ușor de citit și de întreținut în timp. Adaugă comentarii și refactorizează `app.js` pentru a îmbunătăți calitatea codului:
+
+- Extrage constante, cum ar fi URL-ul de bază al API-ului serverului
+- Factorizează codul similar: de exemplu, poți crea o funcție `sendRequest()` pentru a grupa codul utilizat atât în `createAccount()`, cât și în `getAccount()`
+- Reorganizează codul pentru a-l face mai ușor de citit și adaugă comentarii
+
+## Criterii de evaluare
+
+| Criteriu | Exemplary                                                                                                                                                     | Adequate                                                                                          | Needs Improvement                                                                     |
+| -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------- |
+|          | Codul este comentat, bine organizat în secțiuni diferite și ușor de citit. Constantele sunt extrase și a fost creată o funcție factorizată `sendRequest()`.     | Codul este curat, dar poate fi îmbunătățit cu mai multe comentarii, extragerea constantelor sau factorizare. | Codul este dezordonat, fără comentarii, constantele nu sunt extrase și codul nu este factorizat. |
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/4-state-management/README.md b/translations/ro/7-bank-project/4-state-management/README.md
new file mode 100644
index 00000000..d5fcf954
--- /dev/null
+++ b/translations/ro/7-bank-project/4-state-management/README.md
@@ -0,0 +1,294 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "4fa20c513e367e9cdd401bf49ae16e33",
+  "translation_date": "2025-08-28T07:36:50+00:00",
+  "source_file": "7-bank-project/4-state-management/README.md",
+  "language_code": "ro"
+}
+-->
+# Construirea unei aplicații bancare Partea 4: Concepte de gestionare a stării
+
+## Chestionar înainte de curs
+
+[Chestionar înainte de curs](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/47)
+
+### Introducere
+
+Pe măsură ce o aplicație web crește, devine o provocare să urmărești toate fluxurile de date. Ce cod preia datele, ce pagină le consumă, unde și când trebuie actualizate... este ușor să ajungi la un cod dezordonat, greu de întreținut. Acest lucru este valabil mai ales atunci când trebuie să partajezi date între diferite pagini ale aplicației tale, de exemplu datele utilizatorului. Conceptul de *gestionare a stării* a existat întotdeauna în toate tipurile de programe, dar pe măsură ce aplicațiile web devin din ce în ce mai complexe, acesta a devenit un punct cheie de luat în considerare în timpul dezvoltării.
+
+În această ultimă parte, vom analiza aplicația pe care am construit-o pentru a regândi modul în care este gestionată starea, permițând suportul pentru reîmprospătarea browserului în orice moment și păstrarea datelor între sesiunile utilizatorului.
+
+### Prerechizite
+
+Trebuie să fi finalizat partea de [preluare a datelor](../3-data/README.md) a aplicației web pentru această lecție. De asemenea, trebuie să instalezi [Node.js](https://nodejs.org) și să [rulezi serverul API](../api/README.md) local pentru a putea gestiona datele contului.
+
+Poți testa dacă serverul funcționează corect executând această comandă într-un terminal:
+
+```sh
+curl http://localhost:5000/api
+# -> should return "Bank API v1.0.0" as a result
+```
+
+---
+
+## Regândirea gestionării stării
+
+În [lecția anterioară](../3-data/README.md), am introdus un concept de bază al stării în aplicația noastră cu variabila globală `account`, care conține datele bancare ale utilizatorului conectat în prezent. Totuși, implementarea noastră actuală are câteva defecte. Încearcă să reîmprospătezi pagina când ești pe tabloul de bord. Ce se întâmplă?
+
+Există 3 probleme cu codul actual:
+
+- Starea nu este păstrată, deoarece o reîmprospătare a browserului te duce înapoi la pagina de autentificare.
+- Există mai multe funcții care modifică starea. Pe măsură ce aplicația crește, poate deveni dificil să urmărești modificările și este ușor să uiți să actualizezi una.
+- Starea nu este curățată, astfel încât atunci când faci clic pe *Logout*, datele contului sunt încă acolo, chiar dacă ești pe pagina de autentificare.
+
+Am putea actualiza codul nostru pentru a aborda aceste probleme una câte una, dar acest lucru ar crea mai multă duplicare a codului și ar face aplicația mai complexă și mai greu de întreținut. Sau am putea să ne oprim câteva minute și să ne regândim strategia.
+
+> Ce probleme încercăm cu adevărat să rezolvăm aici?
+
+[Gestionarea stării](https://en.wikipedia.org/wiki/State_management) se referă la găsirea unei abordări bune pentru a rezolva aceste două probleme particulare:
+
+- Cum să păstrăm fluxurile de date dintr-o aplicație ușor de înțeles?
+- Cum să menținem datele stării întotdeauna sincronizate cu interfața utilizatorului (și viceversa)?
+
+Odată ce ai rezolvat aceste probleme, orice alte probleme pe care le-ai putea avea fie sunt deja rezolvate, fie au devenit mai ușor de rezolvat. Există multe abordări posibile pentru rezolvarea acestor probleme, dar vom merge pe o soluție comună care constă în **centralizarea datelor și a modurilor de a le modifica**. Fluxurile de date ar arăta astfel:
+
+![Schema care arată fluxurile de date între HTML, acțiunile utilizatorului și stare](../../../../translated_images/data-flow.fa2354e0908fecc89b488010dedf4871418a992edffa17e73441d257add18da4.ro.png)
+
+> Nu vom acoperi aici partea în care datele declanșează automat actualizarea vizualizării, deoarece este legată de concepte mai avansate de [Programare Reactivă](https://en.wikipedia.org/wiki/Reactive_programming). Este un subiect bun de aprofundat dacă ești interesat.
+
+✅ Există multe biblioteci cu abordări diferite pentru gestionarea stării, [Redux](https://redux.js.org) fiind o opțiune populară. Aruncă o privire asupra conceptelor și modelelor utilizate, deoarece este adesea o modalitate bună de a învăța ce probleme potențiale ai putea întâmpina în aplicațiile web mari și cum pot fi rezolvate.
+
+### Sarcină
+
+Vom începe cu puțină refactorizare. Înlocuiește declarația `account`:
+
+```js
+let account = null;
+```
+
+Cu:
+
+```js
+let state = {
+  account: null
+};
+```
+
+Ideea este să *centralizăm* toate datele aplicației noastre într-un singur obiect de stare. Deocamdată avem doar `account` în stare, așa că nu se schimbă prea mult, dar creează o bază pentru evoluții.
+
+De asemenea, trebuie să actualizăm funcțiile care îl folosesc. În funcțiile `register()` și `login()`, înlocuiește `account = ...` cu `state.account = ...`;
+
+La începutul funcției `updateDashboard()`, adaugă această linie:
+
+```js
+const account = state.account;
+```
+
+Această refactorizare în sine nu a adus multe îmbunătățiri, dar ideea a fost să punem bazele pentru următoarele schimbări.
+
+## Urmărirea modificărilor datelor
+
+Acum că am pus în aplicare obiectul `state` pentru a stoca datele noastre, următorul pas este să centralizăm actualizările. Scopul este să fie mai ușor să urmărim orice modificări și când se întâmplă.
+
+Pentru a evita modificările făcute direct asupra obiectului `state`, este, de asemenea, o practică bună să îl considerăm [*imutabil*](https://en.wikipedia.org/wiki/Immutable_object), ceea ce înseamnă că nu poate fi modificat deloc. Aceasta înseamnă că trebuie să creezi un nou obiect de stare dacă dorești să schimbi ceva în el. Procedând astfel, construiești o protecție împotriva [efectelor secundare](https://en.wikipedia.org/wiki/Side_effect_(computer_science)) nedorite și deschizi posibilități pentru funcții noi în aplicația ta, cum ar fi implementarea funcțiilor de anulare/refacere, făcând totodată mai ușor de depanat. De exemplu, ai putea înregistra fiecare modificare făcută stării și să păstrezi un istoric al modificărilor pentru a înțelege sursa unei erori.
+
+În JavaScript, poți utiliza [`Object.freeze()`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze) pentru a crea o versiune imutabilă a unui obiect. Dacă încerci să faci modificări unui obiect imutabil, va fi generată o excepție.
+
+✅ Știi diferența dintre un obiect imutabil *superficial* și unul *profund*? Poți citi despre asta [aici](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze#What_is_shallow_freeze).
+
+### Sarcină
+
+Să creăm o nouă funcție `updateState()`:
+
+```js
+function updateState(property, newData) {
+  state = Object.freeze({
+    ...state,
+    [property]: newData
+  });
+}
+```
+
+În această funcție, creăm un nou obiect de stare și copiem datele din starea anterioară folosind [operatorul *spread (`...`)*](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Spread_syntax#Spread_in_object_literals). Apoi, suprascriem o anumită proprietate a obiectului de stare cu noile date folosind [notația cu paranteze](https://developer.mozilla.org/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties) `[property]` pentru atribuție. În cele din urmă, blocăm obiectul pentru a preveni modificările folosind `Object.freeze()`. Deocamdată avem doar proprietatea `account` stocată în stare, dar cu această abordare poți adăuga câte proprietăți ai nevoie.
+
+Vom actualiza și inițializarea `state` pentru a ne asigura că starea inițială este, de asemenea, înghețată:
+
+```js
+let state = Object.freeze({
+  account: null
+});
+```
+
+După aceea, actualizează funcția `register` înlocuind atribuirea `state.account = result;` cu:
+
+```js
+updateState('account', result);
+```
+
+Fă același lucru cu funcția `login`, înlocuind `state.account = data;` cu:
+
+```js
+updateState('account', data);
+```
+
+Vom profita acum de ocazie pentru a rezolva problema datelor contului care nu sunt șterse atunci când utilizatorul face clic pe *Logout*.
+
+Creează o nouă funcție `logout()`:
+
+```js
+function logout() {
+  updateState('account', null);
+  navigate('/login');
+}
+```
+
+În `updateDashboard()`, înlocuiește redirecționarea `return navigate('/login');` cu `return logout();`
+
+Încearcă să înregistrezi un cont nou, să te deconectezi și să te conectezi din nou pentru a verifica dacă totul funcționează corect.
+
+> Sfat: poți analiza toate modificările stării adăugând `console.log(state)` la sfârșitul funcției `updateState()` și deschizând consola în instrumentele de dezvoltare ale browserului.
+
+## Persistența stării
+
+Majoritatea aplicațiilor web trebuie să păstreze datele pentru a funcționa corect. Toate datele critice sunt de obicei stocate într-o bază de date și accesate printr-un server API, cum ar fi datele contului utilizatorului în cazul nostru. Dar uneori, este interesant să păstrezi unele date în aplicația client care rulează în browser, pentru o experiență mai bună a utilizatorului sau pentru a îmbunătăți performanța încărcării.
+
+Când dorești să păstrezi date în browser, există câteva întrebări importante pe care ar trebui să ți le pui:
+
+- *Sunt datele sensibile?* Ar trebui să eviți stocarea oricăror date sensibile pe client, cum ar fi parolele utilizatorilor.
+- *Pentru cât timp ai nevoie să păstrezi aceste date?* Plănuiești să accesezi aceste date doar pentru sesiunea curentă sau dorești să fie stocate permanent?
+
+Există mai multe moduri de a stoca informații într-o aplicație web, în funcție de ceea ce dorești să realizezi. De exemplu, poți utiliza URL-urile pentru a stoca o interogare de căutare și a o face partajabilă între utilizatori. Poți utiliza, de asemenea, [cookie-uri HTTP](https://developer.mozilla.org/docs/Web/HTTP/Cookies) dacă datele trebuie partajate cu serverul, cum ar fi informațiile de [autentificare](https://en.wikipedia.org/wiki/Authentication).
+
+O altă opțiune este să utilizezi una dintre numeroasele API-uri ale browserului pentru stocarea datelor. Două dintre ele sunt deosebit de interesante:
+
+- [`localStorage`](https://developer.mozilla.org/docs/Web/API/Window/localStorage): un [Key/Value store](https://en.wikipedia.org/wiki/Key%E2%80%93value_database) care permite păstrarea datelor specifice site-ului web curent între diferite sesiuni. Datele salvate în acesta nu expiră niciodată.
+- [`sessionStorage`](https://developer.mozilla.org/docs/Web/API/Window/sessionStorage): funcționează la fel ca `localStorage`, cu excepția faptului că datele stocate în acesta sunt șterse atunci când sesiunea se încheie (când browserul este închis).
+
+Reține că ambele API-uri permit doar stocarea de [șiruri de caractere](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String). Dacă dorești să stochezi obiecte complexe, va trebui să le serializezi în formatul [JSON](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/JSON) folosind [`JSON.stringify()`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify).
+
+✅ Dacă dorești să creezi o aplicație web care nu funcționează cu un server, este posibil să creezi o bază de date pe client utilizând API-ul [`IndexedDB`](https://developer.mozilla.org/docs/Web/API/IndexedDB_API). Acesta este rezervat pentru cazuri de utilizare avansate sau dacă trebuie să stochezi o cantitate semnificativă de date, deoarece este mai complex de utilizat.
+
+### Sarcină
+
+Ne dorim ca utilizatorii noștri să rămână conectați până când fac clic explicit pe butonul *Logout*, așa că vom utiliza `localStorage` pentru a stoca datele contului. Mai întâi, să definim o cheie pe care o vom folosi pentru a stoca datele noastre.
+
+```js
+const storageKey = 'savedAccount';
+```
+
+Apoi adaugă această linie la sfârșitul funcției `updateState()`:
+
+```js
+localStorage.setItem(storageKey, JSON.stringify(state.account));
+```
+
+Cu aceasta, datele contului utilizatorului vor fi păstrate și întotdeauna actualizate, deoarece am centralizat anterior toate actualizările stării. Aici începem să beneficiem de toate refactorizările anterioare 🙂.
+
+Deoarece datele sunt salvate, trebuie să ne ocupăm și de restaurarea lor atunci când aplicația este încărcată. Deoarece vom începe să avem mai mult cod de inițializare, ar putea fi o idee bună să creăm o nouă funcție `init`, care să includă și codul nostru anterior de la sfârșitul fișierului `app.js`:
+
+```js
+function init() {
+  const savedAccount = localStorage.getItem(storageKey);
+  if (savedAccount) {
+    updateState('account', JSON.parse(savedAccount));
+  }
+
+  // Our previous initialization code
+  window.onpopstate = () => updateRoute();
+  updateRoute();
+}
+
+init();
+```
+
+Aici recuperăm datele salvate, iar dacă există, actualizăm starea în consecință. Este important să facem acest lucru *înainte* de a actualiza ruta, deoarece ar putea exista cod care se bazează pe starea în timpul actualizării paginii.
+
+De asemenea, putem face pagina *Dashboard* pagina implicită a aplicației noastre, deoarece acum păstrăm datele contului. Dacă nu se găsesc date, tabloul de bord se ocupă de redirecționarea către pagina de *Login* oricum. În `updateRoute()`, înlocuiește fallback-ul `return navigate('/login');` cu `return navigate('/dashboard');`.
+
+Acum conectează-te în aplicație și încearcă să reîmprospătezi pagina. Ar trebui să rămâi pe tabloul de bord. Cu această actualizare, am rezolvat toate problemele inițiale...
+
+## Reîmprospătarea datelor
+
+...Dar s-ar putea să fi creat și o problemă nouă. Ups!
+
+Accesează tabloul de bord folosind contul `test`, apoi rulează această comandă într-un terminal pentru a crea o nouă tranzacție:
+
+```sh
+curl --request POST \
+     --header "Content-Type: application/json" \
+     --data "{ \"date\": \"2020-07-24\", \"object\": \"Bought book\", \"amount\": -20 }" \
+     http://localhost:5000/api/accounts/test/transactions
+```
+
+Încearcă să reîmprospătezi pagina tabloului de bord în browser acum. Ce se întâmplă? Vezi noua tranzacție?
+
+Starea este păstrată pe termen nelimitat datorită `localStorage`, dar asta înseamnă și că nu este niciodată actualizată până când nu te deconectezi și te conectezi din nou!
+
+O strategie posibilă pentru a rezolva acest lucru este să reîncărcăm datele contului de fiecare dată când tabloul de bord este încărcat, pentru a evita datele învechite.
+
+### Sarcină
+
+Creează o nouă funcție `updateAccountData`:
+
+```js
+async function updateAccountData() {
+  const account = state.account;
+  if (!account) {
+    return logout();
+  }
+
+  const data = await getAccount(account.user);
+  if (data.error) {
+    return logout();
+  }
+
+  updateState('account', data);
+}
+```
+
+Această metodă verifică dacă utilizatorul este conectat, apoi reîncarcă datele contului de pe server.
+
+Creează o altă funcție numită `refresh`:
+
+```js
+async function refresh() {
+  await updateAccountData();
+  updateDashboard();
+}
+```
+
+Aceasta actualizează datele contului, apoi se ocupă de actualizarea HTML-ului paginii tabloului de bord. Este ceea ce trebuie să apelăm atunci când ruta tabloului de bord este încărcată. Actualizează definiția rutei cu:
+
+```js
+const routes = {
+  '/login': { templateId: 'login' },
+  '/dashboard': { templateId: 'dashboard', init: refresh }
+};
+```
+
+Încearcă să reîncarci tabloul de bord acum, ar trebui să afișeze datele contului actualizate.
+
+---
+
+## 🚀 Provocare
+
+Acum că reîncărcăm datele contului de fiecare dată când tabloul de bord este încărcat, crezi că mai este necesar să păstrăm *toate datele contului*?
+
+Încearcă să lucrați împreună pentru a modifica ceea ce este salvat și încărcat din `localStorage` astfel încât să includă doar ceea ce este absolut necesar pentru ca aplicația să funcționeze.
+
+## Chestionar după curs
+[Chestionar post-lectură](https://ashy-river-0debb7803.1.azurestaticapps.net/quiz/48)
+
+## Temă
+
+[Implementează dialogul „Adaugă tranzacție”](assignment.md)
+
+Iată un exemplu de rezultat după finalizarea temei:
+
+![Captură de ecran care arată un exemplu de dialog „Adaugă tranzacție”](../../../../translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.ro.png)
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/4-state-management/assignment.md b/translations/ro/7-bank-project/4-state-management/assignment.md
new file mode 100644
index 00000000..98b4068c
--- /dev/null
+++ b/translations/ro/7-bank-project/4-state-management/assignment.md
@@ -0,0 +1,39 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "f23a868536c07da991b1d4e773161e25",
+  "translation_date": "2025-08-28T07:38:42+00:00",
+  "source_file": "7-bank-project/4-state-management/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Implementați dialogul „Adaugă tranzacție”
+
+## Instrucțiuni
+
+Aplicația noastră bancară încă nu are o funcționalitate importantă: posibilitatea de a introduce tranzacții noi. 
+Folosind tot ce ați învățat în cele patru lecții anterioare, implementați un dialog „Adaugă tranzacție”:
+
+- Adăugați un buton „Adaugă tranzacție” pe pagina tabloului de bord
+- Fie creați o pagină nouă cu un șablon HTML, fie utilizați JavaScript pentru a afișa/ascunde HTML-ul dialogului fără a părăsi pagina tabloului de bord (puteți folosi proprietatea [`hidden`](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/hidden) pentru asta sau clase CSS)
+- Asigurați-vă că gestionați [accesibilitatea pentru tastatură și cititoare de ecran](https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/) pentru dialog
+- Implementați un formular HTML pentru a primi datele de intrare
+- Creați date JSON din datele formularului și trimiteți-le către API
+- Actualizați pagina tabloului de bord cu noile date
+
+Consultați [specificațiile API-ului serverului](../api/README.md) pentru a vedea ce API trebuie să apelați și care este formatul JSON așteptat.
+
+Iată un exemplu de rezultat după finalizarea sarcinii:
+
+![Captură de ecran care arată un exemplu de dialog „Adaugă tranzacție”](../../../../translated_images/dialog.93bba104afeb79f12f65ebf8f521c5d64e179c40b791c49c242cf15f7e7fab15.ro.png)
+
+## Criterii de evaluare
+
+| Criterii | Exemplu                                                                                          | Adecvat                                                                                                                | Necesită îmbunătățiri                        |
+| -------- | ------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------- | --------------------------------------------|
+|          | Adăugarea unei tranzacții este implementată complet, urmând toate cele mai bune practici văzute în lecții. | Adăugarea unei tranzacții este implementată, dar nu urmează cele mai bune practici văzute în lecții sau funcționează doar parțial. | Adăugarea unei tranzacții nu funcționează deloc. |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să aveți în vedere că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea umană realizată de profesioniști. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/README.md b/translations/ro/7-bank-project/README.md
new file mode 100644
index 00000000..2fb7dbca
--- /dev/null
+++ b/translations/ro/7-bank-project/README.md
@@ -0,0 +1,35 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "830359535306594b448db6575ce5cdee",
+  "translation_date": "2025-08-28T07:30:35+00:00",
+  "source_file": "7-bank-project/README.md",
+  "language_code": "ro"
+}
+-->
+# :dollar: Construiește o Bancă
+
+În acest proiect, vei învăța cum să construiești o bancă fictivă. Aceste lecții includ instrucțiuni despre cum să creezi structura unei aplicații web și să oferi rute, să construiești formulare, să gestionezi starea, și să obții date de la un API de unde poți prelua informațiile băncii.
+
+| ![Screen1](../../../translated_images/screen1.baccbba0f1f93364672eb250d2fbd21574bb1caf79a2155022dc098a741cbdfe.ro.png) | ![Screen2](../../../translated_images/screen2.123c82a831a1d14ab2061994be2fa5de9cec1ce651047217d326d4773a6348e4.ro.png) |
+|--------------------------------|--------------------------------|
+
+## Lecții
+
+1. [Șabloane HTML și Rute într-o Aplicație Web](1-template-route/README.md)
+2. [Construiește un Formular de Autentificare și Înregistrare](2-forms/README.md)
+3. [Metode de Preluare și Utilizare a Datelor](3-data/README.md)
+4. [Concepte de Gestionare a Stării](4-state-management/README.md)
+
+### Credite
+
+Aceste lecții au fost scrise cu :hearts: de [Yohan Lasorsa](https://twitter.com/sinedied).
+
+Dacă ești interesat să înveți cum să construiești [API-ul serverului](/7-bank-project/api/README.md) utilizat în aceste lecții, poți urmări [această serie de videoclipuri](https://aka.ms/NodeBeginner) (în special videoclipurile 17 până la 21).
+
+De asemenea, poți arunca o privire la [acest tutorial interactiv Learn](https://aka.ms/learn/express-api).
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/api/README.md b/translations/ro/7-bank-project/api/README.md
new file mode 100644
index 00000000..81428668
--- /dev/null
+++ b/translations/ro/7-bank-project/api/README.md
@@ -0,0 +1,48 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "9884f8c8a61cf56214450f8b16a094ce",
+  "translation_date": "2025-08-28T07:33:19+00:00",
+  "source_file": "7-bank-project/api/README.md",
+  "language_code": "ro"
+}
+-->
+# API Bancară
+
+> API bancară construită cu [Node.js](https://nodejs.org) + [Express](https://expressjs.com/).
+
+API-ul este deja construit pentru tine și nu face parte din exercițiu.
+
+Totuși, dacă ești interesat să înveți cum să construiești un API ca acesta, poți urmări această serie de videoclipuri: https://aka.ms/NodeBeginner (videoclipurile 17 până la 21 acoperă exact acest API).
+
+De asemenea, poți arunca o privire la acest tutorial interactiv: https://aka.ms/learn/express-api
+
+## Rularea serverului
+
+Asigură-te că ai instalat [Node.js](https://nodejs.org).
+
+1. Clonează acest repo [The Web-Dev-For-Beginners](https://github.com/microsoft/Web-Dev-For-Beginners).
+2. Deschide terminalul și navighează în folderul `Web-Dev-For-Beginners/7-bank-project/api`.
+3. Rulează `npm install` și așteaptă să se instaleze pachetele (poate dura ceva timp, în funcție de calitatea conexiunii tale la internet).
+4. După ce instalarea este finalizată, rulează `npm start` și ești gata.
+
+Serverul ar trebui să înceapă să asculte pe portul `5000`.
+*Acest server va rula împreună cu terminalul principal al aplicației bancare (ascultând pe portul `3000`), nu îl închide.*
+
+> Notă: toate înregistrările sunt stocate în memorie și nu sunt persistente, astfel încât, atunci când serverul este oprit, toate datele sunt pierdute.
+
+## Detalii API
+
+Rută                                         | Descriere
+---------------------------------------------|------------------------------------
+GET    /api/                                 | Obține informații despre server
+POST   /api/accounts/                        | Creează un cont, ex: `{ user: 'Yohan', description: 'My budget', currency: 'EUR', balance: 100 }`
+GET    /api/accounts/:user                   | Obține toate datele pentru contul specificat
+DELETE /api/accounts/:user                   | Șterge contul specificat
+POST   /api/accounts/:user/transactions      | Adaugă o tranzacție, ex: `{ date: '2020-07-23T18:25:43.511Z', object: 'Bought a book', amount: -20 }`
+DELETE  /api/accounts/:user/transactions/:id | Șterge tranzacția specificată
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea realizată de un profesionist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/7-bank-project/solution/README.md b/translations/ro/7-bank-project/solution/README.md
new file mode 100644
index 00000000..54324905
--- /dev/null
+++ b/translations/ro/7-bank-project/solution/README.md
@@ -0,0 +1,27 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "461aa4fc74c6b1789c3a13b5d82c0cd9",
+  "translation_date": "2025-08-28T07:33:42+00:00",
+  "source_file": "7-bank-project/solution/README.md",
+  "language_code": "ro"
+}
+-->
+# Aplicație bancară
+
+> Soluție exemplu pentru proiectul aplicației bancare, construită cu HTML5, CSS și JavaScript simplu (fără utilizarea de framework-uri sau biblioteci).
+
+## Rularea aplicației
+
+Mai întâi, asigură-te că serverul [API](../api/README.md) este pornit.
+
+Orice server web poate fi utilizat pentru a rula aplicația, dar, deoarece ar trebui să ai deja [Node.js](https://nodejs.org) instalat pentru a rula API-ul, poți:
+
+1. Clonează acest repo folosind Git.
+2. Deschide un terminal, navighează la acest director, apoi rulează `npx lite-server .`. Acesta va porni un server web de dezvoltare pe portul `3000`.
+3. Deschide `http://localhost:3000` într-un browser pentru a rula aplicația.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de oameni. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/8-code-editor/1-using-a-code-editor/README.md b/translations/ro/8-code-editor/1-using-a-code-editor/README.md
new file mode 100644
index 00000000..098493f1
--- /dev/null
+++ b/translations/ro/8-code-editor/1-using-a-code-editor/README.md
@@ -0,0 +1,158 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "7aa6e4f270d38d9cb17f2b5bd86b863d",
+  "translation_date": "2025-08-28T08:18:15+00:00",
+  "source_file": "8-code-editor/1-using-a-code-editor/README.md",
+  "language_code": "ro"
+}
+-->
+# Utilizarea unui editor de cod
+
+Această lecție acoperă elementele de bază ale utilizării [VSCode.dev](https://vscode.dev), un editor de cod bazat pe web, astfel încât să poți face modificări în codul tău și să contribui la un proiect fără a instala nimic pe computerul tău.
+
+## Obiectivele învățării
+
+În această lecție, vei învăța cum să:
+
+- Utilizezi un editor de cod într-un proiect de cod
+- Urmărești modificările cu ajutorul controlului versiunilor
+- Personalizezi editorul pentru dezvoltare
+
+### Cerințe preliminare
+
+Înainte de a începe, va trebui să îți creezi un cont pe [GitHub](https://github.com). Accesează [GitHub](https://github.com/) și creează un cont dacă nu ai deja unul.
+
+### Introducere
+
+Un editor de cod este un instrument esențial pentru scrierea programelor și colaborarea la proiecte de cod existente. Odată ce înțelegi elementele de bază ale unui editor și cum să utilizezi funcțiile acestuia, vei putea să le aplici atunci când scrii cod.
+
+## Începutul cu VSCode.dev
+
+[VSCode.dev](https://vscode.dev) este un editor de cod pe web. Nu trebuie să instalezi nimic pentru a-l utiliza, la fel ca atunci când deschizi orice alt site web. Pentru a începe cu editorul, deschide următorul link: [https://vscode.dev](https://vscode.dev). Dacă nu ești autentificat pe [GitHub](https://github.com/), urmează instrucțiunile pentru a te autentifica sau pentru a crea un cont nou și apoi autentifică-te.
+
+După ce se încarcă, ar trebui să arate similar cu această imagine:
+
+![VSCode.dev implicit](../../../../translated_images/default-vscode-dev.5d06881d65c1b3234ce50cd9ed3b0028e6031ad5f5b441bcbed96bfa6311f6d0.ro.png)
+
+Există trei secțiuni principale, începând din partea stângă și mergând spre dreapta:
+
+1. _Bara de activitate_ care include câteva pictograme, cum ar fi lupa 🔎, roata dințată ⚙️ și altele câteva.
+2. Bara de activitate extinsă, care implicit este _Explorer_, numită _bara laterală_.
+3. Și, în final, zona de cod din dreapta.
+
+Fă clic pe fiecare dintre pictograme pentru a afișa un meniu diferit. După ce ai terminat, fă clic pe _Explorer_ pentru a reveni la punctul de plecare.
+
+Când începi să creezi cod sau să modifici cod existent, acest lucru se va întâmpla în cea mai mare zonă din dreapta. Vei folosi această zonă și pentru a vizualiza codul existent, ceea ce vei face în continuare.
+
+## Deschide un depozit GitHub
+
+Primul lucru de care ai nevoie este să deschizi un depozit GitHub. Există mai multe moduri de a deschide un depozit. În această secțiune vei vedea două moduri diferite prin care poți deschide un depozit pentru a începe să lucrezi la modificări.
+
+### 1. Cu editorul
+
+Folosește editorul pentru a deschide un depozit de la distanță. Dacă accesezi [VSCode.dev](https://vscode.dev), vei vedea un buton _"Open Remote Repository"_:
+
+![Deschide un depozit de la distanță](../../../../translated_images/open-remote-repository.bd9c2598b8949e7fc283cdfc8f4050c6205a7c7c6d3f78c4b135115d037d6fa2.ro.png)
+
+Poți folosi și paleta de comenzi. Paleta de comenzi este o casetă de introducere unde poți tasta orice cuvânt care face parte dintr-o comandă sau o acțiune pentru a găsi comanda corectă de executat. Folosește meniul din stânga sus, apoi selectează _View_ și alege _Command Palette_, sau folosește următoarea combinație de taste: Ctrl-Shift-P (pe MacOS ar fi Command-Shift-P).
+
+![Meniul paletei](../../../../translated_images/palette-menu.4946174e07f426226afcdad707d19b8d5150e41591c751c45b5dee213affef91.ro.png)
+
+Odată ce meniul se deschide, tastează _open remote repository_ și apoi selectează prima opțiune. Vor apărea mai multe depozite din care faci parte sau pe care le-ai deschis recent. Poți folosi și un URL complet GitHub pentru a selecta unul. Folosește următorul URL și lipește-l în casetă:
+
+```
+https://github.com/microsoft/Web-Dev-For-Beginners
+```
+
+✅ Dacă totul a fost realizat cu succes, vei vedea toate fișierele acestui depozit încărcate în editorul de text.
+
+### 2. Utilizând URL-ul
+
+Poți folosi și un URL direct pentru a încărca un depozit. De exemplu, URL-ul complet pentru depozitul curent este [https://github.com/microsoft/Web-Dev-For-Beginners](https://github.com/microsoft/Web-Dev-For-Beginners), dar poți înlocui domeniul GitHub cu `VSCode.dev/github` și încărca depozitul direct. URL-ul rezultat ar fi [https://vscode.dev/github/microsoft/Web-Dev-For-Beginners](https://vscode.dev/github/microsoft/Web-Dev-For-Beginners).
+
+## Editează fișiere
+
+După ce ai deschis depozitul în browser/vscode.dev, următorul pas este să faci actualizări sau modificări la proiect.
+
+### 1. Creează un fișier nou
+
+Poți crea un fișier fie într-un folder existent, fie în directorul/folderul rădăcină. Pentru a crea un fișier nou, deschide locația/directorul în care vrei să salvezi fișierul și selectează pictograma _'New file ...'_ din bara de activitate _(stânga)_, dă-i un nume și apasă Enter.
+
+![Creează un fișier nou](../../../../translated_images/create-new-file.2814e609c2af9aeb6c6fd53156c503ac91c3d538f9cac63073b2dd4a7631f183.ro.png)
+
+### 2. Editează și salvează un fișier în depozit
+
+Utilizarea vscode.dev este utilă ori de câte ori vrei să faci actualizări rapide la proiectul tău fără a încărca vreun software local.
+Pentru a-ți actualiza codul, fă clic pe pictograma 'Explorer', situată și ea pe bara de activitate, pentru a vizualiza fișierele și folderele din depozit.
+Selectează un fișier pentru a-l deschide în zona de cod, fă modificările necesare și salvează.
+
+![Editează un fișier](../../../../translated_images/edit-a-file.52c0ee665ef19f08119d62d63f395dfefddc0a4deb9268d73bfe791f52c5807a.ro.png)
+
+După ce ai terminat de actualizat proiectul, selectează pictograma _`source control`_ care conține toate modificările noi pe care le-ai făcut în depozit.
+
+Pentru a vizualiza modificările pe care le-ai făcut în proiect, selectează fișierul(ele) din folderul `Changes` din bara de activitate extinsă. Acest lucru va deschide un 'Working Tree' pentru a vedea vizual modificările pe care le-ai făcut în fișier. Roșu indică o omisiune din proiect, în timp ce verdele semnifică o adăugare.
+
+![Vizualizează modificările](../../../../translated_images/working-tree.c58eec08e6335c79cc708c0c220c0b7fea61514bd3c7fb7471905a864aceac7c.ro.png)
+
+Dacă ești mulțumit de modificările pe care le-ai făcut, treci cu mouse-ul peste folderul `Changes` și fă clic pe butonul `+` pentru a stabili modificările. Stabilirea înseamnă pur și simplu pregătirea modificărilor pentru a le trimite pe GitHub.
+
+Dacă, totuși, nu ești confortabil cu unele modificări și vrei să le anulezi, treci cu mouse-ul peste folderul `Changes` și selectează pictograma `undo`.
+
+Apoi, tastează un `commit message` _(O descriere a modificării pe care ai făcut-o proiectului)_, fă clic pe pictograma `check` pentru a confirma și trimite modificările.
+
+După ce ai terminat de lucrat la proiect, selectează pictograma `hamburger menu` din stânga sus pentru a reveni la depozitul de pe github.com.
+
+![Stabilește și confirmă modificările](../../../../8-code-editor/images/edit-vscode.dev.gif)
+
+## Utilizarea extensiilor
+
+Instalarea extensiilor pe VSCode îți permite să adaugi funcții noi și opțiuni personalizate pentru mediul de dezvoltare în editorul tău, pentru a-ți îmbunătăți fluxul de lucru. Aceste extensii te ajută, de asemenea, să adaugi suport pentru mai multe limbaje de programare și sunt adesea fie extensii generice, fie extensii bazate pe limbaj.
+
+Pentru a răsfoi lista tuturor extensiilor disponibile, fă clic pe pictograma _`Extensions`_ din bara de activitate și începe să tastezi numele extensiei în câmpul de text etichetat _'Search Extensions in Marketplace'_.
+Vei vedea o listă de extensii, fiecare conținând **numele extensiei, numele editorului, o descriere de o propoziție, numărul de descărcări** și **un rating cu stele**.
+
+![Detalii despre extensii](../../../../translated_images/extension-details.9f8f1fd4e9eb2de5069ae413119eb8ee43172776383ebe2f7cf640e11df2e106.ro.png)
+
+Poți vizualiza, de asemenea, toate extensiile instalate anterior extinzând folderul _`Installed`_, extensiile populare utilizate de majoritatea dezvoltatorilor în folderul _`Popular`_ și extensiile recomandate pentru tine fie de utilizatori din același workspace, fie pe baza fișierelor deschise recent în folderul _`recommended`_.
+
+![Vizualizează extensiile](../../../../translated_images/extensions.eca0e0c7f59a10b5c88be7fe24b3e32cca6b6058b35a49026c3a9d80b1813b7c.ro.png)
+
+### 1. Instalează extensii
+
+Pentru a instala o extensie, tastează numele extensiei în câmpul de căutare și fă clic pe ea pentru a vizualiza informații suplimentare despre extensie în zona de cod, odată ce apare în bara de activitate extinsă.
+
+Poți face clic pe butonul _albastru de instalare_ din bara de activitate extinsă pentru a instala sau poți folosi butonul de instalare care apare în zona de cod odată ce selectezi extensia pentru a încărca informații suplimentare.
+
+![Instalează extensii](../../../../8-code-editor/images/install-extension.gif)
+
+### 2. Personalizează extensiile
+
+După instalarea extensiei, este posibil să fie nevoie să îi modifici comportamentul și să o personalizezi în funcție de preferințele tale. Pentru a face acest lucru, selectează pictograma Extensions, iar de această dată extensia ta va apărea în folderul _Installed_, fă clic pe _**pictograma Gear**_ și navighează la _Extensions Setting_.
+
+![Modifică setările extensiei](../../../../translated_images/extension-settings.21c752ae4f4cdb78a867f140ccd0680e04619d0c44bb4afb26373e54b829d934.ro.png)
+
+### 3. Gestionează extensiile
+
+După instalarea și utilizarea extensiei, vscode.dev oferă opțiuni pentru a gestiona extensia în funcție de diferite nevoi. De exemplu, poți alege să:
+
+- **Dezactivezi:** _(Poți dezactiva temporar o extensie atunci când nu mai ai nevoie de ea, dar nu vrei să o dezinstalezi complet)_
+
+    Selectează extensia instalată din bara de activitate extinsă > fă clic pe pictograma Gear > selectează 'Disable' sau 'Disable (Workspace)' **SAU** Deschide extensia în zona de cod și fă clic pe butonul albastru Disable.
+
+- **Dezinstalezi:** Selectează extensia instalată din bara de activitate extinsă > fă clic pe pictograma Gear > selectează 'Uninstall' **SAU** Deschide extensia în zona de cod și fă clic pe butonul albastru Uninstall.
+
+---
+
+## Temă
+
+[Crează un site de tip CV folosind vscode.dev](https://github.com/microsoft/Web-Dev-For-Beginners/blob/main/8-code-editor/1-using-a-code-editor/assignment.md)
+
+## Recapitulare și studiu individual
+
+Citește mai multe despre [VSCode.dev](https://code.visualstudio.com/docs/editor/vscode-web?WT.mc_id=academic-0000-alfredodeza) și alte funcții ale acestuia.
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/8-code-editor/1-using-a-code-editor/assignment.md b/translations/ro/8-code-editor/1-using-a-code-editor/assignment.md
new file mode 100644
index 00000000..356b2300
--- /dev/null
+++ b/translations/ro/8-code-editor/1-using-a-code-editor/assignment.md
@@ -0,0 +1,247 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "2fcb983b8dbadadb1bc2e97f8c12dac5",
+  "translation_date": "2025-08-28T08:19:41+00:00",
+  "source_file": "8-code-editor/1-using-a-code-editor/assignment.md",
+  "language_code": "ro"
+}
+-->
+# Creează un site de tip CV folosind vscode.dev
+
+_Cât de tare ar fi ca un recrutor să îți ceară CV-ul și tu să îi trimiți un link?_ 😎
+
+## Obiective
+
+După această activitate, vei învăța cum să:
+
+- Creezi un site pentru a-ți prezenta CV-ul
+
+### Cerințe preliminare
+
+1. Un cont GitHub. Accesează [GitHub](https://github.com/) și creează un cont dacă nu ai deja unul.
+
+## Pași
+
+**Pasul 1:** Creează un nou depozit GitHub și dă-i numele `my-resume`.
+
+**Pasul 2:** Creează un fișier `index.html` în depozitul tău. Vom adăuga cel puțin un fișier direct pe github.com, deoarece nu poți deschide un depozit gol pe vscode.dev.
+
+Apasă pe linkul `creating a new file`, tastează numele `index.html` și selectează butonul `Commit new file`.
+
+![Creează un fișier nou pe github.com](../../../../translated_images/new-file-github.com.c886796d800e8056561829a181be1382c5303da9d902d8b2dd82b68a4806e21f.ro.png)
+
+**Pasul 3:** Deschide [VSCode.dev](https://vscode.dev) și selectează butonul `Open Remote Repository`.
+
+Copiază URL-ul depozitului pe care tocmai l-ai creat pentru site-ul tău de CV și lipește-l în caseta de input:
+
+_Înlocuiește `your-username` cu numele tău de utilizator GitHub._
+
+```
+https://github.com/your-username/my-resume
+```
+
+✅ Dacă totul a fost realizat cu succes, vei vedea proiectul tău și fișierul index.html deschise în editorul de text din browser.
+
+![Creează un fișier nou](../../../../translated_images/project-on-vscode.dev.e79815a9a95ee7feac72ebe5c941c91279716be37c575dbdbf2f43bea2c7d8b6.ro.png)
+
+**Pasul 4:** Deschide fișierul `index.html`, lipește codul de mai jos în zona de cod și salvează.
+
+<details>
+    <summary><b>Cod HTML responsabil pentru conținutul site-ului tău de CV.</b></summary>
+    
+        <html>
+
+            <head>
+                <link href="style.css" rel="stylesheet">
+                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
+                <title>Numele Tău Aici!</title>
+            </head>
+            <body>
+                <header id="header">
+                    <!-- antetul CV-ului cu numele și titlul tău -->
+                    <h1>Numele Tău Aici!</h1>
+                    <hr>
+                    Rolul Tău!
+                    <hr>
+                </header>
+                <main>
+                    <article id="mainLeft">
+                        <section>
+                            <h2>CONTACT</h2>
+                            <!-- informații de contact, inclusiv social media -->
+                            <p>
+                                <i class="fa fa-envelope" aria-hidden="true"></i>
+                                <a href="mailto:username@domain.top-level domain">Scrie emailul tău aici</a>
+                            </p>
+                            <p>
+                                <i class="fab fa-github" aria-hidden="true"></i>
+                                <a href="github.com/yourGitHubUsername">Scrie numele tău de utilizator aici!</a>
+                            </p>
+                            <p>
+                                <i class="fab fa-linkedin" aria-hidden="true"></i>
+                                <a href="linkedin.com/yourLinkedInUsername">Scrie numele tău de utilizator aici!</a>
+                            </p>
+                        </section>
+                        <section>
+                            <h2>ABILITĂȚI</h2>
+                            <!-- abilitățile tale -->
+                            <ul>
+                                <li>Abilitatea 1!</li>
+                                <li>Abilitatea 2!</li>
+                                <li>Abilitatea 3!</li>
+                                <li>Abilitatea 4!</li>
+                            </ul>
+                        </section>
+                        <section>
+                            <h2>EDUCAȚIE</h2>
+                            <!-- educația ta -->
+                            <h3>Scrie cursul tău aici!</h3>
+                            <p>
+                                Scrie instituția ta aici!
+                            </p>
+                            <p>
+                                Data de început - Data de final
+                            </p>
+                        </section>            
+                    </article>
+                    <article id="mainRight">
+                        <section>
+                            <h2>DESPRE</h2>
+                            <!-- despre tine -->
+                            <p>Scrie câteva cuvinte despre tine!</p>
+                        </section>
+                        <section>
+                            <h2>EXPERIENȚĂ PROFESIONALĂ</h2>
+                            <!-- experiența ta profesională -->
+                            <h3>Titlul Jobului</h3>
+                            <p>
+                                Numele Organizației Aici | Luna de început – Luna de final
+                            </p>
+                            <ul>
+                                    <li>Sarcina 1 - Scrie ce ai făcut!</li>
+                                    <li>Sarcina 2 - Scrie ce ai făcut!</li>
+                                    <li>Scrie rezultatele/impactul contribuției tale</li>
+                                    
+                            </ul>
+                            <h3>Titlul Jobului 2</h3>
+                            <p>
+                                Numele Organizației Aici | Luna de început – Luna de final
+                            </p>
+                            <ul>
+                                    <li>Sarcina 1 - Scrie ce ai făcut!</li>
+                                    <li>Sarcina 2 - Scrie ce ai făcut!</li>
+                                    <li>Scrie rezultatele/impactul contribuției tale</li>
+                                    
+                            </ul>
+                        </section>
+                    </article>
+                </main>
+            </body>
+        </html>
+</details>
+
+Adaugă detaliile CV-ului tău pentru a înlocui _textul de tip placeholder_ din codul HTML.
+
+**Pasul 5:** Plasează cursorul pe folderul My-Resume, apasă pe pictograma `New File ...` și creează 2 fișiere noi în proiectul tău: `style.css` și `codeswing.json`.
+
+**Pasul 6:** Deschide fișierul `style.css`, lipește codul de mai jos și salvează.
+
+<details>
+        <summary><b>Cod CSS pentru formatul layout-ului site-ului.</b></summary>
+            
+            body {
+                font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+                font-size: 16px;
+                max-width: 960px;
+                margin: auto;
+            }
+            h1 {
+                font-size: 3em;
+                letter-spacing: .6em;
+                padding-top: 1em;
+                padding-bottom: 1em;
+            }
+
+            h2 {
+                font-size: 1.5em;
+                padding-bottom: 1em;
+            }
+
+            h3 {
+                font-size: 1em;
+                padding-bottom: 1em;
+            }
+            main { 
+                display: grid;
+                grid-template-columns: 40% 60%;
+                margin-top: 3em;
+            }
+            header {
+                text-align: center;
+                margin: auto 2em;
+            }
+
+            section {
+                margin: auto 1em 4em 2em;
+            }
+
+            i {
+                margin-right: .5em;
+            }
+
+            p {
+                margin: .2em auto
+            }
+
+            hr {
+                border: none;
+                background-color: lightgray;
+                height: 1px;
+            }
+
+            h1, h2, h3 {
+                font-weight: 100;
+                margin-bottom: 0;
+            }
+            #mainLeft {
+                border-right: 1px solid lightgray;
+            }
+            
+</details>
+
+**Pasul 6:** Deschide fișierul `codeswing.json`, lipește codul de mai jos și salvează.
+
+    {
+    "scripts": [],
+    "styles": []
+    }
+
+**Pasul 7:** Instalează extensia `Codeswing` pentru a vizualiza site-ul CV-ului în zona de cod.
+
+Apasă pe pictograma _`Extensions`_ din bara de activități și tastează Codeswing. Fie apasă pe butonul _albastru de instalare_ din bara de activități extinsă pentru a instala, fie folosește butonul de instalare care apare în zona de cod odată ce selectezi extensia pentru a încărca informații suplimentare. Imediat după instalarea extensiei, observă schimbările din proiectul tău 😃.
+
+![Instalează extensii](../../../../8-code-editor/images/install-extension.gif)
+
+Aceasta este ceea ce vei vedea pe ecranul tău după instalarea extensiei.
+
+![Extensia Codeswing în acțiune](../../../../translated_images/after-codeswing-extension-pb.0ebddddcf73b550994947a9084e35e2836c713ae13839d49628e3c764c1cfe83.ro.png)
+
+Dacă ești mulțumit de modificările pe care le-ai făcut, plasează cursorul pe folderul `Changes` și apasă pe butonul `+` pentru a stoca modificările.
+
+Tastează un mesaj de commit _(O descriere a modificării pe care ai făcut-o proiectului)_ și confirmă modificările apăsând pe `check`. După ce ai terminat de lucrat la proiectul tău, selectează pictograma meniului hamburger din colțul stâng sus pentru a reveni la depozitul de pe GitHub.
+
+Felicitări 🎉 Tocmai ai creat site-ul CV-ului tău folosind vscode.dev în câțiva pași.
+
+## 🚀 Provocare
+
+Deschide un depozit remote la care ai permisiuni să faci modificări și actualizează câteva fișiere. Apoi, încearcă să creezi o nouă ramură cu modificările tale și să faci un Pull Request.
+
+## Recapitulare și Studiu Individual
+
+Citește mai multe despre [VSCode.dev](https://code.visualstudio.com/docs/editor/vscode-web?WT.mc_id=academic-0000-alfredodeza) și alte funcționalități ale acestuia.
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/CODE_OF_CONDUCT.md b/translations/ro/CODE_OF_CONDUCT.md
new file mode 100644
index 00000000..b92a008e
--- /dev/null
+++ b/translations/ro/CODE_OF_CONDUCT.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b0a9b4cccd918195f58224d5793da1a6",
+  "translation_date": "2025-08-28T07:30:18+00:00",
+  "source_file": "CODE_OF_CONDUCT.md",
+  "language_code": "ro"
+}
+-->
+# Codul de Conduită pentru Proiectele Open Source Microsoft
+
+Acest proiect a adoptat [Codul de Conduită pentru Proiectele Open Source Microsoft](https://opensource.microsoft.com/codeofconduct/?WT.mc_id=academic-77807-sagibbon).
+
+Resurse:
+
+- [Codul de Conduită pentru Proiectele Open Source Microsoft](https://opensource.microsoft.com/codeofconduct/?WT.mc_id=academic-77807-sagibbon)
+- [Întrebări frecvente despre Codul de Conduită Microsoft](https://opensource.microsoft.com/codeofconduct/faq/?WT.mc_id=academic-77807-sagibbon)
+- Contactați [opencode@microsoft.com](mailto:opencode@microsoft.com) pentru întrebări sau nelămuriri
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus utilizând serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să aveți în vedere că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/CONTRIBUTING.md b/translations/ro/CONTRIBUTING.md
new file mode 100644
index 00000000..e3a2b5ba
--- /dev/null
+++ b/translations/ro/CONTRIBUTING.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "777400e9f0336c7ee2f9a1200a88478f",
+  "translation_date": "2025-08-28T07:28:58+00:00",
+  "source_file": "CONTRIBUTING.md",
+  "language_code": "ro"
+}
+-->
+# Contribuții
+
+Acest proiect acceptă contribuții și sugestii. Majoritatea contribuțiilor necesită ca tu să fii de acord cu un Acord de Licență pentru Contribuitori (CLA), declarând că ai dreptul și, de fapt, acorzi drepturile necesare pentru ca noi să folosim contribuția ta. Pentru mai multe detalii, vizitează [https://cla.microsoft.com](https://cla.microsoft.com/?WT.mc_id=academic-77807-sagibbon).
+
+Când trimiți un pull request, un bot CLA va determina automat dacă trebuie să furnizezi un CLA și va adăuga informațiile corespunzătoare la PR (de exemplu, etichetă, comentariu). Urmează pur și simplu instrucțiunile oferite de bot. Va trebui să faci acest lucru o singură dată pentru toate depozitele care folosesc CLA-ul nostru. Te rugăm, de asemenea, să încerci să ne explici de ce ai făcut acea modificare, astfel încât să înțelegem mai bine cererea ta.
+
+Acest proiect a adoptat [Codul de Conduită pentru Open Source de la Microsoft](https://opensource.microsoft.com/codeofconduct/?WT.mc_id=academic-77807-sagibbon).  
+Pentru mai multe informații, consultă [FAQ-ul Codului de Conduită](https://opensource.microsoft.com/codeofconduct/faq/?WT.mc_id=academic-77807-sagibbon)  
+sau contactează [opencode@microsoft.com](mailto:opencode@microsoft.com) pentru orice întrebări sau comentarii suplimentare.
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/README.md b/translations/ro/README.md
new file mode 100644
index 00000000..7bdef990
--- /dev/null
+++ b/translations/ro/README.md
@@ -0,0 +1,210 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "efa251c5fc089367f0a81c572874afca",
+  "translation_date": "2025-08-28T07:25:30+00:00",
+  "source_file": "README.md",
+  "language_code": "ro"
+}
+-->
+[![Licență GitHub](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE)  
+[![Contribuitori GitHub](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)  
+[![Probleme GitHub](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)  
+[![Pull Requests GitHub](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)  
+[![PR-uri Binevenite](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)  
+
+[![Observatori GitHub](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)  
+[![Fork-uri GitHub](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)  
+[![Stele GitHub](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)  
+
+[![](https://dcbadge.vercel.app/api/server/ByRwuEEgH4)](https://discord.gg/zxKYvhSnVp?WT.mc_id=academic-000002-leestott)  
+
+[![Deschide în Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Deschide%20în%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)  
+
+[![Microsoft Azure AI Foundry Discord](https://dcbadge.limes.pink/api/server/ByRwuEEgH4)](https://discord.com/invite/ByRwuEEgH4)  
+
+Urmați acești pași pentru a începe să utilizați aceste resurse:  
+1. **Forkați Repozitoriul**: Click [![Fork-uri GitHub](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)  
+2. **Clonați Repozitoriul**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`  
+3. [**Alăturați-vă Discordului Azure AI Foundry și întâlniți experți și alți dezvoltatori**](https://discord.com/invite/ByRwuEEgH4)  
+
+# Dezvoltare Web pentru Începători - Un Curriculum  
+
+Învață fundamentele dezvoltării web cu cursul nostru cuprinzător de 12 săptămâni oferit de Microsoft Cloud Advocates. Fiecare dintre cele 24 de lecții explorează JavaScript, CSS și HTML prin proiecte practice precum terarii, extensii de browser și jocuri spațiale. Participă la quiz-uri, discuții și teme practice. Îmbunătățește-ți abilitățile și optimizează-ți retenția cunoștințelor cu pedagogia noastră bazată pe proiecte. Începe călătoria ta în programare astăzi!  
+
+#### 🧑‍🎓 _Ești student?_  
+
+Vizitează [**pagina Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) unde vei găsi resurse pentru începători, pachete pentru studenți și chiar modalități de a obține un voucher gratuit pentru certificare. Aceasta este pagina pe care vrei să o salvezi și să o verifici periodic, deoarece conținutul este actualizat lunar.  
+
+### 📣 Anunț - _Curriculum Nou_ despre Generative AI pentru JavaScript tocmai a fost lansat  
+
+Nu rata noul nostru curriculum despre Generative AI!  
+
+Vizitează [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) pentru a începe!  
+
+![Fundal](../../translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.ro.png)  
+
+- Lecții care acoperă totul, de la bazele AI la RAG.  
+- Interacționează cu personaje istorice folosind GenAI și aplicația noastră companion.  
+- Narațiune distractivă și captivantă, vei călători în timp!  
+
+![personaj](../../translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.ro.png)  
+
+Fiecare lecție include o temă de completat, o verificare a cunoștințelor și o provocare pentru a te ghida în învățarea subiectelor precum:  
+- Prompting și ingineria prompturilor  
+- Generarea de aplicații text și imagine  
+- Aplicații de căutare  
+
+Vizitează [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) pentru a începe!  
+
+## 🌱 Începe  
+
+> **Profesori**, am [inclus câteva sugestii](for-teachers.md) despre cum să utilizați acest curriculum. Ne-ar plăcea să primim feedback-ul vostru [în forumul nostru de discuții](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!  
+
+**[Cursanți](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, pentru fiecare lecție, începeți cu un quiz de pre-lectură și continuați cu citirea materialului de lectură, completarea diverselor activități și verificați-vă înțelegerea cu quiz-ul de post-lectură.  
+
+Pentru a îmbunătăți experiența de învățare, conectați-vă cu colegii pentru a lucra împreună la proiecte! Discuțiile sunt încurajate în [forumurile noastre de discuții](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), unde echipa noastră de moderatori va fi disponibilă pentru a răspunde întrebărilor voastre.  
+
+Pentru a vă continua educația, recomandăm cu tărie explorarea [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) pentru materiale de studiu suplimentare.  
+
+### 📋 Configurarea mediului  
+
+Acest curriculum are un mediu de dezvoltare gata de utilizare! Pe măsură ce începeți, puteți alege să rulați curriculum-ul într-un [Codespace](https://github.com/features/codespaces/) (_un mediu bazat pe browser, fără instalări necesare_), sau local pe computerul vostru folosind un editor de text precum [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).  
+
+#### Creați repo-ul vostru  
+Pentru a salva cu ușurință munca voastră, este recomandat să creați o copie proprie a acestui repo. Puteți face acest lucru făcând click pe butonul **Use this template** din partea de sus a paginii. Acest lucru va crea un nou repo în contul vostru GitHub cu o copie a curriculum-ului.  
+
+Urmați acești pași:  
+1. **Forkați Repozitoriul**: Click pe butonul "Fork" din colțul din dreapta sus al acestei pagini.  
+2. **Clonați Repozitoriul**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`  
+
+#### Rularea curriculum-ului într-un Codespace  
+
+În copia voastră a acestui repo pe care ați creat-o, faceți click pe butonul **Code** și selectați **Open with Codespaces**. Acest lucru va crea un nou Codespace pentru voi în care să lucrați.  
+
+[!Codespace](../..)./images/createcodespace.png)  
+
+#### Rularea curriculum-ului local pe computerul vostru  
+
+Pentru a rula acest curriculum local pe computerul vostru, veți avea nevoie de un editor de text, un browser și un instrument de linie de comandă. Prima noastră lecție, [Introducere în Limbaje de Programare și Instrumente de Lucru](../../1-getting-started-lessons/1-intro-to-programming-languages), vă va ghida prin diverse opțiuni pentru fiecare dintre aceste instrumente, astfel încât să selectați ceea ce funcționează cel mai bine pentru voi.  
+
+Recomandarea noastră este să utilizați [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ca editor, care are și un [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) integrat. Puteți descărca Visual Studio Code [aici](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).  
+
+1. Clonați repo-ul vostru pe computer. Puteți face acest lucru făcând click pe butonul **Code** și copiind URL-ul:  
+
+    [!CodeSpace](./images/createcodespace.png)  
+
+    Apoi, deschideți [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) în cadrul [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) și rulați următoarea comandă, înlocuind `<your-repository-url>` cu URL-ul pe care tocmai l-ați copiat:  
+
+    ```bash 
+    git clone <your-repository-url>
+    ```  
+
+2. Deschideți folderul în Visual Studio Code. Puteți face acest lucru făcând click pe **File** > **Open Folder** și selectând folderul pe care tocmai l-ați clonat.  
+
+>  Extensii recomandate pentru Visual Studio Code:  
+>  
+> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - pentru a previzualiza paginile HTML direct în Visual Studio Code  
+> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - pentru a vă ajuta să scrieți cod mai rapid  
+
+## 📂 Fiecare lecție include:  
+
+- schiță opțională  
+- video suplimentar opțional  
+- quiz de încălzire înainte de lecție  
+- lecție scrisă  
+- pentru lecțiile bazate pe proiecte, ghiduri pas cu pas despre cum să construiți proiectul  
+- verificări ale cunoștințelor  
+- o provocare  
+- lectură suplimentară  
+- temă  
+- [quiz de după lecție](https://ff-quizzes.netlify.app/)  
+
+> **O notă despre quiz-uri**: Toate quiz-urile sunt conținute în folderul Quiz-app, 48 de quiz-uri în total, fiecare cu trei întrebări. Acestea sunt disponibile [aici](https://ff-quizzes.netlify.app/) și aplicația de quiz poate fi rulată local sau implementată pe Azure; urmați instrucțiunile din folderul `quiz-app`.  
+
+## 🗃️ Lecții  
+
+|     |                       Nume Proiect                       |                            Concepte Învățate                            | Obiective de Învățare                                                                                                               |                                                         Lecție Legată                                                          |         Autor          |  
+| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |  
+| 01  |                     Începuturi                          |           Introducere în Programare și Instrumente de Lucru            | Învață bazele din spatele majorității limbajelor de programare și despre software-ul care ajută dezvoltatorii profesioniști să-și facă treaba | [Introducere în Limbaje de Programare și Instrumente de Lucru](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) |         Jasmine         |  
+| 02  |                     Începuturi                          |             Bazele GitHub, inclusiv lucrul în echipă                   | Cum să folosești GitHub în proiectul tău, cum să colaborezi cu alții pe o bază de cod                                                |                            [Introducere în GitHub](./1-getting-started-lessons/2-github-basics/README.md)                             |          Floor          |  
+| 03  |                     Începuturi                          |                             Accesibilitate                             | Învață bazele accesibilității web                                                                                                   |                       [Fundamentele Accesibilității](./1-getting-started-lessons/3-accessibility/README.md)                       |       Christopher       |  
+| 04  |                        Bazele JS                        |                         Tipuri de Date în JavaScript                   | Bazele tipurilor de date în JavaScript                                                                                              |                                       [Tipuri de Date](./2-js-basics/1-data-types/README.md)                                        |         Jasmine         |  
+| 05  |                        Bazele JS                        |                         Funcții și Metode                              | Învață despre funcții și metode pentru a gestiona fluxul logic al unei aplicații                                                     |                              [Funcții și Metode](./2-js-basics/2-functions-methods/README.md)                               | Jasmine și Christopher |  
+| 06  |                        Bazele JS                        |                        Luarea Deciziilor cu JS                         | Învață cum să creezi condiții în codul tău folosind metode de luare a deciziilor                                                     |                                 [Luarea Deciziilor](./2-js-basics/3-making-decisions/README.md)                                  |         Jasmine         |  
+| 07  |                        Bazele JS                        |                            Arrays și Bucle                             | Lucrează cu date folosind arrays și bucle în JavaScript                                                                             |                                   [Arrays și Bucle](./2-js-basics/4-arrays-loops/README.md)                                    |         Jasmine         |  
+| 08  |       [Terariu](./3-terrarium/solution/README.md)       |                            HTML în Practică                            | Construiește HTML-ul pentru a crea un terariu online, concentrându-te pe crearea unui layout                                         |                                 [Introducere în HTML](./3-terrarium/1-intro-to-html/README.md)                                 |           Jen           |  
+| 09  |       [Terariu](./3-terrarium/solution/README.md)       |                            CSS în Practică                             | Construiește CSS-ul pentru a stiliza terariul online, concentrându-te pe bazele CSS, inclusiv pe crearea unei pagini responsive      |                                  [Introducere în CSS](./3-terrarium/2-intro-to-css/README.md)                                  |           Jen           |  
+| 10  |            [Terrarium](./3-terrarium/solution/README.md)            |                 Închideri JavaScript, manipularea DOM                  | Construiește JavaScript-ul pentru a face ca terariul să funcționeze ca o interfață drag/drop, concentrându-se pe închideri și manipularea DOM             |                  [Închideri JavaScript, manipularea DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md)                   |           Jen           |
+| 11  |          [Typing Game](./4-typing-game/solution/README.md)          |                          Construiește un joc de tastare                           | Învață cum să folosești evenimentele tastaturii pentru a conduce logica aplicației tale JavaScript                                                          |                                [Programare bazată pe evenimente](./4-typing-game/typing-game/README.md)                                |       Christopher       |
+| 12  | [Green Browser Extension](./5-browser-extension/solution/README.md) |                         Lucrul cu browsere                          | Învață cum funcționează browserele, istoria lor și cum să creezi primele elemente ale unei extensii de browser                               |                               [Despre browsere](./5-browser-extension/1-about-browsers/README.md)                                |           Jen           |
+| 13  | [Green Browser Extension](./5-browser-extension/solution/README.md) | Construirea unui formular, apelarea unui API și stocarea variabilelor în local storage | Construiește elementele JavaScript ale extensiei de browser pentru a apela un API folosind variabile stocate în local storage                      |                [API-uri, Formulare și Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md)                 |           Jen           |
+| 14  | [Green Browser Extension](./5-browser-extension/solution/README.md) |          Procese de fundal în browser, performanța web          | Folosește procesele de fundal ale browserului pentru a gestiona pictograma extensiei; învață despre performanța web și câteva optimizări pentru a îmbunătăți   |             [Sarcini de fundal și performanță](./5-browser-extension/3-background-tasks-and-performance/README.md)              |           Jen           |
+| 15  |           [Space Game](./6-space-game/solution/README.md)           |             Dezvoltare avansată de jocuri cu JavaScript             | Învață despre moștenire folosind atât clase, cât și compoziție, și despre modelul Pub/Sub, ca pregătire pentru construirea unui joc              |                      [Introducere în dezvoltarea avansată de jocuri](./6-space-game/1-introduction/README.md)                       |          Chris          |
+| 16  |           [Space Game](./6-space-game/solution/README.md)           |                           Desenarea pe canvas                            | Învață despre API-ul Canvas, folosit pentru a desena elemente pe ecran                                                                       |                                [Desenarea pe canvas](./6-space-game/2-drawing-to-canvas/README.md)                                |          Chris          |
+| 17  |           [Space Game](./6-space-game/solution/README.md)           |                   Mișcarea elementelor pe ecran                    | Descoperă cum elementele pot dobândi mișcare folosind coordonatele carteziene și API-ul Canvas                                            |                           [Mișcarea elementelor](./6-space-game/3-moving-elements-around/README.md)                           |          Chris          |
+| 18  |           [Space Game](./6-space-game/solution/README.md)           |                          Detectarea coliziunilor                           | Fă ca elementele să se ciocnească și să reacționeze unele la altele folosind apăsări de taste și oferă o funcție de cooldown pentru a asigura performanța jocului    |                              [Detectarea coliziunilor](./6-space-game/4-collision-detection/README.md)                              |          Chris          |
+| 19  |           [Space Game](./6-space-game/solution/README.md)           |                             Păstrarea scorului                              | Efectuează calcule matematice bazate pe starea și performanța jocului                                                                |                                    [Păstrarea scorului](./6-space-game/5-keeping-score/README.md)                                    |          Chris          |
+| 20  |           [Space Game](./6-space-game/solution/README.md)           |                     Terminarea și reluarea jocului                     | Învață despre terminarea și reluarea jocului, inclusiv curățarea resurselor și resetarea valorilor variabilelor                              |                                [Condiția de terminare](./6-space-game/6-end-condition/README.md)                                 |          Chris          |
+| 21  |         [Banking App](./7-bank-project/solution/README.md)          |                 Șabloane HTML și rute într-o aplicație web                 | Învață cum să creezi structura arhitecturii unui site web cu mai multe pagini folosind rutare și șabloane HTML                             |                            [Șabloane HTML și rute](./7-bank-project/1-template-route/README.md)                             |          Yohan          |
+| 22  |         [Banking App](./7-bank-project/solution/README.md)          |                  Construirea unui formular de autentificare și înregistrare                   | Învață despre construirea formularelor și gestionarea rutinei de validare                                                                          |                                           [Formulare](./7-bank-project/2-forms/README.md)                                           |          Yohan          |
+| 23  |         [Banking App](./7-bank-project/solution/README.md)          |                   Metode de preluare și utilizare a datelor                   | Cum circulă datele în și din aplicația ta, cum să le preiei, să le stochezi și să le elimini                                                 |                                            [Date](./7-bank-project/3-data/README.md)                                            |          Yohan          |
+| 24  |         [Banking App](./7-bank-project/solution/README.md)          |                      Concepte de gestionare a stării                      | Învață cum aplicația ta păstrează starea și cum să o gestionezi programatic                                                              |                                [Gestionarea stării](./7-bank-project/4-state-management/README.md)                                |          Yohan          |
+
+
+## 🏫 Pedagogie
+
+Curriculum-ul nostru este conceput având în vedere două principii pedagogice cheie:
+* învățare bazată pe proiecte
+* teste frecvente
+
+Programul predă fundamentele JavaScript, HTML și CSS, precum și cele mai recente instrumente și tehnici utilizate de dezvoltatorii web de astăzi. Studenții vor avea oportunitatea de a dobândi experiență practică construind un joc de tastare, un terariu virtual, o extensie de browser eco-friendly, un joc în stil space-invader și o aplicație bancară pentru afaceri. Până la sfârșitul seriei, studenții vor avea o înțelegere solidă a dezvoltării web.
+
+
+> 🎓 Poți parcurge primele câteva lecții din acest curriculum ca un [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) pe Microsoft Learn!
+
+Prin asigurarea că conținutul se aliniază cu proiectele, procesul devine mai captivant pentru studenți, iar retenția conceptelor va fi îmbunătățită. De asemenea, am scris câteva lecții introductive în JavaScript pentru a introduce concepte, însoțite de un videoclip din colecția "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" de tutoriale video, unii dintre autorii cărora au contribuit la acest curriculum.
+
+În plus, un test cu miză redusă înainte de o clasă setează intenția studentului spre învățarea unui subiect, în timp ce un al doilea test după clasă asigură o retenție suplimentară. Acest curriculum a fost conceput să fie flexibil și distractiv și poate fi parcurs în întregime sau parțial. Proiectele încep mici și devin din ce în ce mai complexe până la sfârșitul ciclului de 12 săptămâni.
+
+Deși am evitat în mod intenționat introducerea framework-urilor JavaScript pentru a ne concentra pe abilitățile de bază necesare unui dezvoltator web înainte de adoptarea unui framework, un pas bun după finalizarea acestui curriculum ar fi învățarea despre Node.js printr-o altă colecție de videoclipuri: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
+
+> Vizitează [Codul nostru de conduită](CODE_OF_CONDUCT.md) și ghidurile de [Contribuire](CONTRIBUTING.md). Apreciem feedback-ul tău constructiv!
+
+
+## 🧭 Acces offline
+
+Poți rula această documentație offline folosind [Docsify](https://docsify.js.org/#/). Clonează acest repo, [instalează Docsify](https://docsify.js.org/#/quickstart) pe mașina ta locală, apoi în folderul rădăcină al acestui repo, tastează `docsify serve`. Website-ul va fi servit pe portul 3000 pe localhost-ul tău: `localhost:3000`.
+
+## 📘 PDF
+
+Un PDF cu toate lecțiile poate fi găsit [aici](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
+
+
+## 🎒 Alte cursuri
+
+Echipa noastră produce și alte cursuri! Verifică:
+
+- [Generative AI for Beginners](https://aka.ms/genai-beginners)
+- [Generative AI for Beginners .NET](https://github.com/microsoft/Generative-AI-for-beginners-dotnet)
+- [Generative AI with JavaScript](https://github.com/microsoft/generative-ai-with-javascript)
+- [Generative AI with Java](https://github.com/microsoft/Generative-AI-for-beginners-java)
+- [AI for Beginners](https://aka.ms/ai-beginners)
+- [Data Science for Beginners](https://aka.ms/datascience-beginners)
+- [ML for Beginners](https://aka.ms/ml-beginners)
+- [Cybersecurity for Beginners](https://github.com/microsoft/Security-101)
+- [Web Dev for Beginners](https://aka.ms/webdev-beginners)
+- [IoT for Beginners](https://aka.ms/iot-beginners)
+- [XR Development for Beginners](https://github.com/microsoft/xr-development-for-beginners)
+- [Mastering GitHub Copilot for Agentic use](https://github.com/microsoft/Mastering-GitHub-Copilot-for-Paired-Programming)
+- [Mastering GitHub Copilot for C#/.NET Developers](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers)
+- [Choose Your Own Copilot Adventure](https://github.com/microsoft/CopilotAdventures)
+
+## Licență
+
+Acest depozit este licențiat sub licența MIT. Vezi fișierul [LICENSE](../../LICENSE) pentru mai multe informații.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/SECURITY.md b/translations/ro/SECURITY.md
new file mode 100644
index 00000000..27c21fc4
--- /dev/null
+++ b/translations/ro/SECURITY.md
@@ -0,0 +1,51 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228",
+  "translation_date": "2025-08-28T07:29:16+00:00",
+  "source_file": "SECURITY.md",
+  "language_code": "ro"
+}
+-->
+## Securitate
+
+Microsoft tratează cu maximă seriozitate securitatea produselor și serviciilor noastre software, inclusiv toate depozitele de cod sursă gestionate prin organizațiile noastre GitHub, care includ [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin) și [organizațiile noastre GitHub](https://opensource.microsoft.com/?WT.mc_id=academic-77807-sagibbon).
+
+Dacă credeți că ați descoperit o vulnerabilitate de securitate într-un depozit deținut de Microsoft care se încadrează în [definiția Microsoft a unei vulnerabilități de securitate](https://docs.microsoft.com/previous-versions/tn-archive/cc751383(v=technet.10)/?WT.mc_id=academic-77807-sagibbon), vă rugăm să ne raportați problema conform instrucțiunilor de mai jos.
+
+## Raportarea problemelor de securitate
+
+**Vă rugăm să nu raportați vulnerabilitățile de securitate prin probleme publice pe GitHub.**
+
+În schimb, raportați-le către Microsoft Security Response Center (MSRC) la [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report/?WT.mc_id=academic-77807-sagibbon).
+
+Dacă preferați să trimiteți raportul fără a vă autentifica, trimiteți un e-mail la [secure@microsoft.com](mailto:secure@microsoft.com). Dacă este posibil, criptați mesajul folosind cheia noastră PGP; o puteți descărca de pe pagina [Microsoft Security Response Center PGP Key](https://www.microsoft.com/msrc/pgp-key-msrc/?WT.mc_id=academic-77807-sagibbon).
+
+Ar trebui să primiți un răspuns în termen de 24 de ore. Dacă, dintr-un motiv oarecare, nu primiți un răspuns, vă rugăm să reveniți prin e-mail pentru a vă asigura că am primit mesajul inițial. Informații suplimentare pot fi găsite la [microsoft.com/msrc](https://www.microsoft.com/msrc/?WT.mc_id=academic-77807-sagibbon).
+
+Vă rugăm să includeți informațiile solicitate mai jos (atât cât puteți furniza) pentru a ne ajuta să înțelegem mai bine natura și amploarea problemei posibile:
+
+  * Tipul problemei (de exemplu, depășire de buffer, injecție SQL, cross-site scripting etc.)
+  * Căile complete ale fișierelor sursă legate de manifestarea problemei
+  * Locația codului sursă afectat (tag/branch/commit sau URL direct)
+  * Orice configurație specială necesară pentru a reproduce problema
+  * Instrucțiuni pas cu pas pentru a reproduce problema
+  * Cod de tip proof-of-concept sau exploit (dacă este posibil)
+  * Impactul problemei, inclusiv modul în care un atacator ar putea exploata problema
+
+Aceste informații ne vor ajuta să prioritizăm raportul dumneavoastră mai rapid.
+
+Dacă raportați în cadrul unui program de recompense pentru bug-uri, rapoartele mai detaliate pot contribui la o recompensă mai mare. Vă rugăm să vizitați pagina [Microsoft Bug Bounty Program](https://microsoft.com/msrc/bounty/?WT.mc_id=academic-77807-sagibbon) pentru mai multe detalii despre programele noastre active.
+
+## Limbi preferate
+
+Preferăm ca toate comunicările să fie în limba engleză.
+
+## Politică
+
+Microsoft urmează principiul [Dezvăluirii Coordonate a Vulnerabilităților](https://www.microsoft.com/msrc/cvd/?WT.mc_id=academic-77807-sagibbon).
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/SUPPORT.md b/translations/ro/SUPPORT.md
new file mode 100644
index 00000000..6ec3df7f
--- /dev/null
+++ b/translations/ro/SUPPORT.md
@@ -0,0 +1,25 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "c9d207ff77b4bb46e46dc2b607a8ec1a",
+  "translation_date": "2025-08-28T07:28:32+00:00",
+  "source_file": "SUPPORT.md",
+  "language_code": "ro"
+}
+-->
+# Suport
+
+## Cum să raportezi probleme și să obții ajutor  
+
+Acest proiect utilizează GitHub Issues pentru a urmări erorile și cererile de funcționalități. Te rugăm să cauți problemele existente înainte de a raporta altele noi, pentru a evita duplicarea. Pentru probleme noi, raportează eroarea sau cererea de funcționalitate ca o nouă problemă.
+
+Pentru ajutor și întrebări legate de utilizarea acestui proiect, te rugăm să consulți [ghidul nostru de contribuții](CONTRIBUTING.md).
+
+## Politica de suport Microsoft  
+
+Suportul pentru acest proiect este limitat la resursele enumerate mai sus.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/_404.md b/translations/ro/_404.md
new file mode 100644
index 00000000..7b408b50
--- /dev/null
+++ b/translations/ro/_404.md
@@ -0,0 +1,21 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "ea9f0804bd62f46d9808e953ec7fc459",
+  "translation_date": "2025-08-28T07:28:47+00:00",
+  "source_file": "_404.md",
+  "language_code": "ro"
+}
+-->
+# Lucrăm la aceasta
+
+Lucrăm la această pagină. Vă rugăm să reveniți mai târziu.
+
+Deschideți o [problemă](https://github.com/microsoft/Web-Dev-For-Beginners/issues/new/choose) dacă aveți întrebări.
+
+**[Înapoi acasă](../../../../../../..)**
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/docs/_navbar.md b/translations/ro/docs/_navbar.md
new file mode 100644
index 00000000..cc4ee4cd
--- /dev/null
+++ b/translations/ro/docs/_navbar.md
@@ -0,0 +1,34 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "3bd2f51ecf4ac9b39277cba748943793",
+  "translation_date": "2025-08-28T08:10:20+00:00",
+  "source_file": "docs/_navbar.md",
+  "language_code": "ro"
+}
+-->
+- Traduceri
+  - [English (United States)](../../../docs/README)
+  - [বাংলা](../../../docs/README.bn)
+  - [中文(中国)](../../../docs/README.zh-cn)
+  - [中文(台湾)](../../../docs/README.zh-tw)
+  - [Español](../../../docs/README.es)
+  - [Français](../../../docs/README.fr)
+  - [Ελληνικά](../../../docs/README.el)
+  - [हिन्दी](../../../docs/README.hi)
+  - [Bahasa Melayu](../../../docs/README.ms)
+  - [മലയാളം](../../../docs/README.ml)
+  - [தமிழ்](../../../docs/README.ta)
+  - [తెలుగు](../../../docs/README.te)
+  - [Bahasa Indonesia](../../../docs/README.id)
+  - [Italiano](../../../docs/README.it)
+  - [日本語](../../../docs/README.ja)
+  - [Nederlands](../../../docs/README.nl)
+  - [नेपाली](../../../docs/README.np)
+  - [Português](../../../docs/README.pt)
+  - [Русский](../../../docs/README.ru)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus utilizând serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să aveți în vedere că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea umană realizată de profesioniști. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/docs/_sidebar.md b/translations/ro/docs/_sidebar.md
new file mode 100644
index 00000000..602cce46
--- /dev/null
+++ b/translations/ro/docs/_sidebar.md
@@ -0,0 +1,51 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "655c91b5979de46f1d70d97f0c5f1d14",
+  "translation_date": "2025-08-28T08:09:55+00:00",
+  "source_file": "docs/_sidebar.md",
+  "language_code": "ro"
+}
+-->
+- Introducere
+  - [1](../1-getting-started-lessons/1-intro-to-programming-languages/README.md)
+  - [2](../1-getting-started-lessons/2-github-basics/README.md)
+  - [3](../1-getting-started-lessons/3-accessibility/README.md)
+  
+- Bazele JS
+  - [4](../2-js-basics/1-data-types/README.md)
+  - [5](../2-js-basics/2-functions-methods/README.md)
+  - [6](../2-js-basics/3-making-decisions/README.md)
+  - [7](../2-js-basics/4-arrays-loops/README.md)
+
+- HTML, CSS, JS
+  - [8](../3-terrarium/1-intro-to-html/README.md)
+  - [9](../3-terrarium/2-intro-to-css/README.md)
+  - [10](../3-terrarium/3-intro-to-DOM-and-closures/README.md)
+
+- Joc de tastare
+  - [11](../4-typing-game/typing-game/README.md)
+  
+- Extensie pentru browser
+  - [12](../5-browser-extension/1-about-browsers/README.md)
+  - [13](../5-browser-extension/2-forms-browsers-local-storage/README.md)
+  - [14](../5-browser-extension/3-background-tasks-and-performance/README.md)
+
+- Joc Spațial
+  - [15](../6-space-game/1-introduction/README.md)
+  - [16](../6-space-game/2-drawing-to-canvas/README.md)
+  - [17](../6-space-game/3-moving-elements-around/README.md)
+  - [18](../6-space-game/4-collision-detection/README.md)
+  - [19](../6-space-game/5-keeping-score/README.md)
+  - [20](../6-space-game/6-end-condition/README.md)
+
+- Proiect Bancar
+  - [21](../7-bank-project/1-template-route/README.md)
+  - [22](../7-bank-project/2-forms/README.md)
+  - [23](../7-bank-project/3-data/README.md)
+  - [24](../7-bank-project/4-state-management/README.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea realizată de un profesionist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/for-teachers.md b/translations/ro/for-teachers.md
new file mode 100644
index 00000000..a07783ef
--- /dev/null
+++ b/translations/ro/for-teachers.md
@@ -0,0 +1,47 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "75cb51f7ca9ea0b097ef4a1287e9290c",
+  "translation_date": "2025-08-28T07:29:50+00:00",
+  "source_file": "for-teachers.md",
+  "language_code": "ro"
+}
+-->
+## Pentru educatori
+
+Doriți să folosiți acest curriculum în sala de clasă? Vă rugăm să o faceți!
+
+De fapt, îl puteți utiliza direct pe GitHub, folosind GitHub Classroom.
+
+Pentru a face acest lucru, creați un fork al acestui repo. Va trebui să creați un repo pentru fiecare lecție, așa că va trebui să extrageți fiecare folder într-un repo separat. Astfel, [GitHub Classroom](https://classroom.github.com/classrooms) poate prelua fiecare lecție separat.
+
+Aceste [instrucțiuni complete](https://github.blog/2020-03-18-set-up-your-digital-classroom-with-github-classroom/) vă vor oferi o idee despre cum să vă configurați sala de clasă.
+
+## Utilizarea în Moodle, Canvas sau Blackboard
+
+Acest curriculum funcționează bine în aceste sisteme de management al învățării! Utilizați [fișierul de upload pentru Moodle](../../../../../../../teaching-files/webdev-moodle.mbz) pentru conținutul complet sau încercați [fișierul Common Cartridge](../../../../../../../teaching-files/webdev-common-cartridge.imscc), care conține o parte din conținut. Moodle Cloud nu suportă exporturi complete Common Cartridge, așa că este preferabil să utilizați fișierul de descărcare pentru Moodle, care poate fi încărcat în Canvas. Vă rugăm să ne spuneți cum putem îmbunătăți această experiență.
+
+![Moodle](../../translated_images/moodle.94eb93d714a50cb2c97435b408017dee224348b61bc86203ffd43a4f4e57b95f.ro.png)
+> Curriculumul într-o sală de clasă Moodle
+
+![Canvas](../../translated_images/canvas.fbd605ff8e5b8aff567d398528ce113db304446b90b9cad55c654de3fdfcda34.ro.png)
+> Curriculumul în Canvas
+
+## Utilizarea repo-ului așa cum este
+
+Dacă doriți să utilizați acest repo în forma sa actuală, fără să folosiți GitHub Classroom, acest lucru este posibil. Va trebui să comunicați cu studenții despre lecția pe care să o parcurgeți împreună.
+
+În format online (Zoom, Teams sau altul), puteți forma grupuri de lucru pentru quiz-uri și să mentorizați studenții pentru a-i pregăti să învețe. Apoi, invitați studenții să participe la quiz-uri și să își trimită răspunsurile ca 'issues' la un anumit moment. Puteți face același lucru cu temele, dacă doriți ca studenții să lucreze colaborativ, în mod deschis.
+
+Dacă preferați un format mai privat, cereți studenților să facă fork curriculumului, lecție cu lecție, în propriile lor repo-uri GitHub private și să vă ofere acces. Astfel, ei pot completa quiz-uri și teme în mod privat și să vi le trimită prin issues pe repo-ul clasei.
+
+Există multe modalități de a face acest lucru să funcționeze într-un format de clasă online. Vă rugăm să ne spuneți ce funcționează cel mai bine pentru dumneavoastră!
+
+## Vă rugăm să ne împărtășiți gândurile!
+
+Dorim să facem acest curriculum să funcționeze pentru dumneavoastră și studenții dumneavoastră. Conectați-vă cu noi la [Colțul profesorilor](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) și deschideți un [**issue nou**](https://github.com/microsoft/Web-Dev-For-Beginners/issues/new/choose) pentru orice cereri, erori sau feedback.
+
+---
+
+**Declinare de responsabilitate**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși ne străduim să asigurăm acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/lesson-template/README.md b/translations/ro/lesson-template/README.md
new file mode 100644
index 00000000..ca2fd1b4
--- /dev/null
+++ b/translations/ro/lesson-template/README.md
@@ -0,0 +1,65 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "0494be70ad7fadd13a8c3d549c23e355",
+  "translation_date": "2025-08-28T08:10:38+00:00",
+  "source_file": "lesson-template/README.md",
+  "language_code": "ro"
+}
+-->
+# [Subiectul Lecției]
+
+![Încorporează un videoclip aici](../../../lesson-template/video-url)
+
+## [Chestionar înainte de lecție](../../../lesson-template/quiz-url)
+
+[Descrie ce vom învăța]
+
+### Introducere
+
+Descrie ce va fi acoperit
+
+> Note
+
+### Cerințe preliminare
+
+Ce pași ar fi trebuit să fie parcurși înainte de această lecție?
+
+### Pregătire
+
+Pași pregătitori pentru a începe această lecție
+
+---
+
+[Parcurge conținutul în blocuri]
+
+## [Subiectul 1]
+
+### Sarcină:
+
+Lucrați împreună pentru a îmbunătăți progresiv baza de cod și pentru a construi proiectul cu cod partajat:
+
+```html
+code blocks
+```
+
+✅ Verificare cunoștințe - folosiți acest moment pentru a extinde cunoștințele studenților cu întrebări deschise
+
+## [Subiectul 2]
+
+## [Subiectul 3]
+
+🚀 Provocare: Adăugați o provocare pentru ca studenții să lucreze colaborativ în clasă pentru a îmbunătăți proiectul
+
+Opțional: adăugați o captură de ecran a interfeței lecției finalizate, dacă este cazul
+
+## [Chestionar după lecție](../../../lesson-template/quiz-url)
+
+## Recapitulare și Studiu Individual
+
+**Temă datorată [MM/YY]**: [Numele Temei](assignment.md)
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să aveți în vedere că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/lesson-template/assignment.md b/translations/ro/lesson-template/assignment.md
new file mode 100644
index 00000000..b4757f6a
--- /dev/null
+++ b/translations/ro/lesson-template/assignment.md
@@ -0,0 +1,23 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "b5f62ec256c7e43e771f0d3b4e1a9130",
+  "translation_date": "2025-08-28T08:10:57+00:00",
+  "source_file": "lesson-template/assignment.md",
+  "language_code": "ro"
+}
+-->
+# [Numele Temei]
+
+## Instrucțiuni
+
+## Grilă de evaluare
+
+| Criterii | Exemplu | Adecvat | Necesită Îmbunătățiri |
+| -------- | ------- | ------- | --------------------- |
+|          |         |         |                       |
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/ro/quiz-app/README.md b/translations/ro/quiz-app/README.md
new file mode 100644
index 00000000..114452a9
--- /dev/null
+++ b/translations/ro/quiz-app/README.md
@@ -0,0 +1,191 @@
+<!--
+CO_OP_TRANSLATOR_METADATA:
+{
+  "original_hash": "5301875c55bb305e6046bed3a4fd06d2",
+  "translation_date": "2025-08-28T08:17:33+00:00",
+  "source_file": "quiz-app/README.md",
+  "language_code": "ro"
+}
+-->
+# Aplicație de Quiz
+
+Aceste quiz-uri sunt quiz-uri pre- și post-lectură pentru curriculumul de știința datelor de la https://aka.ms/webdev-beginners
+
+## Adăugarea unui set de quiz-uri tradus
+
+Adaugă o traducere a quiz-urilor prin crearea unor structuri de quiz corespunzătoare în folderele `assets/translations`. Quiz-urile canonice se află în `assets/translations/en`. Quiz-urile sunt împărțite în mai multe grupuri. Asigură-te că numerotarea se aliniază cu secțiunea corectă de quiz. În total, sunt 40 de quiz-uri în acest curriculum, cu numerotarea începând de la 0.
+
+  
+<details>
+<summary>Iată structura unui fișier de traducere:</summary>
+
+```
+[
+    {
+        "title": "A title",
+        "complete": "A complete button title",
+        "error": "An error message upon selecting the wrong answer",
+        "quizzes": [
+            {
+                "id": 1,
+                "title": "Title",
+                "quiz": [
+                    {
+                        "questionText": "The question asked",
+                        "answerOptions": [
+                            {
+                                "answerText": "Option 1 title",
+                                "isCorrect": true
+                            },
+                            {
+                                "answerText": "Option 2 title",
+                                "isCorrect": false
+                            }
+                        ]
+                    }
+                ]
+            }
+        ]
+    }
+]
+```
+</details>
+
+După ce editezi traducerile, editează fișierul index.js din folderul de traduceri pentru a importa toate fișierele conform convențiilor din `en`.
+
+Editează fișierul `index.js` din `assets/translations` pentru a importa noile fișiere traduse.
+
+De exemplu, dacă traducerea ta JSON este în `ex.json`, folosește 'ex' ca cheie de localizare, apoi introdu-o astfel pentru a o importa:
+
+<details>
+<summary>index.js</summary>
+
+```
+import ex from "./ex.json";
+
+// if 'ex' is localization key then enter it like so in `messages` to expose it 
+
+const messages = {
+  ex: ex[0],
+};
+
+export default messages;
+```
+
+</details>
+
+## Rulează aplicația de Quiz local
+
+### Cerințe preliminare
+
+- Un cont GitHub
+- [Node.js și Git](https://nodejs.org/)
+
+### Instalare și configurare
+
+1. Creează un repository din acest [template](https://github.com/new?template_name=Web-Dev-For-Beginners&template_owner=microsoft) 
+
+1. Clonează noul tău repository și navighează la quiz-app
+
+   ```bash
+   git clone https://github.com/your-github-organization/repo-name
+   cd repo-name/quiz-app
+   ```
+
+1. Instalează pachetele npm și dependențele
+
+   ```bash
+   npm install
+   ```
+
+### Construiește aplicația
+
+1. Pentru a construi soluția, rulează:
+
+   ```bash
+   npm run build
+   ```
+
+### Pornește aplicația
+
+1. Pentru a rula soluția, rulează:
+
+    ```bash
+    npm run dev
+    ```
+
+### [Opțional] Linting
+
+1. Pentru a te asigura că codul este verificat, rulează:
+
+    ```bash
+    npm run lint
+    ```
+
+## Publică aplicația de Quiz pe Azure 
+
+### Cerințe preliminare
+- Un abonament Azure. Înscrie-te gratuit [aici](https://aka.ms/azure-free).
+
+    _Estimare de cost pentru publicarea acestei aplicații de quiz: GRATUIT_
+
+[![Deploy to Azure](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/#create/Microsoft.StaticApp)
+
+După ce te autentifici pe Azure prin linkul de mai sus, selectează un abonament și un grup de resurse, apoi:
+
+- Detalii despre aplicația web statică: Oferă un nume și selectează un plan de găzduire
+- Autentificare GitHub: Setează sursa de publicare ca GitHub, apoi autentifică-te și completează câmpurile necesare din formular:
+    - *Organizație* – Alege organizația ta.
+    - *Repository* – Selectează repository-ul curriculumului Web Dev for Beginners. 
+    - *Branch* - Selectează un branch (main) 
+- Presetări de construcție: Azure Static Web Apps folosește un algoritm de detectare pentru a identifica framework-ul utilizat în aplicația ta. 
+    - *Locația aplicației* - ./quiz-app
+    - *Locația API-ului* -
+    - *Locația output-ului* - dist
+- Publicare: Click pe 'Review + Create', apoi 'Create'
+
+    După publicare, un fișier workflow va fi creat în directorul *.github* al repository-ului tău. Acest fișier workflow conține instrucțiuni despre evenimentele care vor declanșa o re-publicare a aplicației pe Azure, de exemplu, _un **push** pe branch-ul **main**_ etc.
+
+    <details>
+    <summary>Exemplu de fișier Workflow</summary>
+    Iată un exemplu de cum ar putea arăta fișierul workflow pentru GitHub Actions:
+    name: Azure Static Web Apps CI/CD
+
+    ```
+    on:
+    push:
+        branches:
+        - main
+    pull_request:
+        types: [opened, synchronize, reopened, closed]
+        branches:
+        - main
+
+    jobs:
+    build_and_deploy_job:
+        runs-on: ubuntu-latest
+        name: Build and Deploy Job
+        steps:
+        - uses: actions/checkout@v2
+        - name: Build And Deploy
+            id: builddeploy
+            uses: Azure/static-web-apps-deploy@v1
+            with:
+            azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
+            repo_token: ${{ secrets.GITHUB_TOKEN }}
+            action: "upload"
+            app_location: "quiz-app" # App source code path
+            api_location: ""API source code path optional
+            output_location: "dist" #Built app content directory - optional
+    ```
+
+    </details>
+
+- Post-publicare: După ce publicarea este completă, click pe 'Go to Deployment', apoi 'View app in browser'.
+
+După ce acțiunea GitHub (workflow-ul) este executată cu succes, reîmprospătează pagina live pentru a vedea aplicația ta.
+
+---
+
+**Declinarea responsabilității**:  
+Acest document a fost tradus folosind serviciul de traducere AI [Co-op Translator](https://github.com/Azure/co-op-translator). Deși depunem eforturi pentru a asigura acuratețea, vă rugăm să rețineți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa nativă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm răspunderea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.
\ No newline at end of file
diff --git a/translations/sk/README.md b/translations/sk/README.md
index 27cdd35e..2f2cb495 100644
--- a/translations/sk/README.md
+++ b/translations/sk/README.md
@@ -1,8 +1,8 @@
 <!--
 CO_OP_TRANSLATOR_METADATA:
 {
-  "original_hash": "b672130244189715ac084c3259f6ab58",
-  "translation_date": "2025-08-27T21:54:00+00:00",
+  "original_hash": "efa251c5fc089367f0a81c572874afca",
+  "translation_date": "2025-08-28T07:24:03+00:00",
   "source_file": "README.md",
   "language_code": "sk"
 }
@@ -21,9 +21,16 @@ CO_OP_TRANSLATOR_METADATA:
 
 [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)  
 
+[![Microsoft Azure AI Foundry Discord](https://dcbadge.limes.pink/api/server/ByRwuEEgH4)](https://discord.com/invite/ByRwuEEgH4)  
+
+Postupujte podľa týchto krokov, aby ste mohli začať používať tieto zdroje:  
+1. **Forknite repozitár**: Kliknite [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)  
+2. **Klonujte repozitár**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`  
+3. [**Pripojte sa na Azure AI Foundry Discord a stretnite sa s odborníkmi a ďalšími vývojármi**](https://discord.com/invite/ByRwuEEgH4)  
+
 # Web Development for Beginners - Kurz
 
-Naučte sa základy vývoja webu s naším 12-týždňovým komplexným kurzom od Microsoft Cloud Advocates. Každá z 24 lekcií sa zameriava na JavaScript, CSS a HTML prostredníctvom praktických projektov, ako sú teráriá, rozšírenia prehliadača a vesmírne hry. Zapojte sa do kvízov, diskusií a praktických úloh. Zlepšite svoje zručnosti a optimalizujte si zapamätanie vedomostí s našou efektívnou projektovo orientovanou pedagogikou. Začnite svoju cestu kódovania už dnes!
+Naučte sa základy vývoja webu s naším 12-týždňovým komplexným kurzom od Microsoft Cloud Advocates. Každá z 24 lekcií sa zaoberá JavaScriptom, CSS a HTML prostredníctvom praktických projektov, ako sú teráriá, rozšírenia prehliadača a vesmírne hry. Zapojte sa do kvízov, diskusií a praktických úloh. Zlepšite svoje zručnosti a optimalizujte si zapamätanie vedomostí s našou efektívnou projektovo orientovanou pedagogikou. Začnite svoju cestu kódovania už dnes!
 
 #### 🧑‍🎓 _Ste študent?_
 
@@ -35,32 +42,26 @@ Nezmeškajte náš nový kurz o Generatívnej AI!
 
 Navštívte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začnite!
 
-<div>
-  <img src="./images/background.png" width="600px" />
-</div>
+![Pozadie](../../translated_images/background.148a8d43afde57303419a663f50daf586681bc2fabf833f66ef6954073983c66.sk.png)
 
 - Lekcie pokrývajúce všetko od základov po RAG.
 - Interakcia s historickými postavami pomocou GenAI a našej sprievodnej aplikácie.
 - Zábavný a pútavý príbeh, budete cestovať v čase!
 
-<div>
-  <img src="./images/character.png" width="600px" />
-</div>
+![Postava](../../translated_images/character.5c0dd8e067ffd693c16e2c5b7412ab075a2215ce31f998305639fa3a05e14fbe.sk.png)
 
-Každá lekcia obsahuje úlohu na dokončenie, kontrolu vedomostí a výzvu, ktorá vás prevedie témami, ako sú:
-- Tvorba a optimalizácia promptov
-- Generovanie textových a obrazových aplikácií
-- Vyhľadávacie aplikácie
+Každá lekcia obsahuje úlohu na dokončenie, kontrolu vedomostí a výzvu, ktorá vás prevedie témami, ako sú:  
+- Tvorba a optimalizácia promptov  
+- Generovanie textových a obrazových aplikácií  
+- Vyhľadávacie aplikácie  
 
 Navštívte [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) a začnite!
 
-
-
 ## 🌱 Začíname
 
 > **Učitelia**, [pridali sme niekoľko návrhov](for-teachers.md), ako tento kurz využiť. Radi by sme počuli vašu spätnú väzbu [v našom diskusnom fóre](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
 
-**[Študenti](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, pri každej lekcii začnite kvízom pred prednáškou, pokračujte čítaním materiálu, dokončite rôzne aktivity a overte si svoje vedomosti kvízom po prednáške.
+**[Študenti](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, pre každú lekciu začnite kvízom pred prednáškou, pokračujte čítaním materiálov, dokončite rôzne aktivity a overte si svoje vedomosti kvízom po prednáške.
 
 Aby ste si zlepšili zážitok z učenia, spojte sa so svojimi rovesníkmi a pracujte na projektoch spoločne! Diskusie sú vítané v našom [diskusnom fóre](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), kde bude náš tím moderátorov k dispozícii na zodpovedanie vašich otázok.
 
@@ -70,28 +71,28 @@ Na ďalšie vzdelávanie dôrazne odporúčame preskúmať [Microsoft Learn](htt
 
 Tento kurz má pripravené vývojové prostredie! Keď začínate, môžete si vybrať, či budete kurz spúšťať v [Codespace](https://github.com/features/codespaces/) (_prostredie založené na prehliadači, bez potreby inštalácie_), alebo lokálne na svojom počítači pomocou textového editora, ako je [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
 
-#### Vytvorte si svoje úložisko
-Aby ste si mohli jednoducho uložiť svoju prácu, odporúčame vám vytvoriť si vlastnú kópiu tohto úložiska. Môžete to urobiť kliknutím na tlačidlo **Use this template** v hornej časti stránky. Tým sa vo vašom účte GitHub vytvorí nové úložisko s kópiou kurzu.
+#### Vytvorte si svoj repozitár
+Aby ste si mohli jednoducho uložiť svoju prácu, odporúčame vytvoriť si vlastnú kópiu tohto repozitára. Môžete to urobiť kliknutím na tlačidlo **Use this template** v hornej časti stránky. Tým sa vo vašom GitHub účte vytvorí nový repozitár s kópiou kurzu.
 
-Postupujte podľa týchto krokov:
-1. **Forknite úložisko**: Kliknite na tlačidlo "Fork" v pravom hornom rohu tejto stránky.
-2. **Klonujte úložisko**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
+Postupujte podľa týchto krokov:  
+1. **Forknite repozitár**: Kliknite na tlačidlo "Fork" v pravom hornom rohu tejto stránky.  
+2. **Klonujte repozitár**:   `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`  
 
 #### Spustenie kurzu v Codespace
 
-Vo svojej kópii tohto úložiska, ktorú ste vytvorili, kliknite na tlačidlo **Code** a vyberte **Open with Codespaces**. Tým sa vytvorí nový Codespace, v ktorom môžete pracovať.
+Vo vašej kópii tohto repozitára, ktorú ste vytvorili, kliknite na tlačidlo **Code** a vyberte **Open with Codespaces**. Tým sa vytvorí nový Codespace, v ktorom môžete pracovať.
 
-<img src="./images/createcodespace.png" alt="Create codespace" style="width:270px;"/>
+[!Codespace](../..)./images/createcodespace.png)
 
 #### Spustenie kurzu lokálne na vašom počítači
 
-Ak chcete tento kurz spustiť lokálne na svojom počítači, budete potrebovať textový editor, prehliadač a nástroj príkazového riadku. Naša prvá lekcia, [Úvod do programovacích jazykov a nástrojov](https://github.com/microsoft/Web-Dev-For-Beginners/tree/main/1-getting-started-lessons/1-intro-to-programming-languages), vás prevedie rôznymi možnosťami pre každý z týchto nástrojov, aby ste si mohli vybrať, čo vám najviac vyhovuje.
+Ak chcete tento kurz spustiť lokálne na svojom počítači, budete potrebovať textový editor, prehliadač a nástroj príkazového riadku. Naša prvá lekcia, [Úvod do programovacích jazykov a nástrojov](../../1-getting-started-lessons/1-intro-to-programming-languages), vás prevedie rôznymi možnosťami pre každý z týchto nástrojov, aby ste si mohli vybrať, čo vám najviac vyhovuje.
 
-Naše odporúčanie je použiť [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ako editor, ktorý má tiež zabudovaný [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code si môžete stiahnuť [tu](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
+Odporúčame použiť [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ako editor, ktorý má tiež zabudovaný [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Visual Studio Code si môžete stiahnuť [tu](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
 
-1. Klonujte svoje úložisko do počítača. Môžete to urobiť kliknutím na tlačidlo **Code** a skopírovaním URL:
+1. Klonujte svoj repozitár na svoj počítač. Môžete to urobiť kliknutím na tlačidlo **Code** a skopírovaním URL:
 
-    <img src="./images/createcodespace.png" alt="Copy your repository URL" style="width:270px;"/>
+    [!CodeSpace](./images/createcodespace.png)
 
     Potom otvorte [Terminál](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) vo [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) a spustite nasledujúci príkaz, pričom `<your-repository-url>` nahradíte URL, ktorú ste práve skopírovali:
 
@@ -103,77 +104,76 @@ Naše odporúčanie je použiť [Visual Studio Code](https://code.visualstudio.c
 
 >  Odporúčané rozšírenia pre Visual Studio Code:
 >
-> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - na náhľad HTML stránok vo Visual Studio Code
-> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - na rýchlejšie písanie kódu
+> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - na náhľad HTML stránok vo Visual Studio Code  
+> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - na rýchlejšie písanie kódu  
 
 ## 📂 Každá lekcia obsahuje:
 
-- voliteľnú sketchnote
-- voliteľné doplnkové video
-- kvíz na zahriatie pred lekciou
-- písanú lekciu
-- pre projektovo orientované lekcie, podrobné návody na vytvorenie projektu
-- kontrolu vedomostí
-- výzvu
-- doplnkové čítanie
-- úlohu
-- kvíz po lekcii
+- voliteľnú sketchnote  
+- voliteľné doplnkové video  
+- kvíz na rozohriatie pred lekciou  
+- písanú lekciu  
+- pre projektovo orientované lekcie, podrobné návody na vytvorenie projektu  
+- kontrolu vedomostí  
+- výzvu  
+- doplnkové čítanie  
+- úlohu  
+- [kvíz po lekcii](https://ff-quizzes.netlify.app/)  
 
-> **Poznámka o kvízoch**: Všetky kvízy sú obsiahnuté v priečinku Quiz-app, celkovo 48 kvízov, každý s tromi otázkami. Sú prepojené v rámci lekcií a aplikácia kvízov môže byť spustená lokálne alebo nasadená na Azure; postupujte podľa pokynov v priečinku `quiz-app`. Postupne sa lokalizujú.
+> **Poznámka o kvízoch**: Všetky kvízy sú obsiahnuté v priečinku Quiz-app, celkovo 48 kvízov, každý s tromi otázkami. Sú dostupné [tu](https://ff-quizzes.netlify.app/). Aplikáciu kvízov je možné spustiť lokálne alebo nasadiť na Azure; postupujte podľa pokynov v priečinku `quiz-app`.
 
 ## 🗃️ Lekcie
 
 |     |                       Názov projektu                       |                            Učené koncepty                             | Ciele učenia                                                                                                                 |                                                         Prepojená lekcia                                                          |         Autor          |
 | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
-| 01  |                     Začíname                      |           Úvod do programovania a nástrojov           | Naučte sa základné princípy väčšiny programovacích jazykov a o softvéri, ktorý pomáha profesionálnym vývojárom pri práci | [Úvod do programovacích jazykov a nástrojov](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) |         Jasmine         |
-| 02  |                     Začíname                      |             Základy GitHubu, vrátane práce v tíme             | Ako používať GitHub vo svojom projekte, ako spolupracovať s ostatnými na kódovej báze                                                    |                            [Úvod do GitHubu](/1-getting-started-lessons/2-github-basics/README.md)                             |          Floor          |
-| 03  |                     Začíname                      |                             Prístupnosť                              | Naučte sa základy prístupnosti webu                                                                                               |                       [Základy prístupnosti](/1-getting-started-lessons/3-accessibility/README.md)                       |       Christopher       |
-| 04  |                        Základy JS                         |                         Dátové typy v JavaScripte                          | Základy dátových typov v JavaScripte                                                                                                 |                                       [Dátové typy](/2-js-basics/1-data-types/README.md)                                        |         Jasmine         |
-| 05  |                        Základy JS                         |                         Funkcie a metódy                          | Naučte sa o funkciách a metódach na riadenie logického toku aplikácie                                                             |                              [Funkcie a metódy](/2-js-basics/2-functions-methods/README.md)                               | Jasmine a Christopher |
-| 06  |                        Základy JS                         |                        Rozhodovanie v JS                        | Naučte sa vytvárať podmienky vo svojom kóde pomocou metód rozhodovania                                                           |                                 [Rozhodovanie](/2-js-basics/3-making-decisions/README.md)                                  |         Jasmine         |
-| 07  |                        Základy JS                         |                            Polia a cykly                            | Práca s dátami pomocou polí a cyklov v JavaScripte                                                                                 |                                   [Polia a cykly](/2-js-basics/4-arrays-loops/README.md)                                    |         Jasmine         |
-| 08  |       [Terárium](/3-terrarium/solution/README.md)       |                            HTML v praxi                            | Vytvorte HTML na vytvorenie online terária, zamerané na vytváranie rozloženia                                                         |                                 [Úvod do HTML](/3-terrarium/1-intro-to-html/README.md)                                 |           Jen           |
-| 09  |       [Terárium](/3-terrarium/solution/README.md)       |                            CSS v praxi                             | Vytvorte CSS na štýlovanie online terária, zamerané na základy CSS vrátane vytvárania responzívnych stránok                     |                                  [Úvod do CSS](/3-terrarium/2-intro-to-css/README.md)                                  |           Jen           |
-| 10  |            [Terárium](/3-terrarium/solution/README.md)            |                 Uzávery v JavaScripte, manipulácia s DOM                  | Vytvorte JavaScript na to, aby terárium fungovalo ako rozhranie drag/drop, zamerané na uzávery a manipuláciu s DOM             |                  [Uzávery v JavaScripte, manipulácia s DOM](/3-terrarium/3-intro-to-DOM-and-closures/README.md)                   |           Jen           |
-| 11  |          [Hra na písanie](/4-typing-game/solution/README.md)          |                          Vytvorte hru na písanie                           | Naučte sa používať udalosti klávesnice na riadenie logiky vašej JavaScript aplikácie                                                          |                                [Programovanie riadené udalosťami](/4-typing-game/typing-game/README.md)                                |       Christopher       |
-| 12  | [Green Browser Extension](/5-browser-extension/solution/README.md) |                         Práca s prehliadačmi                          | Naučte sa, ako fungujú prehliadače, ich históriu a ako vytvoriť prvé prvky rozšírenia prehliadača                               |                               [O prehliadačoch](/5-browser-extension/1-about-browsers/README.md)                                |           Jen           |
-| 13  | [Green Browser Extension](/5-browser-extension/solution/README.md) | Vytvorenie formulára, volanie API a ukladanie premenných do lokálneho úložiska | Vytvorte JavaScriptové prvky rozšírenia prehliadača na volanie API pomocou premenných uložených v lokálnom úložisku                      |                [API, formuláre a lokálne úložisko](/5-browser-extension/2-forms-browsers-local-storage/README.md)                 |           Jen           |
-| 14  | [Green Browser Extension](/5-browser-extension/solution/README.md) |          Procesy na pozadí v prehliadači, výkon webu          | Použite procesy na pozadí prehliadača na správu ikony rozšírenia; naučte sa o výkone webu a niektorých optimalizáciách na zlepšenie   |             [Úlohy na pozadí a výkon](/5-browser-extension/3-background-tasks-and-performance/README.md)              |           Jen           |
-| 15  |           [Space Game](/6-space-game/solution/README.md)           |             Pokročilejší vývoj hier s JavaScriptom             | Naučte sa o dedičnosti pomocou tried a kompozície a o vzore Pub/Sub, ako prípravu na vytvorenie hry              |                      [Úvod do pokročilého vývoja hier](/6-space-game/1-introduction/README.md)                       |          Chris          |
-| 16  |           [Space Game](/6-space-game/solution/README.md)           |                           Kreslenie na plátno                            | Naučte sa o API Canvas, ktoré sa používa na kreslenie prvkov na obrazovku                                                                       |                                [Kreslenie na plátno](/6-space-game/2-drawing-to-canvas/README.md)                                |          Chris          |
-| 17  |           [Space Game](/6-space-game/solution/README.md)           |                   Pohyb prvkov po obrazovke                    | Zistite, ako môžu prvky získať pohyb pomocou karteziánskych súradníc a API Canvas                                            |                           [Pohyb prvkov](/6-space-game/3-moving-elements-around/README.md)                           |          Chris          |
-| 18  |           [Space Game](/6-space-game/solution/README.md)           |                          Detekcia kolízií                           | Umožnite prvkom kolidovať a reagovať na seba pomocou stlačení klávesov a poskytnite funkciu cooldown na zabezpečenie výkonu hry    |                              [Detekcia kolízií](/6-space-game/4-collision-detection/README.md)                              |          Chris          |
-| 19  |           [Space Game](/6-space-game/solution/README.md)           |                             Počítanie skóre                              | Vykonávajte matematické výpočty na základe stavu a výkonu hry                                                                |                                    [Počítanie skóre](/6-space-game/5-keeping-score/README.md)                                    |          Chris          |
-| 20  |           [Space Game](/6-space-game/solution/README.md)           |                     Ukončenie a reštartovanie hry                     | Naučte sa o ukončení a reštartovaní hry, vrátane čistenia zdrojov a resetovania hodnôt premenných                              |                                [Podmienka ukončenia](/6-space-game/6-end-condition/README.md)                                 |          Chris          |
-| 21  |         [Banking App](/7-bank-project/solution/README.md)          |                 HTML šablóny a trasy vo webovej aplikácii                 | Naučte sa, ako vytvoriť štruktúru architektúry webovej stránky s viacerými stránkami pomocou trasovania a HTML šablón                             |                            [HTML šablóny a trasy](/7-bank-project/1-template-route/README.md)                             |          Yohan          |
-| 22  |         [Banking App](/7-bank-project/solution/README.md)          |                  Vytvorenie prihlasovacieho a registračného formulára                   | Naučte sa o vytváraní formulárov a spracovaní validačných rutín                                                                          |                                           [Formuláre](/7-bank-project/2-forms/README.md)                                           |          Yohan          |
-| 23  |         [Banking App](/7-bank-project/solution/README.md)          |                   Metódy získavania a používania údajov                   | Ako údaje prúdia do vašej aplikácie a z nej, ako ich získavať, ukladať a likvidovať                                                 |                                            [Údaje](/7-bank-project/3-data/README.md)                                            |          Yohan          |
-| 24  |         [Banking App](/7-bank-project/solution/README.md)          |                      Koncepty správy stavu                      | Naučte sa, ako vaša aplikácia uchováva stav a ako ho programovo spravovať                                                              |                                [Správa stavu](/7-bank-project/4-state-management/README.md)                                |          Yohan          |
+| 01  |                     Začíname                      |           Úvod do programovania a nástrojov           | Naučte sa základné princípy väčšiny programovacích jazykov a o softvéri, ktorý pomáha profesionálnym vývojárom pri ich práci | [Úvod do programovacích jazykov a nástrojov](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) |         Jasmine         |
+| 02  |                     Začíname                      |             Základy GitHubu, vrátane práce v tíme             | Ako používať GitHub vo svojom projekte, ako spolupracovať s ostatnými na kóde                                                    |                            [Úvod do GitHubu](./1-getting-started-lessons/2-github-basics/README.md)                             |          Floor          |
+| 03  |                     Začíname                      |                             Prístupnosť                              | Naučte sa základy prístupnosti webu                                                                                               |                       [Základy prístupnosti](./1-getting-started-lessons/3-accessibility/README.md)                       |       Christopher       |
+| 04  |                        Základy JS                         |                         Dátové typy v JavaScripte                          | Základy dátových typov v JavaScripte                                                                                                 |                                       [Dátové typy](./2-js-basics/1-data-types/README.md)                                        |         Jasmine         |
+| 05  |                        Základy JS                         |                         Funkcie a metódy                          | Naučte sa o funkciách a metódach na správu logického toku aplikácie                                                             |                              [Funkcie a metódy](./2-js-basics/2-functions-methods/README.md)                               | Jasmine a Christopher |
+| 06  |                        Základy JS                         |                        Rozhodovanie s JS                        | Naučte sa vytvárať podmienky vo svojom kóde pomocou metód rozhodovania                                                           |                                 [Rozhodovanie](./2-js-basics/3-making-decisions/README.md)                                  |         Jasmine         |
+| 07  |                        Základy JS                         |                            Polia a cykly                            | Práca s dátami pomocou polí a cyklov v JavaScripte                                                                                 |                                   [Polia a cykly](./2-js-basics/4-arrays-loops/README.md)                                    |         Jasmine         |
+| 08  |       [Terárium](./3-terrarium/solution/README.md)       |                            HTML v praxi                            | Vytvorte HTML na vytvorenie online terária, zamerané na vytváranie rozloženia                                                         |                                 [Úvod do HTML](./3-terrarium/1-intro-to-html/README.md)                                 |           Jen           |
+| 09  |       [Terárium](./3-terrarium/solution/README.md)       |                            CSS v praxi                             | Vytvorte CSS na štýlovanie online terária, zamerané na základy CSS vrátane vytvárania responzívnych stránok                     |                                  [Úvod do CSS](./3-terrarium/2-intro-to-css/README.md)                                  |           Jen           |
+| 10  |            [Terrárium](./3-terrarium/solution/README.md)            |                 JavaScript Closures, manipulácia s DOM                  | Vytvorte JavaScript, aby terrárium fungovalo ako rozhranie na presúvanie a púšťanie, so zameraním na closures a manipuláciu s DOM   |                  [JavaScript Closures, manipulácia s DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md)                   |           Jen           |
+| 11  |          [Hra na písanie](./4-typing-game/solution/README.md)       |                          Vytvorte hru na písanie                       | Naučte sa používať klávesové udalosti na riadenie logiky vašej JavaScript aplikácie                                                  |                                [Programovanie riadené udalosťami](./4-typing-game/typing-game/README.md)                         |       Christopher       |
+| 12  | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) |                         Práca s prehliadačmi                          | Naučte sa, ako fungujú prehliadače, ich históriu a ako vytvoriť prvé prvky rozšírenia prehliadača                                    |                               [O prehliadačoch](./5-browser-extension/1-about-browsers/README.md)                                |           Jen           |
+| 13  | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) | Vytváranie formulára, volanie API a ukladanie premenných do lokálneho úložiska | Vytvorte JavaScript prvky vášho rozšírenia prehliadača na volanie API pomocou premenných uložených v lokálnom úložisku              |                [API, formuláre a lokálne úložisko](./5-browser-extension/2-forms-browsers-local-storage/README.md)               |           Jen           |
+| 14  | [Zelené rozšírenie prehliadača](./5-browser-extension/solution/README.md) |          Procesy na pozadí v prehliadači, webový výkon                 | Použite procesy na pozadí prehliadača na správu ikony rozšírenia; naučte sa o výkone webu a niektorých optimalizáciách              |             [Úlohy na pozadí a výkon](./5-browser-extension/3-background-tasks-and-performance/README.md)                        |           Jen           |
+| 15  |           [Vesmírna hra](./6-space-game/solution/README.md)         |             Pokročilejší vývoj hier s JavaScriptom                     | Naučte sa o dedičnosti pomocou tried a kompozície a o vzore Pub/Sub, ako prípravu na vytvorenie hry                                  |                      [Úvod do pokročilého vývoja hier](./6-space-game/1-introduction/README.md)                                   |          Chris          |
+| 16  |           [Vesmírna hra](./6-space-game/solution/README.md)         |                           Kreslenie na plátno                          | Naučte sa o Canvas API, ktoré sa používa na kreslenie prvkov na obrazovku                                                           |                                [Kreslenie na plátno](./6-space-game/2-drawing-to-canvas/README.md)                                |          Chris          |
+| 17  |           [Vesmírna hra](./6-space-game/solution/README.md)         |                   Pohyb prvkov po obrazovke                            | Objavte, ako môžu prvky získať pohyb pomocou karteziánskych súradníc a Canvas API                                                  |                           [Pohyb prvkov](./6-space-game/3-moving-elements-around/README.md)                                       |          Chris          |
+| 18  |           [Vesmírna hra](./6-space-game/solution/README.md)         |                          Detekcia kolízií                              | Umožnite prvkom kolidovať a reagovať na seba pomocou stlačení klávesov a poskytnite funkciu cooldown na zabezpečenie výkonu hry     |                              [Detekcia kolízií](./6-space-game/4-collision-detection/README.md)                                  |          Chris          |
+| 19  |           [Vesmírna hra](./6-space-game/solution/README.md)         |                             Počítanie skóre                            | Vykonávajte matematické výpočty na základe stavu a výkonu hry                                                                       |                                    [Počítanie skóre](./6-space-game/5-keeping-score/README.md)                                    |          Chris          |
+| 20  |           [Vesmírna hra](./6-space-game/solution/README.md)         |                     Ukončenie a reštartovanie hry                      | Naučte sa, ako ukončiť a reštartovať hru, vrátane čistenia zdrojov a resetovania hodnôt premenných                                  |                                [Koncový stav](./6-space-game/6-end-condition/README.md)                                          |          Chris          |
+| 21  |         [Banková aplikácia](./7-bank-project/solution/README.md)    |                 HTML šablóny a trasy vo webovej aplikácii              | Naučte sa, ako vytvoriť štruktúru architektúry viacstránkovej webovej stránky pomocou routingu a HTML šablón                       |                            [HTML šablóny a trasy](./7-bank-project/1-template-route/README.md)                                   |          Yohan          |
+| 22  |         [Banková aplikácia](./7-bank-project/solution/README.md)    |                  Vytváranie prihlasovacieho a registračného formulára  | Naučte sa vytvárať formuláre a spracovávať validačné rutiny                                                                          |                                           [Formuláre](./7-bank-project/2-forms/README.md)                                         |          Yohan          |
+| 23  |         [Banková aplikácia](./7-bank-project/solution/README.md)    |                   Metódy získavania a používania údajov                | Ako údaje prúdia do vašej aplikácie a z nej, ako ich získavať, ukladať a spracovávať                                                |                                            [Údaje](./7-bank-project/3-data/README.md)                                            |          Yohan          |
+| 24  |         [Banková aplikácia](./7-bank-project/solution/README.md)    |                      Koncepty správy stavu                             | Naučte sa, ako vaša aplikácia uchováva stav a ako ho programovo spravovať                                                           |                                [Správa stavu](./7-bank-project/4-state-management/README.md)                                     |          Yohan          |
 
 
 ## 🏫 Pedagogika
 
-Náš učebný plán je navrhnutý s ohľadom na dva kľúčové pedagogické princípy:
+Náš učebný plán je navrhnutý s dvoma kľúčovými pedagogickými princípmi:
 * učenie založené na projektoch
 * časté kvízy
 
-Program učí základy JavaScriptu, HTML a CSS, ako aj najnovšie nástroje a techniky, ktoré používajú dnešní weboví vývojári. Študenti budú mať možnosť získať praktické skúsenosti vytvorením hry na písanie, virtuálneho terária, ekologického rozšírenia prehliadača, hry v štýle Space Invaders a bankovej aplikácie pre podniky. Na konci série študenti získajú pevné základy webového vývoja.
-
+Program učí základy JavaScriptu, HTML a CSS, ako aj najnovšie nástroje a techniky, ktoré používajú dnešní weboví vývojári. Študenti budú mať možnosť získať praktické skúsenosti vytvorením hry na písanie, virtuálneho terrária, ekologického rozšírenia prehliadača, hry v štýle vesmírnych útočníkov a bankovej aplikácie pre podniky. Na konci série získajú študenti solídne pochopenie vývoja webu.
 
-> 🎓 Prvé lekcie tohto učebného plánu si môžete vyskúšať ako [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
+> 🎓 Prvé lekcie tohto učebného plánu si môžete vyskúšať ako [učebnú cestu](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
 
-Zabezpečením, že obsah je v súlade s projektmi, sa proces stáva pre študentov pútavejším a zlepšuje sa uchovávanie konceptov. Napísali sme tiež niekoľko úvodných lekcií o základoch JavaScriptu na predstavenie konceptov, spojených s videom zo série "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" kolekcie video tutoriálov, ktorých autori prispeli k tomuto učebnému plánu.
+Zabezpečením, že obsah je zosúladený s projektmi, je proces pre študentov pútavejší a zlepšuje sa uchovávanie konceptov. Napísali sme tiež niekoľko úvodných lekcií o základoch JavaScriptu na predstavenie konceptov, spárovaných s videom zo série "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", na ktorej sa podieľali niektorí autori tohto učebného plánu.
 
-Okrem toho nízko stresový kvíz pred hodinou nastaví študentovu pozornosť na učenie sa témy, zatiaľ čo druhý kvíz po hodine zabezpečí ďalšie uchovanie. Tento učebný plán bol navrhnutý tak, aby bol flexibilný a zábavný a mohol byť absolvovaný celý alebo len jeho časť. Projekty začínajú malé a postupne sa stávajú zložitejšími na konci 12-týždňového cyklu.
+Okrem toho nízkostresový kvíz pred hodinou nastaví študentovi úmysel naučiť sa tému, zatiaľ čo druhý kvíz po hodine zabezpečí ďalšie uchovanie. Tento učebný plán bol navrhnutý tak, aby bol flexibilný a zábavný a mohol byť absolvovaný ako celok alebo po častiach. Projekty začínajú malé a postupne sa stávajú zložitejšími na konci 12-týždňového cyklu.
 
-Aj keď sme sa zámerne vyhli predstaveniu JavaScriptových frameworkov, aby sme sa sústredili na základné zručnosti potrebné ako webový vývojár pred prijatím frameworku, dobrým ďalším krokom po dokončení tohto učebného plánu by bolo naučiť sa o Node.js prostredníctvom ďalšej kolekcie videí: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
+Aj keď sme sa zámerne vyhli predstaveniu JavaScriptových rámcov, aby sme sa sústredili na základné zručnosti potrebné ako webový vývojár pred prijatím rámca, dobrým ďalším krokom po dokončení tohto učebného plánu by bolo naučiť sa o Node.js prostredníctvom inej kolekcie videí: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
 
-> Navštívte naše [Pravidlá správania](CODE_OF_CONDUCT.md) a [Prispievanie](CONTRIBUTING.md) pokyny. Uvítame vašu konštruktívnu spätnú väzbu!
+> Navštívte naše [Pravidlá správania](CODE_OF_CONDUCT.md) a [Prispievateľské pokyny](CONTRIBUTING.md). Uvítame vašu konštruktívnu spätnú väzbu!
 
 
 ## 🧭 Offline prístup
 
-Túto dokumentáciu môžete spustiť offline pomocou [Docsify](https://docsify.js.org/#/). Forknite tento repozitár, [nainštalujte Docsify](https://docsify.js.org/#/quickstart) na svojom lokálnom počítači a potom v koreňovom priečinku tohto repozitára zadajte `docsify serve`. Webová stránka bude spustená na porte 3000 na vašom localhoste: `localhost:3000`.
+Túto dokumentáciu môžete spustiť offline pomocou [Docsify](https://docsify.js.org/#/). Forknite toto repo, [nainštalujte Docsify](https://docsify.js.org/#/quickstart) na svoj lokálny počítač a potom v koreňovom priečinku tohto repozitára zadajte `docsify serve`. Webová stránka bude spustená na porte 3000 na vašom localhoste: `localhost:3000`.
 
 ## 📘 PDF
 
@@ -206,4 +206,4 @@ Tento repozitár je licencovaný pod licenciou MIT. Viac informácií nájdete v
 ---
 
 **Upozornenie**:  
-Tento dokument bol preložený pomocou služby AI prekladu [Co-op Translator](https://github.com/Azure/co-op-translator). Aj keď sa snažíme o presnosť, prosím, berte na vedomie, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Pôvodný dokument v jeho rodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre kritické informácie sa odporúča profesionálny ľudský preklad. Nie sme zodpovední za žiadne nedorozumenia alebo nesprávne interpretácie vyplývajúce z použitia tohto prekladu.
\ No newline at end of file
+Tento dokument bol preložený pomocou služby AI prekladu [Co-op Translator](https://github.com/Azure/co-op-translator). Hoci sa snažíme o presnosť, prosím, berte na vedomie, že automatizované preklady môžu obsahovať chyby alebo nepresnosti. Pôvodný dokument v jeho pôvodnom jazyku by mal byť považovaný za autoritatívny zdroj. Pre kritické informácie sa odporúča profesionálny ľudský preklad. Nenesieme zodpovednosť za akékoľvek nedorozumenia alebo nesprávne interpretácie vyplývajúce z použitia tohto prekladu.
\ No newline at end of file