Added intial files for hindi translation

This commit is contained in:
Sanjay
2020-12-28 00:01:05 +05:30
parent e673998d7e
commit cc833ce34f
82 changed files with 1794 additions and 0 deletions

View File

@@ -0,0 +1,18 @@
*Complete this quiz by checking one answer per question.*
1. The World Wide Web was invented by
- [ ] Tom Barnard-Loft
- [ ] Tim Berners-Lee
- [ ] Trish Berth-Pool
2. The first browser was called
- [ ] World Wide Web
- [ ] Mozilla
- [ ] Netscape
3. Browsers can store a user's browsing history
- [ ] true
- [ ] false

View File

@@ -0,0 +1,20 @@
*A warm-up quiz about browsers*
Complete this quiz in class
1. You can get browser extensions from
- [ ] WalMart
- [ ] The browser's extension store
- [ ] The App store
2. NPM stands for
- [ ] Node Package Manager
- [ ] Netscape Primary Mix
- [ ] Natural Processing Manager
3. Your browser can serve web pages both securely and insecurely
- [ ] true
- [ ] false

View File

@@ -0,0 +1,11 @@
# Restyle your Extension
## Instructions
The codebase for this extension comes complete with styles, but you don't have to use them; make your extension your own by restyling it by editing its css file.
## Rubric
| Criteria | Exemplary | Adequate | Needs Improvement |
| -------- | -------------------------------------------- | --------------------- | ----------------- |
| | Code is submitted with functional new styles | Styling is incomplete | Styles are buggy |

View File

@@ -0,0 +1,16 @@
*Complete this quiz by checking one answer per question.*
1. LocalStorage is cleared every time you close the browser window
- [ ] true
- [ ] false
2. The main browser window controls a browser's extension's LocalStorage
- [ ] true
- [ ] false
3. REST in an API context stands for
- [ ] Representational State Transfer
- [ ] Returning State Tasks
- [ ] Rendering State To Browser

View File

@@ -0,0 +1,20 @@
*A warm-up quiz about the browser*
Complete this quiz in class
1. APIs stand for
- [ ] Application Programming Interfaces
- [ ] A Programming Inference
- [ ] Anti Proven Intentions
2. Use an API to interact with
- [ ] Another web-connected asset
- [ ] A database
- [ ] Either of the above
3. Anyone can create an API
- [ ] true
- [ ] false

View File

@@ -0,0 +1,11 @@
# Adopt an API
## Instructions
APIs can be very fun to play with. Here is a [list of many free ones](https://github.com/public-apis/public-apis). Pick and API, and build a browser extension that solves a problem. It can be as small a problem of not having enough pet pictures (so, try the [dog CEO API](https://dog.ceo/dog-api/)) or something bigger - have fun!
## Rubric
| Criteria | Exemplary | Adequate | Needs Improvement |
| -------- | -------------------------------------------------------------------------- | ---------------------------------------- | ----------------------- |
| | A complete browser extension is submitted using an API from the above list | A partial browser extension is submitted | The submission has bugs |

View File

@@ -0,0 +1,18 @@
*Complete this quiz by checking one answer per question.*
1. To get a better view of your site's performance, clear its cache and reload in the profiler
- [ ] true
- [ ] false
2. Browser extensions are inherently performant
- [ ] true
- [ ] false
3. Analyze the following for performance bottlenecks
- [ ] DOM traversals
- [ ] JavaScript optimizations
- [ ] Asset management
- [ ] All the above

View File

@@ -0,0 +1,18 @@
*Complete this quiz in class.*
1. Test the performance of your app
- [ ] Using the browser's tools
- [ ] Using a separate software package
- [ ] Manually
2. The 'performance' of a web site is an analysis of
- [ ] How fast it loads
- [ ] How fast the code on it runs
- [ ] Both of the above
3. Overall, the 'weight' of web pages over the past few years has gotten
- [ ] lighter
- [ ] heavier
- [ ] stayed the same

View File

@@ -0,0 +1,9 @@
# Analyze a site for performance
Provide a detailed report of a web site, showing areas where performance is problematic. Analyze why the site is slow and what you could do to speed it up. Don't rely only on the browser tools, but do some research on other tools that can help your report
## Rubric
| Criteria | Exemplary | Adequate | Needs Improvement |
| -------- | ---------------------------------------------------------------------------------------------------------- | --------------------------- | ----------------------------- |
| | A report is presented with details drawn not only from browser tools but from 3rd party tools if available | A basic report is presented | A minimal report is presented |

View File

@@ -0,0 +1,28 @@
# Carbon Trigger Browser Extension: Starter Code
Using tmrow's C02 Signal API to track electricity usage, build a browser extension so that you can have a reminder right in your browser about how heavy your region's electricity usage is. Using this extension ad hoc will help you to make judgement calls on your activities based on this information.
![extension screenshot](../extension-screenshot.png)
## Getting Started
You will need to have [npm](https://npmjs.com) installed. Download a copy of this code to a folder on your computer.
Install all the required packages:
```
npm install
```
Build the extension from webpack
```
npm run build
```
To install on Edge, use the 'three dot' menu on the top right corner of the browser to find the Extensions panel. From there, select 'Load Unpacked' to load a new extension. Open the 'dist' folder at the prompt and the extension will load. To use it, you will need an API key for CO2 Signal's API ([get one here via email](https://www.co2signal.com/) - enter your email in the box on this page) and the [code for your region](http://api.electricitymap.org/v3/zones) corresponding to the [Electricity Map](https://www.electricitymap.org/map) (in Boston, for example, I use 'US-NEISO').
![installing](../install-on-edge.png)
Once the API key and region is input into the extension interface, the colored dot in the browser extension bar should change to reflect your region's energy usage and give you a pointer on what energy-heavy activities would be appropriate for you to perform. The concept behind this 'dot' system was given to me by the [Energy Lollipop extension](https://energylollipop.com/) for California emissions.

View File

@@ -0,0 +1,28 @@
# Building a browser extension
Building browser extensions is a fun and interesting way to think about the performance of your apps while building a different type of web asset. This module includes lessons on how browsers work and how to deploy a browser extension, how to build a form, call an API, and use local storage, and how to gauge the performance of your website and improve it.
You'll build a browser extension that works on Edge, Chrome, and Firefox. This extension, which is like a mini web site that is tailored to a very specific task, checks the [C02 Signal API](https://www.co2signal.com) for a given region's electricity usage and carbon intensity, and returns a reading on the region's carbon footprint.
This extension can be called ad hoc by a user once an API key and region code is input into a form to determine local electricity usage and thereby offer data that can influence a user's electricity decisions. For example, it may be preferable to delay running a clothes dryer (a carbon-intense activity) during a period of high electricity usage in your region.
### Topics
1. [About the browser](1-about-browsers/README.md)
2. [Forms and local storage](2-forms-browsers-local-storage/README.md)
3. [Background tasks and performance](3-background-tasks-and-performance/README.md)
### Credits
![a green browser extension](extension-screenshot.png)
## Credits
The idea for this web carbon trigger was offered by Asim Hussain, lead at Microsoft of the Green Cloud Advocacy team and author of the [Green Principles](https://principles.green/). It was originally a [web site project](https://github.com/jlooper/green).
The structure of the browser extension was influenced by [Adebola Adeniran's COVID extension](https://github.com/onedebos/covtension).
The concept behind the 'dot' icon system was suggested by the icon structure of the [Energy Lollipop](https://energylollipop.com/) browser extension for California emissions.
These lessons were written with ♥️ by [Jen Looper](https://www.twitter.com/jenlooper)