Enjoyed this channel? Join my Locals community for exclusive content at
nbktechworld.locals.com!
Click Event and JavaScript Function to Change CSS Style
Learn how to handle click events on an HTML element using a JavaScript function. The lecture goes over how to change the CSS styles of an element when you click it.
You can add an onclick attribute to an HTML element to do something when it is clicked. The value of the attribute is the name of a function followed by parentheses.
A function is a set of instructions that can be executed when its name is called with parentheses.
One way of defining a function in JavaScript is by preceding its name with the function keyword. Any input parameters are contained within the parentheses. Write the statements after the open curly brace and before the corresponding closing curly brace.
Using JavaScript to Change CSS Properties of an HTML Element
Learn how to use the JavaScript programming language to change the Cascading Style Sheets (CSS) properties of an HTML element.
In particular, you learn how to change the text color and the background color of an element, after having found it on the document by its id attribute.
9
views
1
comment
How to Write SQL to Group By Column and Using Distinct
Learn how to use Structured Query Language (SQL) to group rows by a certain column.
In particular, you learn how to use the GROUP BY statement to consolidate rows grouped by a certain column value. You also learn how to a similar thing using the DISTINCT keyword preceding the column name.
6
views
How to Count Rows in SQL and Renaming Result Column with Alias
Learn how to use Structured Query Language (SQL) to count the number of rows in a database table.
In particular, you learn how to use the COUNT function to find out the number of rows found with your query. You also learn how to alias a column name with the AS keyword.
9
views
1
comment
How to Combine SQL Tables Data Together with an Inner Join
Learn how to use Structured Query Language (SQL) to combine matching data from two separate tables.
In particular, you learn how to match rows in one table with rows in another, going by the foreign key in one table pointing to the primary key of another table. You learn the Inner Join kind.
7
views
1
comment
SQL Update Table Set Value Where Condition
Learn how to use Structured Query Language (SQL) to update database records.
In particular, you learn how to use the UPDATE statement to set a particular column value for the rows in the database.
For most cases, you usually specify a WHERE clause to narrow down to a specific row. Otherwise, you would end up changing many, if not all, rows in the table by accident.
7
views
Delete Row from SQL Database Table
Learn how to use Structured Query Language (SQL) to delete records from a database.
In particular, the lesson teaches you the DELETE FROM statement with a WHERE clause to delete a row by the primary key identifier column.
It is important to be very careful going about deleting records, so for most cases, make sure to always add a WHERE clause matching the value of a unique column, since you know only one row will be deleted versus potentially deleted unwanted records by mistake.
Answering Questions About SQL (Id Primary Key, Varchar, Sorting)
Students ask some questions related to Structured Query Language (SQL) and get a response.
Is id always the primary key without specifying it?
What is VARCHAR(100)?
How to sort data in a specific order, ascending or descending?
1
view
Populating a SQL Database Table with New Data
Learn how to use Structured Query Language (SQL) to insert new rows into a table with a set of given column values.
You can also use SQL to add new data to a table. The lecture goes over the insert statement so you can populate a table with new rows.
You first learn the implicit way, then you learn the explicit way that requires you specify every column name in the table.
Along the way you are also exposed to the UNIQUE constraint that can be set on a specific column to prevent duplicate rows with the same column value. Primary key columns usually have that unique constraint.
4
views
How to Retrieve Filtered Data Using SQL WHERE Clause
Learn how to use Structured Query Language (SQL) to select rows from a table using a filter that matches a certain condition.
You are introduced to the WHERE clause to narrow down the result rows in a query. You can specify the column name, a comparison operator, and the desired value.
You also learn that you can narrow down even more with more conditions using the AND keyword. Later you are also briefly exposed to its counterpart OR keyword.
4
views
1
comment
How to Retrieve Data Using SQL with Select Query
Learn how to access data using Structured Query Language (SQL).
In particular, learn how to retrieve data from tables using SELECT. You learn to select all columns as well as specific ones. You also learn to eliminate duplicates with the DISTINCT keyword preceding the column name.
3
views
Brief Introduction to Structured Query Language (SQL)
The lecture introduces you to Structured Query Language (SQL) that is used to interface with a relational database management system (RDBMS).
You learn that information from websites and web applications are ultimately stored in a database, so they persist as you come back to the website at a later time.
You learn that the database can have many tables to store different resources. Each table has columns that are attributes of a specific object. Those objects are presented as rows.
In the example, there is a table of customers. Each row represents a customer. Each column represents a piece of information about that customer. For example, the column first_name stores the customer's first name.
There are many implementations of SQL out there. Many companies have built their own flavor. For example: MySQL, MariaDB, SQLite, PostgreSQL, Microsoft SQL Server, Oracle Database, IBM DB2, etc. But so long as you learn standard SQL, you can easily run queries for any of those specific implementations.
4
views
1
comment
Introduction to SQL - Software School (2024-03-07)
Get introduced to Structured Query Language (SQL) to interface with relational database management systems (RDBMS).
The lecture uses Programiz Online SQL Editor to practice the examples.
You learn how databases have tables for different resources. Each table has a definition of columns that are used to define the attributes of an object. Each object is represented by a row in the table. Think about Microsoft Excel or Google Sheets spreadsheets, where you have columns and rows.
You first learn how to retrieve data from tables using SELECT. You learn to select all columns as well as specific ones. You also learn to eliminate duplicates with the DISTINCT keyword preceding the column name.
You learn to narrow down and filter rows by specifying conditions with WHERE.
The lecture goes on to show you how you can insert data into a table.
You also briefly learn how to order rows by a column.
Then you learn how to delete rows with DELETE.
The lecture also shows you how to modify records with UPDATE.
You learn to combine tables together with a JOIN.
You also learn how to count rows and add an alias to a column.
You briefly see how you can also group rows by a specific column.
7
views
1
comment
Box Shadow CSS Property and Referencing MDN Documentation
The lecture presents you the CSS property to add a box shadow.
You see that the property can take multiple values instead of just one. Simply separate them by a whitespace.
You learn to calibrate the values for the property using the browser developer tools (DevTools).
Note that for the text example in the video, it is better to use the text shadow property, so that is why it looks a bit weird. Box shadow would look nice if the example text in the video was presented as a button with border, rounded border, and padding.
You also learn to look up documentation for the CSS property to understand the different ways you can specify the values. In particular, we look at the docs website for the Mozilla Developer Network (MDN).
5
views
Adding a Text Shadow with CSS
This lecture teaches you how to create a text shadow with Cascading Style Sheets (CSS).
You learn that a CSS property can have more than one value, each separated from the other by a whitespace.
The lecture shows how you can calibrate the text shadow using the browser developer tools (DevTools).
5
views
Styling with CSS by Id and Class Selectors plus Bootstrap Button Example
The lecture shows you how to select an HTML element for styling with CSS using its id or class attribute instead of using the type selector that targets all elements of a specific name.
Using a type selector is usually not the best practice because HTML web pages usually have hundreds of elements and changing all of them at once to comfort to a specific style might cause inconsistencies in the design.
You can select a specific element for styling with CSS using its id attribute. Only one, and only one, element may have that unique identifier.
If you need to select multiple elements for styling under the same ruleset, you can use the class attribute. It turns out using a class is usually the most popular and safe choice for best practice. When in doubt, just use a class.
The lecture also gives the example of leveraging CSS code already written by somebody else, like the Bootstrap design system. Because the class definitions are already written for you, all you have to do is use the class name if you want to adopt the same style for your web page element, provided you link the Bootstrap spreadsheet to make it available in your document.
15
views
1
comment
CSS Color Values with Hex Code and RGB
The lecture introduces you to another way of specifying a color in CSS.
Previously you learned that you can specify the color name, like red, green, or blue. But there are other ways of defining a color value, like using the hex value or the rgb value.
The hexadecimal value (aka hex) is a value that ranges from 0 to 255 in base 10, but is written in base 16 ranging from 0 to ff. That's why it's called hexadecimal, because one digit can have 16 different characters. It goes from the usual 0 to 9, then after that is goes using the letters a through f.
For the specific case of color hex codes, there are usually six digits. The first two digits are the value for the Red. The middle two digits are the values for the Green. The last two digits are the value for the Blue. Hence the abbreviation RGB whenever you need to compose those three colors to build any one color. For CSS, the hex value is always prefixed with a hash or pound sign.
You can also specify color values using base-10 RGB by saying rgb followed by parentheses. Inside the parentheses you write the values for RGB, separated by a comma. For example, for the Red value, instead of writing ff in hexadecimal, you would write 255 in decimal.
To show the red color, simply use value 255 for Red, 0 for Green, and 0 for Blue.
To show the green color, simply use value 0 for Red, 255 for Green, and 0 for Blue.
To show the blue color, simply use value 0 for Red, 0 for Green, and 255 for Blue.
8
views
2
comments
Changing CSS Font Size, Family, and Weight
The lecture teaches you how to use Cascading Style Sheets (CSS) to change properties related to the font of an HTML element.
In particular, you learn how to change the font size, its family (the typeface), and the weight (i.e. making it bold).
5
views
1
comment
Debugging CSS in Real Time with DevTools
The lecture starts off teaching you a way to discover new CSS properties.
Then you get introduced to the browser Developer Tools, usually called the DevTools. You learn that you can right-click to inspect an element on the page.
You can select an element and see its CSS properties on the side.
You can click the color circle to pick a different color and see the changes in real time.
You can select an element and specify new CSS properties under the element and braces section.
You can use the checkboxes next to the property name to see what it looks like before and after that property is applied.
You can use the DevTools to provide you suggestions for property names as you start typing characters. The DevTools also provides suggestions for the value of the property, so you can go through them and see which one suits better your use case.
Students ask questions in the end.
5
views
1
comment
CSS properties for Background Color and Text Alignment
The lecture teaches you how to change the background color of a paragraph element. You also learn how to change the text alignment so the paragraph text becomes centered.
4
views
1
comment
Introduction to CSS - Styling Paragraphs
Get started with Cascading Styling Sheets (CSS), using the JSFiddle platform.
In a previous session, HyperText Markup Language (HTML) was introduced to define the structure of a website document. This lecture goes over changing the styling and visuals of a page.
The lesson shows you how to style paragraph elements. You learn the syntax to select elements for styling. You learn to use an element name selector to change the text color CSS property.
6
views
1
comment
Showing a Login Form in HTML for Users to Sign In
The lecture gives a brief introduction to HTML forms and teaches how to build a simple sign in or login form.
Learn how to make a single-line text field input.
Then learn how to hide the characters with password type.
Then learn how to pick a date.
Then learn how to show a button.
Learn about the label tag.
Learn how to group form controls.
Learn how to create an email text field.
Learn how to create multiline text fields.
Learn how to associate a label with an input.
Learn about the placeholder attribute.
12
views
1
comment
Showing Images in HTML with the IMG Tag
Learn how to display images in an HTML document.
Learn about the img tag and its src attribute.
You are also introduced to the alt attribute for the image element. That attribute is useful for accessibility. Screen readers read it out loud so visually-impaired users can still understand the content of a website.
9
views
1
comment
Showing Links in HTML with the Anchor Tag
Learn how to display a link that goes to another page.
You learn about the HTML anchor tag.
You also learn how to open the URL in a new tab (traditionally a new window).
11
views
1
comment
Writing a Bullet Point List and Numbered List in HTML
The lesson goes over how to create a bulleted list in HTML. In particular, it uses the unordered list element ul.
You also learn about list item elements and how they need to be nested inside the list elements.
At the end you learn to make a numbered list using the ordered list element. You find out it is as easy as renaming the ul to ol.
17
views
2
comments