diff --git a/README.markdown b/README.markdown index 774797d5..28fa5093 100644 --- a/README.markdown +++ b/README.markdown @@ -8,7 +8,7 @@ commented code and explained as they go. ... to write more inline code tutorials. Just grab an existing file from this repo and copy the formatting (don't worry, it's all very simple). -Make a new file, send a pull request, and if it passes muster I'll get it up pronto. +Make a new file, send a pull request, and if it passes master I'll get it up pronto. Remember to fill in the "contributors" fields so you get credited properly! diff --git a/c++.html.markdown b/c++.html.markdown index 6f4d0562..2bee51dc 100644 --- a/c++.html.markdown +++ b/c++.html.markdown @@ -404,6 +404,8 @@ int main() { // Inheritance: // This class inherits everything public and protected from the Dog class +// as well as private but may not directly access private members/methods +// without a public or protected method for doing so class OwnedDog : public Dog { void setOwner(const std::string& dogsOwner); diff --git a/c.html.markdown b/c.html.markdown index db2ac930..3339032f 100644 --- a/c.html.markdown +++ b/c.html.markdown @@ -6,6 +6,7 @@ contributors: - ["Árpád Goretity", "http://twitter.com/H2CO3_iOS"] - ["Jakub Trzebiatowski", "http://cbs.stgn.pl"] - ["Marco Scannadinari", "https://marcoms.github.io"] + - ["himanshu", "https://github.com/himanshu81494"] --- @@ -27,6 +28,7 @@ Multi-line comments don't nest /* Be careful */ // comment ends on this line... */ // ...not this one! // Constants: #define +// Constants are written in all-caps out of convention, not requirement #define DAYS_IN_YEAR 365 // Enumeration constants are also ways to declare constants. @@ -56,6 +58,15 @@ int add_two_ints(int x1, int x2); // function prototype // Your program's entry point is a function called // main with an integer return type. int main(void) { + // your program +} + +// The command line arguments used to run your program are also passed to main +// argc being the number of arguments - your program's name counts as 1 +// argv is an array of character arrays - containing the arguments themselves +// argv[0] = name of your program, argv[1] = first argument, etc. +int main (int argc, char** argv) +{ // print output using printf, for "print formatted" // %d is an integer, \n is a newline printf("%d\n", 0); // => Prints 0 @@ -306,7 +317,29 @@ int main(void) { exit(-1); break; } - + /* + using "goto" in C + */ + typedef enum { false, true } bool; + // for C don't have bool as data type :( + bool disaster = false; + int i, j; + for(i=0;i<100;++i) + for(j=0;j<100;++j) + { + if((i + j) >= 150) + disaster = true; + if(disaster) + goto error; + } + error : + printf("Error occured at i = %d & j = %d.\n", i, j); + /* + https://ideone.com/GuPhd6 + this will print out "Error occured at i = 52 & j = 99." + */ + + /////////////////////////////////////// // Typecasting /////////////////////////////////////// @@ -472,7 +505,24 @@ char c[] = "This is a test."; str_reverse(c); printf("%s\n", c); // => ".tset a si sihT" */ - +/* +as we can return only one variable +to change values of more than one variables we use call by reference +*/ +void swapTwoNumbers(int *a, int *b) +{ + int temp = *a; + *a = *b; + *b = temp; +} +/* +int first = 10; +int second = 20; +printf("first: %d\nsecond: %d\n", first, second); +swapTwoNumbers(&first, &second); +printf("first: %d\nsecond: %d\n", first, second); +// values will be swapped +*/ // if referring to external variables outside function, must use extern keyword. int i = 0; void testFunc() { diff --git a/coldfusion.html.markdown b/coldfusion.html.markdown new file mode 100644 index 00000000..e2f0737d --- /dev/null +++ b/coldfusion.html.markdown @@ -0,0 +1,321 @@ +--- +language: ColdFusion +contributors: + - ["Wayne Boka", "http://wboka.github.io"] +filename: LearnColdFusion.cfm +--- + +ColdFusion is a scripting language for web development. +[Read more here.](http://www.adobe.com/products/coldfusion-family.html) + +```ColdFusion + +HTML tags have been provided for output readability + +" ---> + + + +

Simple Variables

+ +

Set myVariable to "myValue"

+ +

Set myNumber to 3.14

+ + + + +

Display myVariable: #myVariable#

+

Display myNumber: #myNumber#

+ +
+ +

Complex Variables

+ + +

Set myArray1 to an array of 1 dimension using literal or bracket notation

+ + +

Set myArray2 to an array of 1 dimension using function notation

+ + + +

Contents of myArray1

+ +

Contents of myArray2

+ + + + +

Operators

+

Arithmetic

+

1 + 1 = #1 + 1#

+

10 - 7 = #10 - 7#

+

15 * 10 = #15 * 10#

+

100 / 5 = #100 / 5#

+

120 % 5 = #120 % 5#

+

120 mod 5 = #120 mod 5#

+ +
+ + +

Comparison

+

Standard Notation

+

Is 1 eq 1? #1 eq 1#

+

Is 15 neq 1? #15 neq 1#

+

Is 10 gt 8? #10 gt 8#

+

Is 1 lt 2? #1 lt 2#

+

Is 10 gte 5? #10 gte 5#

+

Is 1 lte 5? #1 lte 5#

+ +

Alternative Notation

+

Is 1 == 1? #1 eq 1#

+

Is 15 != 1? #15 neq 1#

+

Is 10 > 8? #10 gt 8#

+

Is 1 < 2? #1 lt 2#

+

Is 10 >= 5? #10 gte 5#

+

Is 1 <= 5? #1 lte 5#

+ +
+ + +

Control Structures

+ + + +

Condition to test for: "#myCondition#"

+ + + #myCondition#. We're testing. + + #myCondition#. Proceed Carefully!!! + + myCondition is unknown + + +
+ + +

Loops

+

For Loop

+ +

Index equals #i#

+
+ +

For Each Loop (Complex Variables)

+ +

Set myArray3 to [5, 15, 99, 45, 100]

+ + + + +

Index equals #i#

+
+ +

Set myArray4 to ["Alpha", "Bravo", "Charlie", "Delta", "Echo"]

+ + + + +

Index equals #s#

+
+ +

Switch Statement

+ +

Set myArray5 to [5, 15, 99, 45, 100]

+ + + + + + +

#i# is a multiple of 5.

+
+ +

#i# is ninety-nine.

+
+ +

#i# is not 5, 15, 45, or 99.

+
+
+
+ +
+ +

Converting types

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ValueAs BooleanAs numberAs date-timeAs string
"Yes"TRUE1Error"Yes"
"No"FALSE0Error"No"
TRUETRUE1Error"Yes"
FALSEFALSE0Error"No"
NumberTrue if Number is not 0; False otherwise.NumberSee "Date-time values" earlier in this chapter.String representation of the number (for example, "8").
StringIf "Yes", True
If "No", False
If it can be converted to 0, False
If it can be converted to any other number, True
If it represents a number (for example, "1,000" or "12.36E-12"), it is converted to the corresponding number.If it represents a date-time (see next column), it is converted to the numeric value of the corresponding date-time object.
If it is an ODBC date, time, or timestamp (for example "{ts '2001-06-14 11:30:13'}", or if it is expressed in a standard U.S. date or time format, including the use of full or abbreviated month names, it is converted to the corresponding date-time value.
Days of the week or unusual punctuation result in an error.
Dashes, forward-slashes, and spaces are generally allowed.
String
DateErrorThe numeric value of the date-time object.DateAn ODBC timestamp.
+ +
+ +

Components

+ +Code for reference (Functions must return something to support IE) + +
+<cfcomponent>
+	<cfset this.hello = "Hello" />
+	<cfset this.world = "world" />
+
+	<cffunction name="sayHello">
+		<cfreturn this.hello & ", " & this.world & "!" />
+	</cffunction>
+	
+	<cffunction name="setHello">
+		<cfargument name="newHello" type="string" required="true" />
+		
+		<cfset this.hello = arguments.newHello />
+		 
+		<cfreturn true />
+	</cffunction>
+	
+	<cffunction name="setWorld">
+		<cfargument name="newWorld" type="string" required="true" />
+		
+		<cfset this.world = arguments.newWorld />
+		 
+		<cfreturn true />
+	</cffunction>
+	
+	<cffunction name="getHello">
+		<cfreturn this.hello />
+	</cffunction>
+	
+	<cffunction name="getWorld">
+		<cfreturn this.world />
+	</cffunction>
+</cfcomponent>
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +sayHello() +

#sayHello()#

+getHello() +

#getHello()#

+getWorld() +

#getWorld()#

+setHello("Hola") +

#setHello("Hola")#

+setWorld("mundo") +

#setWorld("mundo")#

+sayHello() +

#sayHello()#

+getHello() +

#getHello()#

+getWorld() +

#getWorld()#

+``` + +## Further Reading + +The links provided here below are just to get an understanding of the topic, feel free to Google and find specific examples. + +1. [Coldfusion Reference From Adobe](https://helpx.adobe.com/coldfusion/cfml-reference/topics.html) diff --git a/csharp.html.markdown b/csharp.html.markdown index 02650038..28da9fe5 100644 --- a/csharp.html.markdown +++ b/csharp.html.markdown @@ -6,6 +6,7 @@ contributors: - ["Melvyn Laïly", "http://x2a.yt"] - ["Shaun McCarthy", "http://www.shaunmccarthy.com"] - ["Wouter Van Schandevijl", "http://github.com/laoujin"] + - ["Jo Pearce", "http://github.com/jdpearce"] filename: LearnCSharp.cs --- @@ -418,6 +419,42 @@ on a new line! ""Wow!"", the masses cried"; // Item is an int Console.WriteLine(item.ToString()); } + + // YIELD + // Usage of the "yield" keyword indicates that the method it appears in is an Iterator + // (this means you can use it in a foreach loop) + public static IEnumerable YieldCounter(int limit = 10) + { + for (var i = 0; i < limit; i++) + yield return i; + } + + // which you would call like this : + public static void PrintYieldCounterToConsole() + { + foreach (var counter in YieldCounter()) + Console.WriteLine(counter); + } + + // you can use more than one "yield return" in a method + public static IEnumerable ManyYieldCounter() + { + yield return 0; + yield return 1; + yield return 2; + yield return 3; + } + + // you can also use "yield break" to stop the Iterator + // this method would only return half of the values from 0 to limit. + public static IEnumerable YieldCounterWithBreak(int limit = 10) + { + for (var i = 0; i < limit; i++) + { + if (i > limit/2) yield break; + yield return i; + } + } public static void OtherInterestingFeatures() { @@ -443,6 +480,9 @@ on a new line! ""Wow!"", the masses cried"; // ?? is syntactic sugar for specifying default value (coalesce) // in case variable is null int notNullable = nullable ?? 0; // 0 + + // ?. is an operator for null-propogation - a shorthand way of checking for null + nullable?.Print(); // Use the Print() extension method if nullable isn't null // IMPLICITLY TYPED VARIABLES - you can let the compiler work out what the type is: var magic = "magic is a string, at compile time, so you still get type safety"; @@ -750,7 +790,7 @@ on a new line! ""Wow!"", the masses cried"; // It's also possible to define custom Indexers on objects. // All though this is not entirely useful in this example, you - // could do bicycle[0] which yields "chris" to get the first passenger or + // could do bicycle[0] which returns "chris" to get the first passenger or // bicycle[1] = "lisa" to set the passenger. (of this apparent quattrocycle) private string[] passengers = { "chris", "phil", "darren", "regina" }; @@ -761,7 +801,7 @@ on a new line! ""Wow!"", the masses cried"; } set { - return passengers[i] = value; + passengers[i] = value; } } @@ -837,7 +877,8 @@ on a new line! ""Wow!"", the masses cried"; bool Broken { get; } // interfaces can contain properties as well as methods & events } - // Class can inherit only one other class, but can implement any amount of interfaces + // Class can inherit only one other class, but can implement any amount of interfaces, however + // the base class name must be the first in the list and all interfaces follow class MountainBike : Bicycle, IJumpable, IBreakable { int damage = 0; @@ -876,7 +917,7 @@ on a new line! ""Wow!"", the masses cried"; ## Topics Not Covered * Attributes - * async/await, yield, pragma directives + * async/await, pragma directives * Web Development * ASP.NET MVC & WebApi (new) * ASP.NET Web Forms (old) diff --git a/css.html.markdown b/css.html.markdown index 4c459f7f..d8f30ca3 100644 --- a/css.html.markdown +++ b/css.html.markdown @@ -5,26 +5,21 @@ contributors: - ["Marco Scannadinari", "https://github.com/marcoms"] - ["Geoffrey Liu", "https://github.com/g-liu"] - ["Connor Shea", "https://github.com/connorshea"] + - ["Deepanshu Utkarsh", "https://github.com/duci9y"] filename: learncss.css --- -In the early days of the web there were no visual elements, just pure text. But with the -further development of browsers, fully visual web pages also became common. -CSS is the standard language that exists to keep the separation between -the content (HTML) and the look-and-feel of web pages. +In the early days of the web there were no visual elements, just pure text. But with further development of web browsers, fully visual web pages also became common. -In short, what CSS does is to provide a syntax that enables you to target -different elements on an HTML page and assign different visual properties to them. +CSS helps maintain separation between the content (HTML) and the look-and-feel of a web page. -Like any other languages, CSS has many versions. Here we focus on CSS2.0, -which is not the most recent version, but is the most widely supported and compatible version. +CSS lets you target different elements on an HTML page and assign different visual properties to them. -**NOTE:** Because the outcome of CSS consists of visual effects, in order to -learn it, you need try everything in a -CSS playground like [dabblet](http://dabblet.com/). +This guide has been written for CSS 2, though CSS 3 is fast becoming popular. + +**NOTE:** Because CSS produces visual results, in order to learn it, you need try everything in a CSS playground like [dabblet](http://dabblet.com/). The main focus of this article is on the syntax and some general tips. - ```css /* comments appear inside slash-asterisk, just like this line! there are no "one-line comments"; this is the only comment style */ @@ -33,91 +28,83 @@ The main focus of this article is on the syntax and some general tips. ## SELECTORS #################### */ -/* Generally, the primary statement in CSS is very simple */ +/* the selector is used to target an element on a page. selector { property: value; /* more properties...*/ } -/* the selector is used to target an element on page. - -You can target all elements on the page using asterisk! */ -* { color:red; } - /* -Given an element like this on the page: +Here is an example element: -
+
*/ -/* you can target it by its name */ -.some-class { } +/* You can target it using one of its CSS classes */ +.class1 { } -/* or by both classes! */ -.some-class.class2 { } +/* or both classes! */ +.class1.class2 { } -/* or by its element name */ +/* or its name */ div { } /* or its id */ -#someId { } +#anID { } -/* or by the fact that it has an attribute! */ +/* or using the fact that it has an attribute! */ [attr] { font-size:smaller; } /* or that the attribute has a specific value */ [attr='value'] { font-size:smaller; } -/* start with a value (CSS3) */ +/* starts with a value (CSS 3) */ [attr^='val'] { font-size:smaller; } -/* or ends with (CSS3) */ +/* or ends with a value (CSS 3) */ [attr$='ue'] { font-size:smaller; } -/* or select by one of the values from the whitespace separated list (CSS3) */ -[otherAttr~='foo'] { font-size:smaller; } +/* or contains a value in a space-separated list */ +[otherAttr~='foo'] { } +[otherAttr~='bar'] { } -/* or value can be exactly “value” or can begin with “value” immediately followed by “-” (U+002D) */ +/* or contains a value in a dash-separated list, ie, "-" (U+002D) */ [otherAttr|='en'] { font-size:smaller; } -/* and more importantly you can combine these together -- there shouldn't be -any space between different parts because that makes it to have another -meaning. */ +/* You can concatenate different selectors to create a narrower selector. Don't + put spaces between them. */ div.some-class[attr$='ue'] { } -/* you can also select an element based on its parent. */ +/* You can select an element which is a child of another element */ +div.some-parent > .class-name { } -/* an element which is direct child of an element (selected the same way) */ -div.some-parent > .class-name {} +/* or a descendant of another element. Children are the direct descendants of + their parent element, only one level down the tree. Descendants can be any + level down the tree. */ +div.some-parent .class-name { } -/* or any of its parents in the tree - the following basically means any element that has class "class-name" - and is child of a div with class name "some-parent" IN ANY DEPTH */ -div.some-parent .class-name {} +/* Warning: the same selector without a space has another meaning. + Can you guess what? */ +div.some-parent.class-name { } -/* warning: the same selector without space has another meaning. - can you say what? */ -div.some-parent.class-name {} +/* You may also select an element based on its adjacent sibling */ +.i-am-just-before + .this-element { } -/* you also might choose to select an element based on its direct - previous sibling */ -.i-am-before + .this-element { } +/* or any sibling preceding it */ +.i-am-any-element-before ~ .this-element { } -/* or any sibling before this */ -.i-am-any-before ~ .this-element {} +/* There are some selectors called pseudo classes that can be used to select an + element when it is in a particular state */ -/* There are some pseudo classes that allows you to select an element - based on its page behaviour (rather than page structure) */ +/* for example, when the cursor hovers over an element */ +selector:hover { } -/* for example for when an element is hovered */ -selector:hover {} +/* or a link has been visited */ +selector:visited { } -/* or a visited link */ -selected:visited {} +/* or hasn't been visited */ +selected:link { } -/* or not visited link */ -selected:link {} - -/* or an input element which is focused */ -selected:focus {} +/* or an element in focus */ +selected:focus { } /* any element that is the first child of its parent */ selector:first-child {} @@ -133,132 +120,134 @@ selector::before {} /* matches a virtual last child of the selected element */ selector::after {} +/* At appropriate places, an asterisk may be used as a wildcard to select every + element */ +* { } /* all elements */ +.parent * { } /* all descendants */ +.parent > * { } /* all children */ + /* #################### ## PROPERTIES #################### */ selector { - - /* Units */ - width: 50%; /* in percent */ - font-size: 2em; /* times current font-size */ - width: 200px; /* in pixels */ - font-size: 20pt; /* in points */ - width: 5cm; /* in centimeters */ - min-width: 50mm; /* in millimeters */ - max-width: 5in; /* in inches. max-(width|height) */ - height: 0.2vh; /* times vertical height of browser viewport (CSS3) */ - width: 0.4vw; /* times horizontal width of browser viewport (CSS3) */ - min-height: 0.1vmin; /* the lesser of vertical, horizontal dimensions of browser viewport (CSS3) */ - max-width: 0.3vmax; /* same as above, except the greater of the dimensions (CSS3) */ - + + /* Units of length can be absolute or relative. */ + + /* Relative units */ + width: 50%; /* percentage of parent element width */ + font-size: 2em; /* multiples of element's original font-size */ + font-size: 2rem; /* or the root element's font-size */ + font-size: 2vw; /* multiples of 1% of the viewport's width (CSS 3) */ + font-size: 2vh; /* or its height */ + font-size: 2vmin; /* whichever of a vh or a vw is smaller */ + font-size: 2vmax; /* or greater */ + + /* Absolute units */ + width: 200px; /* pixels */ + font-size: 20pt; /* points */ + width: 5cm; /* centimeters */ + min-width: 50mm; /* millimeters */ + max-width: 5in; /* inches */ + /* Colors */ - background-color: #F6E; /* in short hex */ - background-color: #F262E2; /* in long hex format */ - background-color: tomato; /* can be a named color */ - background-color: rgb(255, 255, 255); /* in rgb */ - background-color: rgb(10%, 20%, 50%); /* in rgb percent */ - background-color: rgba(255, 0, 0, 0.3); /* in semi-transparent rgb (CSS3) */ - background-color: transparent; /* see thru */ - background-color: hsl(0, 100%, 50%); /* hsl format (CSS3). */ - background-color: hsla(0, 100%, 50%, 0.3); /* Similar to RGBA, specify opacity at end (CSS3) */ - - - /* Images */ - background-image: url(/path-to-image/image.jpg); /* quotes inside url() optional */ - + color: #F6E; /* short hex format */ + color: #FF66EE; /* long hex format */ + color: tomato; /* a named color */ + color: rgb(255, 255, 255); /* as rgb values */ + color: rgb(10%, 20%, 50%); /* as rgb percentages */ + color: rgba(255, 0, 0, 0.3); /* as rgba values (CSS 3) Note: 0 < a < 1 */ + color: transparent; /* equivalent to setting the alpha to 0 */ + color: hsl(0, 100%, 50%); /* as hsl percentages (CSS 3) */ + color: hsla(0, 100%, 50%, 0.3); /* as hsla percentages with alpha */ + + /* Images as backgrounds of elements */ + background-image: url(/img-path/img.jpg); /* quotes inside url() optional */ + /* Fonts */ font-family: Arial; - font-family: "Courier New"; /* if name has space it appears in single or double quotes */ - font-family: "Courier New", Trebuchet, Arial, sans-serif; /* if first one was not found - browser uses the second font, and so forth */ + /* if the font family name has a space, it must be quoted */ + font-family: "Courier New"; + /* if the first one is not found, the browser uses the next, and so on */ + font-family: "Courier New", Trebuchet, Arial, sans-serif; } - ``` ## Usage -Save any CSS you want in a file with extension `.css`. +Save a CSS stylesheet with the extension `.css`. ```xml - + - + - +
- ``` -## Precedence +## Precedence or Cascade -As you noticed an element may be targetted by more than one selector. -and may have a property set on it in more than one. -In these cases, one of the rules takes precedence over others. +An element may be targeted by multiple selectors and may have a property set on it in more than once. In these cases, one of the rules takes precedence over others. Generally, a rule in a more specific selector take precedence over a less specific one, and a rule occuring later in the stylesheet overwrites a previous one. + +This process is called cascading, hence the name Cascading Style Sheets. Given the following CSS: ```css -/*A*/ +/* A */ p.class1[attr='value'] -/*B*/ -p.class1 {} +/* B */ +p.class1 { } -/*C*/ -p.class2 {} +/* C */ +p.class2 { } -/*D*/ -p {} +/* D */ +p { } -/*E*/ +/* E */ p { property: value !important; } - ``` and the following markup: ```xml -

-

+

``` -The precedence of style is as followed: -Remember, the precedence is for each **property**, not for the entire block. +The precedence of style is as follows. Remember, the precedence is for each **property**, not for the entire block. -* `E` has the highest precedence because of the keyword `!important`. - It is recommended to avoid this unless it is strictly necessary to use. -* `F` is next, because it is inline style. -* `A` is next, because it is more "specific" than anything else. - more specific = more specifiers. here 3 specifiers: 1 tagname `p` + - class name `class1` + 1 attribute `attr='value'` -* `C` is next. although it has the same specificness as `B` - but it appears last. -* Then is `B` -* and lastly is `D`. +* `E` has the highest precedence because of the keyword `!important`. It is recommended that you avoid its usage. +* `F` is next, because it is an inline style. +* `A` is next, because it is more "specific" than anything else. It has 3 specifiers: The name of the element `p`, its class `class1`, an attribute `attr='value'`. +* `C` is next, even though it has the same specificity as `B`. This is because it appears after `B`. +* `B` is next. +* `D` is the last one. ## Compatibility -Most of the features in CSS2 (and gradually in CSS3) are compatible across -all browsers and devices. But it's always vital to have in mind the compatibility -of what you use in CSS with your target browsers. +Most of the features in CSS 2 (and many in CSS 3) are available across all browsers and devices. But it's always good practice to check before using a new feature. -[QuirksMode CSS](http://www.quirksmode.org/css/) is one of the best sources for this. +## Resources -To run a quick compatibility check, [Can I Use...](http://caniuse.com) is a great resource. +* To run a quick compatibility check, [CanIUse](http://caniuse.com). +* CSS Playground [Dabblet](http://dabblet.com/). +* [Mozilla Developer Network's CSS documentation](https://developer.mozilla.org/en-US/docs/Web/CSS) +* [Codrops' CSS Reference](http://tympanus.net/codrops/css_reference/) ## Further Reading -* [Mozilla Developer Network's CSS documentation](https://developer.mozilla.org/en-US/docs/Web/CSS) -* [Codrops' CSS Reference](http://tympanus.net/codrops/css_reference/) * [Understanding Style Precedence in CSS: Specificity, Inheritance, and the Cascade](http://www.vanseodesign.com/css/css-specificity-inheritance-cascaade/) +* [Selecting elements using attributes](https://css-tricks.com/almanac/selectors/a/attribute/) * [QuirksMode CSS](http://www.quirksmode.org/css/) * [Z-Index - The stacking context](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Understanding_z_index/The_stacking_context) -* [SCSS](http://sass-lang.com/) and [LESS](http://lesscss.org/) for CSS pre-processing +* [SASS](http://sass-lang.com/) and [LESS](http://lesscss.org/) for CSS pre-processing +* [CSS-Tricks](https://css-tricks.com) diff --git a/es-es/visualbasic-es.html.markdown b/es-es/visualbasic-es.html.markdown new file mode 100644 index 00000000..c7f581c0 --- /dev/null +++ b/es-es/visualbasic-es.html.markdown @@ -0,0 +1,286 @@ +--- +language: Visual Basic +contributors: + - ["Brian Martin", "http://brianmartin.biz"] +translators: + - ["Adolfo Jayme Barrientos", "https://github.com/fitojb"] +author: Brian Martin +author_url: https://github.com/fitojb +filename: learnvisualbasic-es.vb +lang: es-es +--- + +```vb +Module Module1 + + Sub Main() + ' Un vistazo rápido a las aplicaciones de consola de Visual Basic antes + ' de que profundicemos en el tema. + ' El apóstrofo inicia una línea de comentario. + ' Para explorar este tutorial dentro del Compilador de Visual Basic, + ' he creado un sistema de navegación. + ' Dicho sistema se explicará a medida que avancemos en este + ' tutorial; gradualmente entenderás lo que significa todo. + Console.Title = ("Aprende X en Y minutos") + Console.WriteLine("NAVEGACIÓN") 'Mostrar + Console.WriteLine("") + Console.ForegroundColor = ConsoleColor.Green + Console.WriteLine("1. Salida «Hola, mundo»") + Console.WriteLine("2. Entrada «Hola, mundo»") + Console.WriteLine("3. Calcular números enteros") + Console.WriteLine("4. Calcular números decimales") + Console.WriteLine("5. Una calculadora funcional") + Console.WriteLine("6. Uso de bucles «Do While»") + Console.WriteLine("7. Uso de bucles «For While»") + Console.WriteLine("8. Declaraciones condicionales") + Console.WriteLine("9. Selecciona una bebida") + Console.WriteLine("50. Acerca de") + Console.WriteLine("Elige un número de la lista anterior") + Dim selection As String = Console.ReadLine + Select Case selection + Case "1" 'Salida «hola, mundo» + Console.Clear() 'Limpia la consola y abre la subrutina privada + SalidaHolaMundo() 'Abre la subrutina privada nombrada + Case "2" 'Entrada «hola, mundo» + Console.Clear() + EntradaHolaMundo() + Case "3" 'Calcular números enteros + Console.Clear() + CalcularNumerosEnteros() + Case "4" 'Calcular números decimales + Console.Clear() + CalcularNumerosDecimales() + Case "5" 'Una calculadora funcional + Console.Clear() + CalculadoraFuncional() + Case "6" 'Uso de bucles «Do While» + Console.Clear() + UsoBuclesDoWhile() + Case "7" 'Uso de bucles «For While» + Console.Clear() + UsoBuclesFor() + Case "8" 'Declaraciones condicionales + Console.Clear() + DeclaracionCondicional() + Case "9" 'Declaración «If/Else» + Console.Clear() + DeclaracionIfElse() 'Selecciona una bebida + Case "50" 'Cuadro de mensaje «Acerca de» + Console.Clear() + Console.Title = ("Aprende X en Y minutos :: Acerca de") + MsgBox("Tutorial escrito por Brian Martin (@BrianMartinn") + Console.Clear() + Main() + Console.ReadLine() + + End Select + End Sub + + 'Uno - He usado números para guiarme por el sistema de navegación anterior + 'cuando regrese posteriormente a implementarlo. + + 'Usamos subrutinas privadas para separar distintas secciones del programa. + Private Sub SalidaHolaMundo() + 'Título de la aplicación de consola + Console.Title = "Salida «Hola, mundo» | Aprende X en Y minutos" + 'Usa Console.Write("") o Console.WriteLine("") para mostrar salidas. + 'Seguido por Console.Read(), o bien, Console.Readline() + 'Console.ReadLine() muestra la salida en la consola. + Console.WriteLine("Hola, mundo") + Console.ReadLine() + End Sub + + 'Dos + Private Sub EntradaHolaMundo() + Console.Title = "«Hola, mundo, soy...» | Aprende X en Y minutos" + ' Variables + ' Los datos que introduzca un usuario deben almacenarse. + ' Las variables también empiezan por Dim y terminan por As VariableType. + + ' En este tutorial queremos conocer tu nombre y hacer que el programa + ' responda a este. + Dim nombredeusuario As String + 'Usamos «string» porque es una variable basada en texto. + Console.WriteLine("Hola, ¿cómo te llamas? ") 'Preguntar nombre de usuario. + nombredeusuario = Console.ReadLine() 'Almacenar nombre del usuario. + Console.WriteLine("Hola, " + nombredeusuario) 'La salida es Hola, nombre + Console.ReadLine() 'Muestra lo anterior. + 'El código anterior te hará una pregunta y mostrará la respuesta. + 'Entre otras variables está Integer, la cual usaremos para números enteros. + End Sub + + 'Tres + Private Sub CalcularNumerosEnteros() + Console.Title = "Calcular números enteros | Aprende X en Y minutos" + Console.Write("Primer número: ") 'Escribe un núm. entero, 1, 2, 104, etc + Dim a As Integer = Console.ReadLine() + Console.Write("Segundo número: ") 'Escribe otro número entero. + Dim b As Integer = Console.ReadLine() + Dim c As Integer = a + b + Console.WriteLine(c) + Console.ReadLine() + 'Lo anterior es una calculadora sencilla + End Sub + + 'Cuatro + Private Sub CalcularNumerosDecimales() + Console.Title = "Calcular con tipo doble | Aprende X en Y minutos" + 'Por supuesto, nos gustaría sumar decimales. + 'Por ello podríamos cambiar del tipo Integer al Double. + + 'Escribe un número fraccionario, 1.2, 2.4, 50.1, 104.9 etc + Console.Write("Primer número: ") + Dim a As Double = Console.ReadLine + Console.Write("Segundo número: ") 'Escribe el segundo número. + Dim b As Double = Console.ReadLine + Dim c As Double = a + b + Console.WriteLine(c) + Console.ReadLine() + 'Este programa puede sumar 1.1 y 2.2 + End Sub + + 'Cinco + Private Sub CalculadoraFuncional() + Console.Title = "La calculadora funcional | Aprende X en Y minutos" + 'Pero si quieres que la calculadora reste, divida, multiplique y + 'sume. + 'Copia y pega lo anterior. + Console.Write("Primer número: ") + Dim a As Double = Console.ReadLine + Console.Write("Segundo número: ") + Dim b As Integer = Console.ReadLine + Dim c As Integer = a + b + Dim d As Integer = a * b + Dim e As Integer = a - b + Dim f As Integer = a / b + + 'Mediante las líneas siguientes podremos restar, + 'multiplicar y dividir los valores a y b + Console.Write(a.ToString() + " + " + b.ToString()) + 'Queremos dar un margen izquierdo de 3 espacios a los resultados. + Console.WriteLine(" = " + c.ToString.PadLeft(3)) + Console.Write(a.ToString() + " * " + b.ToString()) + Console.WriteLine(" = " + d.ToString.PadLeft(3)) + Console.Write(a.ToString() + " - " + b.ToString()) + Console.WriteLine(" = " + e.ToString.PadLeft(3)) + Console.Write(a.ToString() + " / " + b.ToString()) + Console.WriteLine(" = " + f.ToString.PadLeft(3)) + Console.ReadLine() + + End Sub + + 'Seis + Private Sub UsoBuclesDoWhile() + 'Igual que la subrutina privada anterior + 'Esta vez preguntaremos al usuario si quiere continuar (¿sí o no?) + 'Usamos el bucle Do While porque no sabemos si el usuario quiere + 'usar el programa más de una vez. + Console.Title = "Uso de bucles «Do While» | Aprende X en Y minutos" + Dim respuesta As String 'Usamos la variable «String» porque la resp. es texto + Do 'Comenzamos el programa con + Console.Write("Primer número: ") + Dim a As Double = Console.ReadLine + Console.Write("Segundo número: ") + Dim b As Integer = Console.ReadLine + Dim c As Integer = a + b + Dim d As Integer = a * b + Dim e As Integer = a - b + Dim f As Integer = a / b + + Console.Write(a.ToString() + " + " + b.ToString()) + Console.WriteLine(" = " + c.ToString.PadLeft(3)) + Console.Write(a.ToString() + " * " + b.ToString()) + Console.WriteLine(" = " + d.ToString.PadLeft(3)) + Console.Write(a.ToString() + " - " + b.ToString()) + Console.WriteLine(" = " + e.ToString.PadLeft(3)) + Console.Write(a.ToString() + " / " + b.ToString()) + Console.WriteLine(" = " + f.ToString.PadLeft(3)) + Console.ReadLine() + 'Preguntar si el usuario quiere continuar. Desafortunadamente, + 'distingue entre mayúsculas y minúsculas. + Console.Write("¿Quieres continuar? (s / n)") + 'El programa toma la variable, la muestra y comienza de nuevo. + respuesta = Console.ReadLine + 'La orden que hará funcionar esta variable es en este caso «s» + Loop While respuesta = "s" + + End Sub + + 'Siete + Private Sub UsoBuclesFor() + 'A veces el programa debe ejecutarse solo una vez. + 'En este programa contaremos a partir de 10. + + Console.Title = "Uso de bucles «For» | Aprende X en Y minutos" + 'Declarar Variable y desde qué número debe contar en Step -1, + 'Step -2, Step -3, etc. + For i As Integer = 10 To 0 Step -1 + Console.WriteLine(i.ToString) 'Muestra el valor del contador + Next i 'Calcular el valor nuevo + Console.WriteLine("Iniciar") '¡¡Comencemos el programa, nene!! + Console.ReadLine() '¡¡ZAS!! - Quizá me he emocionado bastante :) + End Sub + + 'Ocho + Private Sub DeclaracionCondicional() + Console.Title = "Declaraciones condicionales | Aprende X en Y minutos" + Dim nombredeUsuario As String = Console.ReadLine + Console.WriteLine("Hola, ¿cómo te llamas? ") 'Preguntar nombre de usuario. + nombredeUsuario = Console.ReadLine() 'Almacena el nombre de usuario. + If nombredeUsuario = "Adam" Then + Console.WriteLine("Hola, Adam") + Console.WriteLine("Gracias por crear este útil sitio web") + Console.ReadLine() + Else + Console.WriteLine("Hola, " + nombredeUsuario) + Console.WriteLine("¿Has visitado www.learnxinyminutes.com?") + Console.ReadLine() 'Termina y muestra la declaración anterior. + End If + End Sub + + 'Nueve + Private Sub DeclaracionIfElse() + Console.Title = "Declaración «If / Else» | Aprende X en Y minutos" + 'A veces es importante considerar más de dos alternativas. + 'A veces, algunas de estas son mejores. + 'Cuando esto sucede, necesitaríamos más de una declaración «if». + 'Una declaración «if» es adecuada para máquinas expendedoras. + 'En las que el usuario escribe un código (A1, A2, A3) para elegir. + 'Pueden combinarse todas las elecciones en una sola declaración «if». + + Dim seleccion As String = Console.ReadLine 'Valor de la selección + Console.WriteLine("A1. para 7Up") + Console.WriteLine("A2. para Fanta") + Console.WriteLine("A3. para Dr. Pepper") + Console.WriteLine("A4. para Coca-Cola") + Console.ReadLine() + If selection = "A1" Then + Console.WriteLine("7up") + Console.ReadLine() + ElseIf selection = "A2" Then + Console.WriteLine("fanta") + Console.ReadLine() + ElseIf selection = "A3" Then + Console.WriteLine("dr. pepper") + Console.ReadLine() + ElseIf selection = "A4" Then + Console.WriteLine("coca-cola") + Console.ReadLine() + Else + Console.WriteLine("Selecciona un producto") + Console.ReadLine() + End If + + End Sub + +End Module + +``` + +## Referencias + +Aprendí Visual Basic en la aplicación de consola. Esta me permitió entender los principios de la programación para, posteriormente, aprender otros lenguajes con facilidad. + +He creado un tutorial de Visual Basic más exhaustivo para quienes quieran saber más. + +Toda la sintaxis es válida. Copia el código y pégalo en el compilador de Visual Basic y ejecuta (F5) el programa. diff --git a/fr-fr/haml-fr.html.markdown b/fr-fr/haml-fr.html.markdown new file mode 100644 index 00000000..0267a380 --- /dev/null +++ b/fr-fr/haml-fr.html.markdown @@ -0,0 +1,156 @@ +--- +language: haml +filename: learnhaml.haml +contributors: + - ["Simon Neveu", "https://github.com/sneveu"] + - ["Thibault", "https://github.com/iTech-"] +--- + +Haml est un langage de balisage utilisé majoritairement avec Ruby, qui décrit de manière simple et propre le HTML de n'importe quelle page web sans l'utilisation des traditionnelles lignes de code. Le langage est une alternative très populaire au langage de templates Rails (.erb) et permet d'intégrer du code en Ruby dans votre balisage. + +Son but est de réduire le nombre de répétitions dans le balisage en fermant des balises pour vous en se basant sur l'indentation de votre code. Finalement, le balisage est bien structuré, ne contient pas de répétition, est logique et facile à lire. + +Vous pouvez aussi utiliser Haml sur un projet indépendant de Ruby, en installant les gems de Haml et en le convertissant en html grâce aux commandes. + +$ haml fichier_entree.haml fichier_sortie.html + + +```haml +/ ------------------------------------------- +/ Indentation +/ ------------------------------------------- + +/ + A cause de l'importance de l'indentation sur la manière dont votre code sera + converti, l'indentation doit être constante à travers votre document. Un + simple changement d'indentation entrainera une erreur. En général, on utilise + deux espaces, mais ce genre de décision sur l'indentation vous appartient, du + moment que vous vous y tenez. + +/ ------------------------------------------- +/ Commentaires +/ ------------------------------------------- + +/ Ceci est un commentaire en Haml. + +/ + Pour écrire un commentaire sur plusieurs lignes, indentez votre code + commenté en le commençant par un slash + +-# Ceci est un commentaire silencieux, qui n'apparaîtra pas dans le fichier + + +/ ------------------------------------------- +/ Eléments HTML +/ ------------------------------------------- + +/ Pour écrire vos balises, utilisez un pourcentage suivi du nom de votre balise +%body + %header + %nav + +/ Remarquez qu'il n'y a aucunes balises fermées. Le code produira alors ceci + +

+ +
+ + +/ La balise div est l'élément par défaut, vous pouvez donc l'écrire comme ceci +.balise + +/ Pour ajouter du contenu à votre balise, ajoutez le texte après sa déclaration +%h1 Titre contenu + +/ Pour écrire du contenu sur plusieurs lignes, imbriquez le +%p + Ce paragraphe contient beaucoup de contenu qui pourrait + probablement tenir sur deux lignes séparées. + +/ + Vous pouvez utiliser des caractères html spéciaux en utilisant &=. Cela va + convertir les caractères comme &, /, : en leur équivalent HTML. Par exemple + +%p + &= "Oui & oui" + +/ Produira 'Oui & oui' + +/ Vous pouvez écrire du contenu html sans qu'il soit converti en utilisant != +%p + != "Voici comment écrire une balise de paragraphe

" + +/ Cela produira 'Voici comment écrire une balise de paragraphe

' + +/ Une classe CSS peut être ajouté à votre balise en chainant le nom de la classe +%div.truc.machin + +/ ou en utilisant un hash de Ruby +%div{:class => 'truc machin'} + +/ Des attributs pour n'importe quelles balises peuvent être ajoutés au hash +%a{:href => '#', :class => 'machin', :title => 'Titre machin'} + +/ Pour affecter une valeur à un booléen, utilisez 'true' +%input{:selected => true} + +/ Pour écrire des data-attributes, utilisez le :data avec la valeur d'un hash +%div{:data => {:attribute => 'machin'}} + + +/ ------------------------------------------- +/ Insérer du Ruby +/ ------------------------------------------- + +/ + Pour transférer une valeur de Ruby comme contenu d'une balise, utilisez le + signe égal suivi du code Ruby + +%h1= livre.titre + +%p + = livre.auteur + = livre.editeur + + +/ Pour lancer du code Ruby sans le convertir en HTML, utilisez un trait d'union +- livres = ['livre 1', 'livre 2', 'livre 3'] + +/ Ceci vous permet de faire des choses géniales comme des blocs Ruby +- livre.shuffle.each_with_index do |livre, index| + %h1= livre + + if livre do + %p Ceci est un livre + +/ + Encore une fois il n'est pas nécessaire d'ajouter une balise fermante, même + pour Ruby. + L'indentation le fera pour vous. + + +/ ------------------------------------------- +/ Ruby en-ligne / Interpolation en Ruby +/ ------------------------------------------- + +/ Inclure une variable Ruby dans une ligne en utilisant #{} +%p Votre meilleur score est #{record} + + +/ ------------------------------------------- +/ Filtres +/ ------------------------------------------- + +/ + Utilisez les deux points pour définir un filtre Haml, vous pouvez par exemple + utiliser un filtre :javascript pour écrire du contenu en-ligne js + +:javascript + console.log('Ceci est la balise en-ligne