Olga Kitel
4 years ago
committed by
GitHub
commit
d2c833fcc0
@ -0,0 +1,11 @@
|
|||||||
|
# Refatore o estilo de sua extensão
|
||||||
|
|
||||||
|
## Instruções
|
||||||
|
|
||||||
|
O código base para esta extensão vem completo com estilos, mas você não precisa usá-los; faça sua própria estilização editando seu arquivo css.
|
||||||
|
|
||||||
|
## Rubrica
|
||||||
|
|
||||||
|
| Critérios | Exemplar | Adequado | Necessita de melhoria |
|
||||||
|
| -------- | -------------------------------------------- | --------------------- | ----------------- |
|
||||||
|
| | O código é enviado com novos estilos funcionais | O estilo está incompleto | Os estilos contém erros |
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
# Refactorisez et commentez votre code
|
||||||
|
|
||||||
|
## Instructions
|
||||||
|
|
||||||
|
Au fur et à mesure que votre base de code se développe, il est important de refactorisez votre code fréquemment pour qu'il reste lisible et maintenable dans le temps. Ajoutez des commentaires et refactorisez votre `app.js` pour améliorer la qualité du code :
|
||||||
|
|
||||||
|
- Extrayez des constantes, telles que l'URL de base de l'API du serveur.
|
||||||
|
- Factorisez tout code similaire : par exemple, vous pouvez créer une fonction `sendRequest()` pour regrouper le code utilisé dans les fonctions `createAccount()` et `getAccount()`.
|
||||||
|
- Réorganisez le code pour le rendre plus facile à lire, et ajoutez des commentaires.
|
||||||
|
|
||||||
|
## Rubrique
|
||||||
|
|
||||||
|
| Critères | Exemplaire | Adéquat | Besoin d'amélioration |
|
||||||
|
| -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------- |
|
||||||
|
| | Le code est commenté, bien organisé en différentes sections et facile à lire. Les constantes sont extraites et une fonction `sendRequest()` a été créée. | Le code est propre mais peut encore être amélioré avec plus de commentaires, d'extraction de constantes ou de factorisation.| Le code est désordonné, non commenté, les constantes ne sont pas extraites et le code n'est pas factorisé.|
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
# Implémenter la boîte de dialogue "Ajouter une transaction"
|
||||||
|
|
||||||
|
## Instructions
|
||||||
|
|
||||||
|
Il manque encore à notre application bancaire une fonctionnalité importante: la possibilité de saisir de nouvelles transactions.
|
||||||
|
En utilisant tout ce que vous avez appris dans les quatre leçons précédentes, implémentez une boîte de dialogue « Ajouter une transaction » :
|
||||||
|
|
||||||
|
- Ajouter un bouton "Ajouter une transaction" dans la page du tableau de bord
|
||||||
|
- Créez une nouvelle page avec un modèle HTML ou utilisez JavaScript pour afficher/masquer le HTML de la boîte de dialogue sans quitter la page du tableau de bord (vous pouvez utiliser [`hidden`](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/hidden) pour celà, ou des classes CSS)
|
||||||
|
- Assurez-vous de gérer [l'accessibilité du clavier et du lecteur d'écran](https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/) pour la boîte de dialogue
|
||||||
|
- Implémenter un formulaire HTML pour recevoir les données d'entrée
|
||||||
|
- Créer des données JSON à partir des données du formulaire et les envoyer à l'API
|
||||||
|
- Mettre à jour la page du tableau de bord avec les nouvelles données
|
||||||
|
|
||||||
|
Consultez les [spécifications de l'API du serveur](./../../api/translations/README.fr.md) pour voir quelle API vous devez appeler et quel est le format JSON attendu.
|
||||||
|
|
||||||
|
Voici un exemple de résultat après avoir terminé le devoir :
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Rubrique
|
||||||
|
|
||||||
|
| Critères | Exemplaire | Adéquat | Besoin d'amélioration |
|
||||||
|
| -------- | ------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- | --------------------------------------------|
|
||||||
|
| | L'ajout d'une transaction est entièrement mis en œuvre en suivant toutes les meilleures pratiques vues dans les leçons. | L'ajout d'une transaction est implémenté, mais ne suit pas les meilleures pratiques vues dans les leçons, ou ne fonctionne que partiellement. | L'ajout d'une transaction ne fonctionne pas du tout. |
|
||||||
@ -0,0 +1,34 @@
|
|||||||
|
# API bancaire
|
||||||
|
|
||||||
|
> API bancaire construite avec [Node.js](https://nodejs.org) + [Express](https://expressjs.com/).
|
||||||
|
|
||||||
|
L'API est déjà conçue pour vous et ne fait pas partie de l'exercice.
|
||||||
|
|
||||||
|
Cependant, si vous souhaitez apprendre à créer une API comme celle-ci, vous pouvez suivre cette série de vidéos : https://aka.ms/NodeBeginner (les vidéos 17 à 21 couvrent cette API exacte).
|
||||||
|
|
||||||
|
Vous pouvez également consulter ce tutoriel interactif : https://aka.ms/learn/express-api
|
||||||
|
|
||||||
|
## Exécution du serveur
|
||||||
|
|
||||||
|
Assurez-vous que [Node.js](https://nodejs.org) est installé.
|
||||||
|
|
||||||
|
1. Git clonez ce repo [The Web-Dev-For-Beginners](https://github.com/microsoft/Web-Dev-For-Beginners).
|
||||||
|
2. Ouvrez votre terminal et accédez au dossier `Web-Dev-For-Beginners/7-bank-project/api`
|
||||||
|
2. Exécutez `npm install` et attendez que les packages soient installés (cela peut prendre un certain temps en fonction de la qualité de votre connexion Internet).
|
||||||
|
3. Une fois l'installation terminée, exécutez `npm start` et vous êtes prêt à commencer.
|
||||||
|
|
||||||
|
Le serveur devrait commencer à écouter sur le port `5000`.
|
||||||
|
*Ce serveur fonctionnera avec le terminal principal du serveur d'applications de la banque (à l'écoute sur le port `3000`), ne le fermez pas.*
|
||||||
|
|
||||||
|
> Remarque : toutes les entrées sont stockées en mémoire et ne sont pas persistantes, de sorte que lorsque le serveur est arrêté, toutes les données sont perdues.
|
||||||
|
|
||||||
|
## Détails de l'API
|
||||||
|
|
||||||
|
Route | Description
|
||||||
|
---------------------------------------------|------------------------------------
|
||||||
|
GET /api/ | Obtenir des informations sur le serveur
|
||||||
|
POST /api/accounts/ | Créer un compte, ex : `{ user: 'Yohan', description: 'My budget', currency: 'EUR', balance: 100 }`
|
||||||
|
GET /api/accounts/:user | Obtenir toutes les données pour le compte spécifié
|
||||||
|
DELETE /api/accounts/:user | Supprimer le compte spécifié
|
||||||
|
POST /api/accounts/:user/transactions | Ajoutez une transaction, ex : `{ date: '2020-07-23T18:25:43.511Z', object: 'Bought a book', amount: -20 }`
|
||||||
|
DELETE /api/accounts/:user/transactions/:id | Supprimer la transaction spécifiée
|
||||||
@ -0,0 +1,34 @@
|
|||||||
|
# ബാങ്ക് API
|
||||||
|
|
||||||
|
> ബാങ്ക് 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. Git ഈ റിപ്പോ ക്ലോൺ ചെയ്യുക [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/ | ഒരു അക്കൗണ്ട് സൃഷ്ടിക്കുക, ex: `{ user: 'Yohan', description: 'My budget', currency: 'EUR', balance: 100 }`
|
||||||
|
GET /api/accounts/:user | നിർദ്ദിഷ്ട അക്കൗണ്ടിനായുള്ള എല്ലാ ഡാറ്റയും നേടുക
|
||||||
|
DELETE /api/accounts/:user | നിർദ്ദിഷ്ട അക്കൗണ്ട് നീക്കം ചെയ്യുക
|
||||||
|
POST /api/accounts/:user/transactions | ഒരു ഇടപാട് ചേർക്കുക, ex: `{ date: '2020-07-23T18:25:43.511Z', object: 'Bought a book', amount: -20 }`
|
||||||
|
DELETE /api/accounts/:user/transactions/:id | നിർദ്ദിഷ്ട ഇടപാട് നീക്കം ചെയ്യുക
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
# Application bancaire
|
||||||
|
|
||||||
|
> Exemple de solution pour le projet d'application bancaire, développé avec du HTML5 vanilla, du CSS et du JavaScript (pas de frameworks ni de bibliothèques utilisés).
|
||||||
|
|
||||||
|
## Exécuter l'application
|
||||||
|
|
||||||
|
Assurez-vous d'abord que le [serveur API](../../api/translations/README.fr.md) est en cours d'exécution.
|
||||||
|
|
||||||
|
N'importe quel serveur Web peut être utilisé pour exécuter l'application, mais comme [Node.js](https://nodejs.org/fr) doit de toute façon être installé pour exécuter l'API, vous pouvez :
|
||||||
|
|
||||||
|
1. Git cloner ce dépôt.
|
||||||
|
2. Ouvrir un terminal, puis exécutez `npx lite-server solution`. Celà démarrera un serveur Web de développement sur le port `3000`
|
||||||
|
3. Ouvrir `http://localhost:3000` dans un navigateur pour exécuter l'application.
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
# ബാങ്ക് ആപ്പ്
|
||||||
|
|
||||||
|
> വാനില HTML5, CSS, JavaScript എന്നിവ ഉപയോഗിച്ച് നിർമ്മിച്ച ബാങ്ക് ആപ്പ് പ്രോജക്റ്റിനുള്ള ഉദാഹരണ പരിഹാരം (ചട്ടക്കൂടുകളോ ലൈബ്രറികളോ ഉപയോഗിച്ചിട്ടില്ല).
|
||||||
|
|
||||||
|
## ആപ്പ് പ്രവർത്തിപ്പിക്കുന്നു
|
||||||
|
|
||||||
|
ആദ്യം നിങ്ങൾക്ക് [API സെർവർ](../api/README.md) പ്രവർത്തിക്കുന്നുണ്ടെന്ന് ഉറപ്പാക്കുക.
|
||||||
|
|
||||||
|
ആപ്പ് പ്രവർത്തിപ്പിക്കാൻ ഏത് വെബ് സെർവറും ഉപയോഗിക്കാം, എന്നാൽ API പ്രവർത്തിപ്പിക്കുന്നതിന് നിങ്ങൾക്ക് [Node.js](https://nodejs.org) ഇൻസ്റ്റാൾ ചെയ്തിരിക്കേണ്ടതിനാൽ, നിങ്ങൾക്ക് ഇവ ചെയ്യാനാകും:
|
||||||
|
|
||||||
|
1. ഈ റിപ്പോ Git ക്ലോൺ ചെയ്യുക.
|
||||||
|
2. ഒരു ടെർമിനൽ തുറക്കുക, തുടർന്ന് `npx lite-server solution` റൺ ചെയ്യുക. അത് `3000` പോർട്ടിൽ ഒരു വികസന വെബ് സെർവർ ആരംഭിക്കും
|
||||||
|
3. ആപ്പ് പ്രവർത്തിപ്പിക്കുന്നതിന് ഒരു ബ്രൗസറിൽ `http://localhost:3000` തുറക്കുക.
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
# :dollar: ഒരു ബാങ്ക് നിർമ്മിക്കുക
|
||||||
|
|
||||||
|
ഈ പ്രോജക്റ്റിൽ, ഒരു സാങ്കൽപ്പിക ബാങ്ക് എങ്ങനെ നിർമ്മിക്കാമെന്ന് നിങ്ങൾ പഠിക്കും. ഈ പാഠങ്ങളിൽ ഒരു വെബ് ആപ്പ് എങ്ങനെ ലേഔട്ട് ചെയ്യാം, റൂട്ടുകൾ നൽകാം, ഫോമുകൾ നിർമ്മിക്കാം, സ്റ്റേറ്റ് മാനേജുചെയ്യാം, നിങ്ങൾക്ക് ബാങ്കിന്റെ ഡാറ്റ ലഭ്യമാക്കാൻ കഴിയുന്ന ഒരു API-ൽ നിന്ന് ഡാറ്റ നേടുന്നത് എങ്ങനെ എന്നതിനുള്ള നിർദ്ദേശങ്ങൾ ഉൾപ്പെടുന്നു.
|
||||||
|
|
||||||
|
|  |  |
|
||||||
|
|--------------------------------|--------------------------------|
|
||||||
|
|
||||||
|
## പാഠങ്ങൾ
|
||||||
|
|
||||||
|
1. [ഒരു വെബ് ആപ്പിലെ HTML ടെംപ്ലേറ്റുകളും റൂട്ടുകളും](1-template-route/README.md)
|
||||||
|
2. [ഒരു ലോഗിൻ, രജിസ്ട്രേഷൻ ഫോം നിർമ്മിക്കുക](2-forms/README.md)
|
||||||
|
3. [ഡാറ്റ ലഭ്യമാക്കുന്നതിനും ഉപയോഗിക്കുന്നതിനുമുള്ള രീതികൾ](3-data/README.md)
|
||||||
|
4. [സംസ്ഥാന മാനേജ്മെന്റിന്റെ ആശയങ്ങൾ](4-state-management/README.md)
|
||||||
|
|
||||||
|
### ക്രെഡിറ്റുകൾ
|
||||||
|
|
||||||
|
ഈ പാഠങ്ങൾ എഴുതിയത് :hearts: [Yohan Lasorsa](https://twitter.com/sinedied).
|
||||||
|
|
||||||
|
ഈ പാഠങ്ങളിൽ ഉപയോഗിച്ചിരിക്കുന്ന [സെർവർ API](/7-bank-project/api/README.md) എങ്ങനെ നിർമ്മിക്കാമെന്ന് അറിയാൻ നിങ്ങൾക്ക് താൽപ്പര്യമുണ്ടെങ്കിൽ, നിങ്ങൾക്ക് [ഈ വീഡിയോ പരമ്പര](https://aka.ms/NodeBeginner) (പ്രത്യേകിച്ച് 17 മുതൽ 21 വരെയുള്ള വീഡിയോകൾ).
|
||||||
|
|
||||||
|
നിങ്ങൾക്ക് [ഈ ഇന്ററാക്ടീവ് ലേൺ ട്യൂട്ടോറിയൽ](https://aka.ms/learn/express-api) നോക്കാവുന്നതാണ്.
|
||||||
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 4.4 KiB |
@ -0,0 +1,101 @@
|
|||||||
|
|
||||||
|
[](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE)
|
||||||
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/)
|
||||||
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/)
|
||||||
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
|
||||||
|
[](http://makeapullrequest.com)
|
||||||
|
|
||||||
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/)
|
||||||
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/)
|
||||||
|
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/)
|
||||||
|
|
||||||
|
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
|
||||||
|
|
||||||
|
# തുടക്കക്കാർക്കുള്ള വെബ് വികസനം - ഒരു പാഠ്യപദ്ധതി
|
||||||
|
|
||||||
|
മൈക്രോസോഫ്റ്റിലെ അസുർ ക്ലൗഡ് അഡ്വക്കേറ്റ്സ് ജാവാസ്ക്രിപ്റ്റ്, സിഎസ്എസ്, എച്ച്ടിഎംഎൽ അടിസ്ഥാനകാര്യങ്ങൾ എന്നിവയെക്കുറിച്ച് 12-ആഴ്ച, 24-പാഠ പാഠ്യപദ്ധതി വാഗ്ദാനം ചെയ്യുന്നതിൽ സന്തോഷമുണ്ട്. ഓരോ പാഠത്തിലും പാഠത്തിന് മുമ്പും ശേഷവുമുള്ള ക്വിസുകൾ, പാഠം പൂർത്തിയാക്കാനുള്ള രേഖാമൂലമുള്ള നിർദ്ദേശങ്ങൾ, ഒരു പരിഹാരം, ഒരു അസൈൻമെന്റ് എന്നിവയും അതിലേറെയും ഉൾപ്പെടുന്നു. ഞങ്ങളുടെ പ്രോജക്റ്റ് അധിഷ്ഠിത അദ്ധ്യാപനം പുതിയ കഴിവുകൾ സ്വായത്തമാക്കൻ നിങ്ങളെ അനുവദിക്കുന്നു.
|
||||||
|
|
||||||
|
**ഞങ്ങളുടെ രചയിതാക്കളായ ജെൻ ലൂപ്പർ, ക്രിസ് നോറിംഗ്, ക്രിസ്റ്റഫർ ഹാരിസൺ, ജാസ്മിൻ ഗ്രീൻവേ, യോഹാൻ ലസോർസ, ഫ്ലോർ ഡ്രീസ്, സ്കെച്ച്നോട്ട് ആർട്ടിസ്റ്റ് ടോമിമി ഇമുറ എന്നിവർക്ക് ഹൃദയം നിറഞ്ഞ നന്ദി!**
|
||||||
|
|
||||||
|
# ആമുഖം
|
||||||
|
|
||||||
|
> **അദ്ധ്യാപകർ**, ഞങ്ങൾ [ചില നിർദ്ദേശങ്ങൾ ഉൾപ്പെടുത്തിയിട്ടുണ്ട്](/for-teachers.md) ഈ പാഠ്യപദ്ധതി എങ്ങനെ ഉപയോഗിക്കാം എന്നതിനെക്കുറിച്ച്. നിങ്ങളുടെ ഫീഡ്ബാക്ക് ഞങ്ങൾ ഇഷ്ടപ്പെടുന്നു [ഞങ്ങളുടെ ചർച്ചാ ഫോറത്തിൽ](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
|
||||||
|
|
||||||
|
> **വിദ്യാർത്ഥികൾ**, ഈ പാഠ്യപദ്ധതി സ്വന്തമായി ഉപയോഗിക്കുന്നതിന്, മുഴുവൻ റിപ്പോയും ഫോർക്ക് ചെയ്ത് സ്വന്തമായി വ്യായാമങ്ങൾ പൂർത്തിയാക്കുക, പ്രീ-ലെക്ചർ ക്വിസിൽ തുടങ്ങി, പ്രഭാഷണം വായിച്ച് ബാക്കി പ്രവർത്തനങ്ങൾ പൂർത്തിയാക്കുക. പരിഹാര കോഡ് പകർത്തുന്നതിനുപകരം പാഠങ്ങൾ മനസിലാക്കിക്കൊണ്ട് പ്രോജക്ടുകൾ സൃഷ്ടിക്കാൻ ശ്രമിക്കുക; എന്നിരുന്നാലും ആ പ്രോജക്റ്റ് അധിഷ്ടിതം പാഠത്തിലെ /സൊല്യൂഷൻസ് ഫോൾഡറുകളിൽ ആ കോഡ് ലഭ്യമാണ്. മറ്റൊരു ആശയം സുഹൃത്തുക്കളുമായി ഒരു പഠന ഗ്രൂപ്പ് രൂപീകരിച്ച് ഒരുമിച്ച് ഉള്ളടക്കം പരിശോധിക്കുക എന്നതാണ്. കൂടുതൽ പഠനത്തിന്, ഞങ്ങൾ ശുപാർശ ചെയ്യുന്നു [മൈക്രോസോഫ്റ്റ് ലേൺ](https://docs.microsoft.com/users/jenlooper-2911/collections/jg2gax8pzd6o81?WT.mc_id=academic-13441-cxa) കൂടാതെ താഴെ സൂചിപ്പിച്ചിരിക്കുന്ന വീഡിയോകൾ കണ്ടുകൊണ്ട്.
|
||||||
|
|
||||||
|
[](https://youtube.com/watch?v=R1wrdtmBSII "പ്രമോ വീഡിയോ")
|
||||||
|
|
||||||
|
> 🎥 പ്രോജക്റ്റിനെക്കുറിച്ചും അത് സൃഷ്ടിച്ചവരെക്കുറിച്ചും ഒരു വീഡിയോയ്ക്കായി മുകളിലുള്ള ചിത്രത്തിൽ ക്ലിക്കുചെയ്യുക!
|
||||||
|
|
||||||
|
## അദ്ധ്യാപനo
|
||||||
|
|
||||||
|
ഈ പാഠ്യപദ്ധതി നിർമ്മിക്കുമ്പോൾ ഞങ്ങൾ രണ്ട് പെഡഗോഗിക്കൽ സിദ്ധാന്തങ്ങൾ തിരഞ്ഞെടുത്തു: ഇത് പ്രോജക്റ്റ് അടിസ്ഥാനമാക്കിയുള്ളതാണെന്നും അതിൽ പതിവ് ക്വിസുകൾ ഉൾപ്പെടുന്നുവെന്നും ഉറപ്പാക്കുന്നു. ഈ പരമ്പരയുടെ അവസാനത്തോടെ, വിദ്യാർത്ഥികൾ ഒരു ടൈപ്പിംഗ് ഗെയിം, ഒരു വെർച്വൽ ടെറേറിയം, ഒരു 'ഗ്രീൻ' ബ്രൗസർ എക്സ്റ്റൻഷൻ, ഒരു 'സ്പെയ്സ് ഇൻവേഡേഴ്സ്' ടൈപ്പ് ഗെയിം, ഒരു ബിസിനസ്-ടൈപ്പ് ബാങ്കിംഗ് ആപ്പ് എന്നിവ നിർമ്മിക്കുകയും ജാവാസ്ക്രിപ്റ്റിന്റെ അടിസ്ഥാനകാര്യങ്ങൾ പഠിക്കുകയും ചെയ്യും , ഇന്നത്തെ വെബ് ഡെവലപ്പറിന്റെ ആധുനിക ടൂൾചെയിനിനൊപ്പം HTML, CSS എന്നിവയും.
|
||||||
|
|
||||||
|
> 🎓 ഈ പാഠ്യപദ്ധതിയിലെ ആദ്യ കുറച്ച് പാഠങ്ങൾ നിങ്ങൾക്ക് മൈക്രോസോഫ്റ്റ് ലേൺ നെ കുറിച്ചുള്ള ഒരു[പഠന പാത](https://docs.microsoft.com/learn/paths/web-development-101?WT.mc_id=academic-13441-cxa) ആയി എടുക്കാം.
|
||||||
|
|
||||||
|
പ്രോജക്റ്റുകളുമായി ഉള്ളടക്കം യോജിക്കുന്നുവെന്ന് ഉറപ്പുവരുത്തുന്നതിലൂടെ, ഈ പ്രക്രിയ വിദ്യാർത്ഥികളെ കൂടുതൽ ആകർഷകമാക്കുകയും ആശയങ്ങൾ നിലനിർത്തുന്നത് വർദ്ധിപ്പിക്കുകയും ചെയ്യും. ആശയങ്ങൾ അവതരിപ്പിക്കാൻ ഞങ്ങൾ ജാവാസ്ക്രിപ്റ്റ് അടിസ്ഥാനത്തിൽ നിരവധി സ്റ്റാർട്ടർ പാഠങ്ങൾ എഴുതി, paired with video from the "[ജാവാസ്ക്രിപ്റ്റിലേക്കുള്ള തുടക്കക്കാരുടെ പരമ്പര](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript?WT.mc_id=academic-13441-cxa)" വീഡിയോ ട്യൂട്ടോറിയലുകളുടെ ശേഖരം, ചില എഴുത്തുകാർ ഈ പാഠ്യപദ്ധതിക്ക് സംഭാവന നൽകി.
|
||||||
|
ഇതുകൂടാതെ, ഒരു ക്ലാസിന് മുമ്പുള്ള ഒരു കുറഞ്ഞ ക്വിസ് ഒരു വിഷയം പഠിക്കുന്നതിനുള്ള വിദ്യാർത്ഥിയുടെ ഉദ്ദേശ്യം സജ്ജമാക്കുന്നു, അതേസമയം ക്ലാസിന് ശേഷമുള്ള രണ്ടാമത്തെ ക്വിസ് കൂടുതൽ നിലനിർത്തൽ ഉറപ്പാക്കുന്നു. ഈ പാഠ്യപദ്ധതി രൂപകൽപ്പന ചെയ്തിരിക്കുന്നത് വഴക്കമുള്ളതും രസകരവുമാണ്, ഇത് മുഴുവനായോ ഭാഗികമായോ എടുക്കാം. പദ്ധതികൾ ചെറുതായി ആരംഭിച്ച് 12 ആഴ്ച ചക്രത്തിന്റെ അവസാനത്തോടെ കൂടുതൽ സങ്കീർണമാകുന്നു.
|
||||||
|
|
||||||
|
ഒരു ചട്ടക്കൂട് സ്വീകരിക്കുന്നതിന് മുമ്പ് ഒരു വെബ് ഡെവലപ്പർ എന്ന നിലയിൽ ആവശ്യമായ അടിസ്ഥാന കഴിവുകളിൽ ശ്രദ്ധ കേന്ദ്രീകരിക്കുന്നതിന് ഞങ്ങൾ ജാവാസ്ക്രിപ്റ്റ് ചട്ടക്കൂടുകൾ അവതരിപ്പിക്കുന്നത് മനപ്പൂർവ്വം ഒഴിവാക്കിയിട്ടുണ്ടെങ്കിലും, ഈ പാഠ്യപദ്ധതി പൂർത്തിയാക്കുന്നതിനുള്ള ഒരു നല്ല അടുത്ത ഘട്ടം വീഡിയോകളുടെ മറ്റൊരു ശേഖരത്തിലൂടെ നോഡ്.js- നെക്കുറിച്ച് പഠിക്കുക എന്നതാണ്: "[നോഡ്.js ലേക്കുള്ള തുടക്കക്കാരുടെ പരമ്പര](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs?WT.mc_id=academic-13441-cxa)".
|
||||||
|
|
||||||
|
> ഞങ്ങളുടെ [പെരുമാറ്റച്ചട്ടം](/CODE_OF_CONDUCT.md), [സംഭാവന](/CONTRIBUTING.md), [പരിഭാഷ](/TRANSLATIONS.md) എന്നിവയുടെ മാർഗ്ഗനിർദ്ദേശങ്ങൾ പരിശോധിക്കുക. നിങ്ങളുടെ ക്രിയാത്മക മായ അഭിപ്രായത്തെ ഞങ്ങൾ സ്വാഗതം ചെയ്യുന്നു!
|
||||||
|
>
|
||||||
|
## ഓരോ പാഠത്തിലും ഉൾപ്പെടുന്നത്:
|
||||||
|
|
||||||
|
- ഓപ്ഷണൽ സ്കെച്ച്നോട്ട്
|
||||||
|
- ഓപ്ഷണൽ അനുബന്ധ വീഡിയോ
|
||||||
|
- പാഠത്തിനു മുമ്പുള്ള വാംഅപ്പ് ക്വിസ്
|
||||||
|
- എഴുതിയ പാഠഭാഗം
|
||||||
|
- പ്രോജക്റ്റ് അധിഷ്ഠിത പാഠങ്ങൾക്കായി, പ്രോജക്റ്റ് എങ്ങനെ നിർമ്മിക്കാം എന്നതിനെക്കുറിച്ചുള്ള ഘട്ടം ഘട്ടമായുള്ള ഗൈഡുകൾ
|
||||||
|
- വിജ്ഞാന പരിശോധനകൾ
|
||||||
|
- ഒരു വെല്ലുവിളി
|
||||||
|
- അനുബന്ധ വായന
|
||||||
|
- അസ്സൈൻമെന്റ്
|
||||||
|
- പാഠാനന്തര ക്വിസ്
|
||||||
|
|
||||||
|
> **ക്വിസുകളെക്കുറിച്ചുള്ള ഒരു കുറിപ്പ്**: എല്ലാ ക്വിസുകളും [ഈ ആപ്പിൽ](https://happy-mud-02d95f10f.azurestaticapps.net/) അടങ്ങിയിരിക്കുന്നു, മൂന്ന് ചോദ്യങ്ങൾ വീതമടങ്ങിയ മൊത്തം 48 ക്വിസുകൾ. അവ പാഠങ്ങൾക്കുള്ളിൽ നിന്ന് ബന്ധിപ്പിച്ചിരിക്കുന്നു, പക്ഷേ ക്വിസ് ആപ്പ് പ്രാദേശികമായി പ്രവർത്തിപ്പിക്കാൻ കഴിയും; 'ക്വിസ്-ആപ്പ്' ഫോൾഡറിലെ നിർദ്ദേശം പാലിക്കുക. അവ ക്രമേണ പ്രാദേശികവൽക്കരിക്കപ്പെടുന്നു.
|
||||||
|
|
||||||
|
## പാഠങ്ങൾ
|
||||||
|
|
||||||
|
|
||||||
|
| | പദ്ധതിയുടെ പേര് | പഠിപ്പിച്ച ആശയങ്ങൾ | പഠന ലക്ഷ്യങ്ങൾ | ലിങ്ക് ചെയ്ത പാഠം | രചയിതാവ് |
|
||||||
|
| :---: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: |
|
||||||
|
| 01 | ആമുഖം | പ്രോഗ്രാമിംഗിലേക്കും ട്രേഡിലെ ഉപകരണങ്ങളിലേക്കും ആമുഖം | മിക്ക പ്രോഗ്രാമിംഗ് ഭാഷകൾക്കും പിന്നിലെ അടിസ്ഥാന അടിസ്ഥാനങ്ങളും പ്രൊഫഷണൽ ഡെവലപ്പർമാരെ അവരുടെ ജോലികൾ ചെയ്യാൻ സഹായിക്കുന്ന സോഫ്റ്റ്വെയറുകളെക്കുറിച്ചും അറിയുക | [പ്രോഗ്രാമിംഗ് ഭാഷകളിലേക്കും വ്യാപാരത്തിന്റെ ഉപകരണങ്ങളിലേക്കുമുള്ള ഇൻട്രോ](/1-getting-started-lessons/1-intro-to-programming-languages/README.md) | ജാസ്മിൻ |
|
||||||
|
| 02 | ആമുഖം | ഗിറ്റ്ഹബിന്റെ അടിസ്ഥാനങ്ങളിൽ ഒരു ടീമിനൊപ്പം പ്രവർത്തിക്കുന്നത് ഉൾപ്പെടുന്നു | നിങ്ങളുടെ പ്രോജക്റ്റിൽ ഗിറ്റ്ഹബ് എങ്ങനെ ഉപയോഗിക്കാം, ഒരു കോഡ് അടിസ്ഥാനത്തിൽ മറ്റുള്ളവരുമായി എങ്ങനെ സഹകരിക്കാം | [ഗിറ്റ്ഹബിലേക്കുള്ള ഇൻട്രോ](/1-getting-started-lessons/2-github-basics/README.md) | ഫ്ലോർ |
|
||||||
|
| 03 | ആമുഖം | ആക്സസിബിലിറ്റി | വെബ് ആക്സസബിലിറ്റിയുടെ അടിസ്ഥാനകാര്യങ്ങൾ പഠിക്കുക | [ആക്സസിബിലിറ്റി അടിസ്ഥാനങ്ങൾ](/1-getting-started-lessons/3-accessibility/README.md) | ക്രിസ്റ്റഫർ |
|
||||||
|
| 04 | JS അടിസ്ഥാനങ്ങൾ | ജാവാസ്ക്രിപ്റ്റ് ഡാറ്റ തരങ്ങൾ | ജാവാസ്ക്രിപ്റ്റ് ഡാറ്റ തരങ്ങളുടെ അടിസ്ഥാനങ്ങൾ | [ഡാറ്റ തരങ്ങൾ](/2-js-basics/1-data-types/README.md) | ജാസ്മിൻ |
|
||||||
|
| 05 | JS അടിസ്ഥാനങ്ങൾ | പ്രവർത്തനങ്ങളും രീതികളും | ഒരു ആപ്ലിക്കേഷന്റെ ലോജിക് ഫ്ലോ കൈകാര്യം ചെയ്യാനുള്ള പ്രവർത്തനങ്ങളെയും രീതികളെയും കുറിച്ച് അറിയുക | [പ്രവർത്തനങ്ങളും രീതികളും](/2-js-basics/2-functions-methods/README.md) | ജാസ്മിനും ക്രിസ്റ്റഫറും |
|
||||||
|
| 06 | JS അടിസ്ഥാനങ്ങൾ | ജെഎസുമായി തീരുമാനങ്ങൾ എടുക്കുന്നു | തീരുമാനമെടുക്കുന്ന രീതികൾ ഉപയോഗിച്ച് നിങ്ങളുടെ കോഡിൽ സാഹചര്യങ്ങൾ എങ്ങനെ സൃഷ്ടിക്കാമെന്ന് മനസിലാക്കുക | [തീരുമാനങ്ങൾ എടുക്കുക ](/2-js-basics/3-making-decisions/README.md) | ജാസ്മിൻ |
|
||||||
|
| 07 | JS അടിസ്ഥാനങ്ങൾ | അറേകളും ലൂപ്പുകളും | ജാവാസ്ക്രിപ്റ്റിലെ അറേകളും ലൂപ്പുകളും ഉപയോഗിച്ച് ഡാറ്റഉപയോഗിച്ച് പ്രവർത്തിക്കുക | [അറേകളും ലൂപ്പുകളും](/2-js-basics/4-arrays-loops/README.md) | ജാസ്മിൻ |
|
||||||
|
| 08 | [ടെറേറിയം](/3-terrarium/solution/README.md) | HTML ൽ പരിശീലിക്കുക | ഒരു ലേഔട്ട് നിർമ്മിക്കുന്നതിൽ ശ്രദ്ധ കേന്ദ്രീകരിച്ച് ഒരു ഓൺലൈൻ ടെറേറിയം സൃഷ്ടിക്കുന്നതിന് HTML നിർമ്മിക്കുക | [HTML ന്റെ ആമുഖം](/3-terrarium/1-intro-to-html/README.md) | ജെൻ |
|
||||||
|
| 09 | [ടെറേറിയം](/3-terrarium/solution/README.md) | CSS ൽ പരിശീലിക്കുക | പേജ് പ്രതികരണാത്മകമാക്കുന്നതുൾപ്പെടെ CSS-ന്റെ അടിസ്ഥാനകാര്യങ്ങളിൽ ശ്രദ്ധ കേന്ദ്രീകരിച്ചുകൊണ്ട് ഓൺലൈൻ ടെറേറിയം സ്റ്റൈൽ ചെയ്യുന്നതിന് സിഎസ്എസ് നിർമ്മിക്കുക | [CSS ന്റെ ആമുഖം](/3-terrarium/2-intro-to-css/README.md) | ജെൻ |
|
||||||
|
| 10 | [ടെറേറിയം](/3-terrarium/solution) | ജാവാസ്ക്രിപ്റ്റ് ക്ലോസ്രെസ്, ഡോം കൃത്രിമം | ക്ലോസ്രെസ്ന്റെയും ഡോം കൃത്രിമം ഉപയോഗിച്ചുകൊണ്ട് ടെറേറിയം ഒരു ഡ്രാഗ്/ഡ്രോപ്പ് ഇന്റർഫേസായി പ്രവർത്തനമുണ്ടാക്കാൻ ജാവാസ്ക്രിപ്റ്റ് നിർമ്മിക്കുക | [ജാവാസ്ക്രിപ്റ്റ് ക്ലോസ്രെസ്, ഡോം കൃത്രിമം](/3-terrarium/3-intro-to-DOM-and-closures/README.md) | ജെൻ |
|
||||||
|
| 11 | [ടൈപ്പിംഗ് ഗെയിം](/4-typing-game/solution) | ടൈപ്പിംഗ് ഗെയിം നിർമ്മിക്കുക | നിങ്ങളുടെ ജാവാസ്ക്രിപ്റ്റ് ആപ്പിന്റെ ലോജിക് ഡ്രൈവ് ചെയ്യുന്നതിന് കീബോർഡ് ഇവന്റുകൾ എങ്ങനെ ഉപയോഗിക്കാമെന്ന് മനസിലാക്കുക | [ഇവന്റ്-ഡ്രൈവിംഗ് പ്രോഗ്രാമിംഗ്](/4-typing-game/typing-game/README.md) | ക്രിസ്റ്റഫർ |
|
||||||
|
| 12 | [ഗ്രീൻ ബ്രൗസർ എക്സ്റ്റെൻഷൻ](/5-browser-extension/solution) | ബ്രൗസറുകളുമായി പ്രവർത്തിക്കുന്നു | ബ്രൗസറുകൾ എങ്ങനെ പ്രവർത്തിക്കുന്നു, അവയുടെ ചരിത്രം, ബ്രൗസർ എക്സ്റ്റെൻഷന്റെ ആദ്യ ഘടകങ്ങൾ എങ്ങനെ സ്കഫോൾഡ് ആാമെന്ന് മനസിലാക്കുക | [ബ്രൗസറുകളെ കുറിച്ച്](/5-browser-extension/1-about-browsers/README.md) | ജെൻ |
|
||||||
|
| 13 | [ഗ്രീൻ ബ്രൗസർ എക്സ്റ്റെൻഷൻ](/5-browser-extension/solution) | ഒരു ഫോം നിർമ്മിക്കുക, ഒരു എപിഐ വിളിക്കുക, പ്രാദേശിക സംഭരണത്തിൽ വേരിയബിളുകൾ സംഭരിക്കുക | പ്രാദേശിക സംഭരണത്തിൽ സംഭരിച്ചിരിക്കുന്ന വേരിയബിളുകൾ ഉപയോഗിച്ച് ഒരു API വിളിക്കുന്നതിനായി നിങ്ങളുടെ ബ്രൗസർ എക്സ്റ്റെൻഷന്റെ ജാവാസ്ക്രിപ്റ്റ് ഘടകങ്ങൾ നിർമ്മിക്കുക | [APIs, ഫോമുകളും ലോക്കൽ സ്റ്റോറേജും](/5-browser-extension/2-forms-browsers-local-storage/README.md) | ജെൻ |
|
||||||
|
| 14 | [ഗ്രീൻ ബ്രൗസർ എക്സ്റ്റെൻഷൻ](/5-browser-extension/solution) | ബ്രൗസറിലെ പശ്ചാത്തല പ്രക്രിയകൾ, വെബ് പ്രകടനം | എക്സ്റ്റെൻഷന്റെ ഐക്കൺ കൈകാര്യം ചെയ്യുന്നതിന് ബ്രൗസറിന്റെ പശ്ചാത്തല പ്രക്രിയകൾ ഉപയോഗിക്കുക; വെബ് പ്രകടനത്തെക്കുറിച്ചും നിർമ്മിക്കുന്നതിനുള്ള ചില ഒപ്റ്റിമൈസേഷനുകളെ കുറിച്ചും അറിയുക | [പശ്ചാത്തല ജോലികളും പ്രകടനവും](/5-browser-extension/3-background-tasks-and-performance/README.md) | ജെൻ |
|
||||||
|
| 15 | [സ്പേസ് ഗെയിം](/6-space-game/solution) | ജാവാസ്ക്രിപ്റ്റ് ഉപയോഗിച്ച് കൂടുതൽ അഡ്വാൻസ്ഡ് ഗെയിം ഡെവലപ്പ് മെന്റ് | ഒരു ഗെയിം നിർമ്മിക്കുന്നതിനുള്ള തയ്യാറെടുപ്പിൽ ക്ലാസുകളും കോമ്പോസിഷൻ, പബ്/സബ് പാറ്റേൺ എന്നിവ ഉപയോഗിച്ച് അനന്തരാവകാശത്തെക്കുറിച്ച് അറിയുക | [അഡ്വാൻസ്ഡ് ഗെയിം ഡെവലപ്പ്മെന്റിന്റെ ആമുഖം](/6-space-game/1-introduction/README.md) | ക്രിസ് |
|
||||||
|
| 16 | [സ്പേസ് ഗെയിം](/6-space-game/solution) | ക്യാൻവാസിലേക്ക് വരയ്ക്കുന്നു | ഒരു സ്ക്രീനിലേക്ക് ഘടകങ്ങൾ വരയ്ക്കാൻ ഉപയോഗിക്കുന്ന കാൻവാസ് API കുറിച്ച് അറിയുക | [ക്യാൻവാസിലേക്ക് വരയ്ക്കുക ](/6-space-game/2-drawing-to-canvas/README.md) | ക്രിസ് |
|
||||||
|
| 17 | [സ്പേസ് ഗെയിം](/6-space-game/solution) | സ്ക്രീനിന് ചുറ്റും എലമെൻറ് ചലിപ്പിക്കുന്നു | കാർട്ടീഷ്യൻ നിർദ്ദേശാങ്കങ്ങളും കാൻവാസ് API ഉപയോഗിച്ച് മൂലകങ്ങൾക്ക് എങ്ങനെ ചലനം നേടാൻ കഴിയുമെന്ന് കണ്ടെത്തുക | [ചുറ്റും എലമെൻറ് ചലിപ്പിക്കുന്നു](/6-space-game/3-moving-elements-around/README.md) | ക്രിസ് |
|
||||||
|
| 18 | [സ്പേസ് ഗെയിം](/6-space-game/solution) | കോളിഷൻ കണ്ടെത്തൽ | കീപ്രസ്സുകൾ ഉപയോഗിച്ച് ഘടകങ്ങൾ കൂട്ടിമുട്ടുകയും പരസ്പരം പ്രതികരിക്കുകയും ഗെയിമിന്റെ പ്രകടനം ഉറപ്പാക്കുന്നതിന് ഒരു കൂൾഡൗൺ ഫംഗ്ഷൻ നൽകുകയും ചെയ്യുക | [കൂട്ടിയിടി കണ്ടെത്തൽ](/6-space-game/4-collision-detection/README.md) | ക്രിസ് |
|
||||||
|
| 19 | [സ്പേസ് ഗെയിം](/6-space-game/solution) | സ്കോർ നിലനിർത്തൽ | ഗെയിമിന്റെ നിലയെയും പ്രകടനത്തെയും അടിസ്ഥാനമാക്കി ഗണിത കണക്കുകൂട്ടലുകൾ നിർവഹിക്കുക | [സ്കോർ നിലനിർത്തൽ](/6-space-game/5-keeping-score/README.md) | ക്രിസ് |
|
||||||
|
| 20 | [സ്പേസ് ഗെയിം](/6-space-game/solution) | ഗെയിം അവസാനിപ്പിക്കുകയും പുനരാരംഭിക്കുകയും ചെയ്യുന്നു | ആസ്തികൾ വൃത്തിയാക്കുന്നതും വേരിയബിൾ മൂല്യങ്ങൾ പുനക്രമീകരിക്കുന്നതും ഉൾപ്പെടെ ഗെയിം അവസാനിപ്പിക്കുന്നതിനെകുറിച്ചും പുനരാരംഭിക്കുന്നതിനെ കുറിച്ചും അറിയുക | [അവസാനങ്ങളുടെ നിബന്ധനകൾ ](/6-space-game/6-end-condition/README.md) | ക്രിസ് |
|
||||||
|
| 21 | [ബാങ്കിംഗ് ആപ്പ്](/7-bank-project/solution) | HTML ഒരു വെബ് ആപ്പിലെ ടെംപ്ലേറ്റുകളും റൂട്ടുകളും | റൂട്ടിംഗും എച്ച്ടിഎംഎൽ ടെംപ്ലേറ്റുകളും ഉപയോഗിച്ച് ഒരു മൾട്ടിപേജ് വെബ് സൈറ്റിന്റെ ആർക്കിടെക്ചറിന്റെ സ്കഫോൾഡ് എങ്ങനെ സൃഷ്ടിക്കാമെന്ന് മനസിലാക്കുക | [HTML ടെംപ്ലേറ്റുകളും റൂട്ടുകളും](/7-bank-project/1-template-route/README.md) | യോഹാൻ |
|
||||||
|
| 22 | [ബാങ്കിംഗ് ആപ്പ്](/7-bank-project/solution) | ലോഗിൻ, രജിസ്ട്രേഷൻ ഫോം നിർമ്മിക്കുക | ഫോമുകൾ നിർമ്മിക്കുന്നതിനെ കുറിച്ചും വാലിഡേഷൻ റുട്ടീൻ കൈമാറുന്നതിനെ കുറിച്ചും അറിയുക | [ഫോമുകൾ](/7-bank-project/2-forms/README.md) | യോഹാൻ |
|
||||||
|
| 23 | [ബാങ്കിംഗ് ആപ്പ്](/7-bank-project/solution) | ഡാറ്റ കൊണ്ടുവരുന്നതും ഉപയോഗിക്കുന്നതുമായ രീതികൾ | ഡാറ്റ നിങ്ങളുടെ ആപ്പിലേക്ക് എങ്ങനെ ഒഴുകുന്നു, അത് എങ്ങനെ കൊണ്ടുവരാം, സംഭരിക്കാം, ഉപേക്ഷിക്കാം | [ഡാറ്റ](/7-bank-project/3-data/README.md) | യോഹാൻ |
|
||||||
|
| 24 | [ബാങ്കിംഗ് ആപ്പ്](/7-bank-project/solution) | സ്റ്റേറ്റ് മാനേജ്മെന്റിന്റെ ആശയങ്ങൾ | നിങ്ങളുടെ ആപ്പ് എങ്ങനെ സ്റ്റേറ്റ്നിലനിർത്തുന്നു, പ്രോഗ്രാമായി എങ്ങനെ കൈകാര്യം ചെയ്യണമെന്ന് അറിയുക | [സ്റ്റേറ്റ് മാനേജ്മെന്റ്](/7-bank-project/4-state-management/README.md) | യോഹാൻ |
|
||||||
|
|
||||||
|
## ഓഫ്ലൈൻ ആക്സസ്സ്
|
||||||
|
|
||||||
|
നിങ്ങൾക്ക് ഈ ഡോക്യുമെന്റേഷൻ [Docsify](https://docsify.js.org/#/) ഉപയോഗിച്ച് ഓഫ്ലൈനിൽ പ്രവർത്തിപ്പിക്കാനാകും. ഈ റിപ്പോ ഫോർക്ക് ചെയ്യുക, [Docsify ഇന്സ്റ്റോള് ചെയ്യുക](https://docsify.js.org/#/quickstart) നിങ്ങളുടെ പ്രാദേശിക മെഷീനിൽ,തുടർന്ന് ഈ റിപ്പോയുടെ റൂട്ട് ഫോൾഡറിൽ `docsify serve` ടൈപ്പ് ചെയ്യുക. നിങ്ങളുടെ ലോക്കൽഹോസ്റ്റിൽ പോർട്ട് 3000 ൽ വെബ്സൈറ്റ് കാണാം : `localhost:3000`.
|
||||||
|
|
||||||
|
## പിഡിഫ്
|
||||||
|
|
||||||
|
എല്ലാ പാഠങ്ങളുടെയും ഒരു PDF കാണാം [ഇവിടെ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)
|
||||||
|
|
||||||
|
## മറ്റ് പാഠ്യപദ്ധതികൾ
|
||||||
|
|
||||||
|
ഞങ്ങളുടെ ടീം മറ്റ് പാഠ്യപദ്ധതികൾ നിർമ്മിക്കുന്നു! പരിശോധിക്കുക :
|
||||||
|
|
||||||
|
- [തുടക്കക്കാർക്കായുള്ള മെഷീൻ ലേണിംഗ്](https://aka.ms/ml-beginners)
|
||||||
|
- [തുടക്കക്കാർക്കായുള്ള IoT](https://aka.ms/iot-beginners)
|
||||||
@ -0,0 +1,33 @@
|
|||||||
|
## അധ്യാപകർക്ക്
|
||||||
|
|
||||||
|
നിങ്ങളുടെ ക്ലാസ് മുറിയിൽ ഈ പാഠ്യപദ്ധതി ഉപയോഗിക്കാൻ നിങ്ങൾ ആഗ്രഹിക്കുന്നുണ്ടോ? മടിക്കേണ്ടതില്ല!
|
||||||
|
|
||||||
|
വാസ്തവത്തിൽ, GitHub ക്ലാസ്റൂം ഉപയോഗിച്ച് നിങ്ങൾക്ക് GitHub-ൽ തന്നെ ഇത് ഉപയോഗിക്കാൻ കഴിയും.
|
||||||
|
|
||||||
|
അത് ചെയ്യുന്നതിന്, ഈ റിപ്പോ ഫോർക്ക് ചെയ്യുക. ഓരോ പാഠത്തിനും നിങ്ങൾ ഒരു റിപ്പോ സൃഷ്ടിക്കേണ്ടതുണ്ട്, അതിനാൽ നിങ്ങൾ ഓരോ ഫോൾഡറിനും പ്രത്യേക റിപ്പോയിലേക്ക് എക്സ്ട്രാക്റ്റ് ചെയ്യേണ്ടതുണ്ട്. അതുവഴി, [GitHub ക്ലാസ്റൂം](https://classroom.github.com/classrooms) ഓരോ പാഠവും പ്രത്യേകം എടുക്കാം.
|
||||||
|
|
||||||
|
ഈ [പൂർണ്ണ നിർദ്ദേശങ്ങൾ](https://github.blog/2020-03-18-set-up-your-digital-classroom-with-github-classroom/) നിങ്ങളുടെ ക്ലാസ് റൂം എങ്ങനെ സജ്ജീകരിക്കാമെന്ന് ഒരു ആശയം നൽകും.
|
||||||
|
|
||||||
|
## ഇത് മൂഡിൽ, ക്യാൻവാസ് അല്ലെങ്കിൽ ബ്ലാക്ക്ബോർഡിൽ ഉപയോഗിക്കുന്നു
|
||||||
|
|
||||||
|
ഈ പഠന മാനേജ്മെന്റ് സിസ്റ്റങ്ങളിൽ ഈ പാഠ്യപദ്ധതി നന്നായി പ്രവർത്തിക്കുന്നു! പൂർണ്ണമായ ഉള്ളടക്കത്തിനായി [മൂഡിൽ അപ്ലോഡ് ഫയൽ](/teaching-files/webdev-moodle.mbz) ഉപയോഗിക്കുക, അല്ലെങ്കിൽ [കോമൺ കാട്രിഡ്ജ് ഫയൽ](/teaching-files/webdev-common-cartridge.imscc) അടങ്ങിയിരിക്കുന്ന ചില ഉള്ളടക്കം ശ്രമിക്കുക. മൂഡിൽ ക്ലൗഡ് പൂർണ്ണ കോമൺ കാട്രിഡ്ജ് കയറ്റുമതിയെ പിന്തുണയ്ക്കുന്നില്ല, അതിനാൽ ക്യാൻവാസിലേക്ക് അപ്ലോഡ് ചെയ്യാൻ കഴിയുന്ന മൂഡിൽ ഡൗൺലോഡ് ഫയൽ ഉപയോഗിക്കുന്നതാണ് നല്ലത്. ഈ അനുഭവം എങ്ങനെ മെച്ചപ്പെടുത്താം എന്ന് ഞങ്ങളെ അറിയിക്കുക.
|
||||||
|
|
||||||
|
|
||||||
|
> ഒരു മൂഡിൽ ക്ലാസ്റൂമിലെ പാഠ്യപദ്ധതി
|
||||||
|
>
|
||||||
|
|
||||||
|
> ക്യാൻവാസിലെ പാഠ്യപദ്ധതി
|
||||||
|
|
||||||
|
## റിപ്പോ അതേപടി ഉപയോഗിക്കുന്നു
|
||||||
|
|
||||||
|
GitHub Classroom ഉപയോഗിക്കാതെ, ഈ റിപ്പോ നിലവിൽ ഉള്ളതുപോലെ ഉപയോഗിക്കാൻ നിങ്ങൾ ആഗ്രഹിക്കുന്നുവെങ്കിൽ, അതും ചെയ്യാം. ഏത് പാഠമാണ് ഒരുമിച്ച് പ്രവർത്തിക്കേണ്ടതെന്ന് നിങ്ങളുടെ വിദ്യാർത്ഥികളുമായി ആശയവിനിമയം നടത്തേണ്ടതുണ്ട്.
|
||||||
|
|
||||||
|
ഒരു ഓൺലൈൻ ഫോർമാറ്റിൽ (സൂം, ടീമുകൾ അല്ലെങ്കിൽ മറ്റുള്ളവ) നിങ്ങൾ ക്വിസുകൾക്കായി ബ്രേക്ക്ഔട്ട് റൂമുകൾ രൂപീകരിക്കുകയും പഠിക്കാൻ തയ്യാറാകാൻ വിദ്യാർത്ഥികളെ സഹായിക്കുകയും ചെയ്യാം. തുടർന്ന് ക്വിസുകളിലേക്ക് വിദ്യാർത്ഥികളെ ക്ഷണിക്കുകയും അവരുടെ ഉത്തരങ്ങൾ ഒരു നിശ്ചിത സമയത്ത് 'പ്രശ്നങ്ങൾ' ആയി സമർപ്പിക്കുകയും ചെയ്യുക. വിദ്യാർത്ഥികൾ തുറന്ന സ്ഥലത്ത് സഹകരിച്ച് പ്രവർത്തിക്കാൻ നിങ്ങൾ ആഗ്രഹിക്കുന്നുവെങ്കിൽ, അസൈൻമെന്റുകളിലും നിങ്ങൾക്ക് ഇത് ചെയ്യാം.
|
||||||
|
|
||||||
|
നിങ്ങൾ കൂടുതൽ സ്വകാര്യ ഫോർമാറ്റാണ് തിരഞ്ഞെടുക്കുന്നതെങ്കിൽ, നിങ്ങളുടെ വിദ്യാർത്ഥികളോട് പാഠ്യപദ്ധതിയും പാഠം പ്രകാരമുള്ള പാഠവും അവരുടെ സ്വന്തം GitHub റെപ്പോകളിലേക്ക് സ്വകാര്യ റിപ്പോകളായി നൽകാനും നിങ്ങൾക്ക് ആക്സസ് നൽകാനും ആവശ്യപ്പെടുക. തുടർന്ന് അവർക്ക് ക്വിസുകളും അസൈൻമെന്റുകളും സ്വകാര്യമായി പൂർത്തിയാക്കാനും നിങ്ങളുടെ ക്ലാസ്റൂം റിപ്പോയിലെ പ്രശ്നങ്ങൾ മുഖേന അവ നിങ്ങൾക്ക് സമർപ്പിക്കാനും കഴിയും.
|
||||||
|
|
||||||
|
ഒരു ഓൺലൈൻ ക്ലാസ്റൂം ഫോർമാറ്റിൽ ഇത് പ്രവർത്തിക്കാൻ നിരവധി മാർഗങ്ങളുണ്ട്. നിങ്ങൾക്ക് ഏറ്റവും മികച്ചത് എന്താണെന്ന് ഞങ്ങളെ അറിയിക്കുക!
|
||||||
|
|
||||||
|
## ദയവായി നിങ്ങളുടെ ചിന്തകൾ ഞങ്ങൾക്ക് നൽകുക!
|
||||||
|
|
||||||
|
ഈ പാഠ്യപദ്ധതി നിങ്ങൾക്കും നിങ്ങളുടെ വിദ്യാർത്ഥികൾക്കും വേണ്ടി പ്രവർത്തിക്കാൻ ഞങ്ങൾ ആഗ്രഹിക്കുന്നു. ദയവായി ഞങ്ങൾക്ക് [ഫീഡ്ബാക്ക്](https://forms.microsoft.com/Pages/ResponsePage.aspx?id=v4j5cvGGr0GRqy180BHbR2humCsRZhxNuI79cm6n0hRUQzRVVU9VVlU5UlFLWTRLWlkyQUxORTg5WS4u) നൽകുക.
|
||||||
Loading…
Reference in new issue