1626838267
DevOps has become the go-to standard for software development.
This is simply because of its potential in facilitating the development of high-quality software at faster rates, ensuring that customer requirements are met steadfast.
DevOps principles have also been pivotal in seamlessly fusing the functions of development and operations teams as a singular entity rather than two diverse silos.
To leverage the many advantages that it can bring to the software development process, it is important to treat DevOps as a journey and not a destination unto itself. This essentially means gathering feedback, creating benchmarks, and continually measuring results to track progress.
#devops
1659063683
Create a cocktail app where the user can search a cocktail of choice and the app displays the ingredients and instructions to make the cocktail. We use 'The Cocktail DB' API to fetch information required for our app.
Before we start coding let us take look at the project folder structure. We create a project folder called – ‘Cocktail App’. Inside this folder, we have three files. These files are index.html, style.css and script.js.
We start with the HTML code. First, copy the code below and paste it into your HTML document.
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Cocktail App</title>
<!-- Google Font -->
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap"
rel="stylesheet"
/>
<!-- Stylesheet -->
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<div class="search-container">
<input
type="text"
placeholder="Type a cocktail name..."
id="user-inp"
value="margarita"
/>
<button id="search-btn">Search</button>
</div>
<div id="result"></div>
</div>
<!-- Script -->
<script src="script.js"></script>
</body>
</html>
Next, we style this app using CSS. For this copy, the code provided to you below and paste it into your stylesheet.
* {
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: "Poppins", sans-serif;
}
body {
height: 100vh;
background: linear-gradient(#5372f0 50%, #000000 50%);
}
.container {
position: absolute;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
width: 90vw;
max-width: 37.5em;
background-color: #ffffff;
padding: 1.8em;
border-radius: 0.6em;
box-shadow: 0 1em 3em rgba(2, 9, 38, 0.25);
}
.search-container {
display: grid;
grid-template-columns: 9fr 3fr;
gap: 1em;
margin-bottom: 1.2em;
}
.search-container input {
font-size: 1em;
padding: 0.6em 0.3em;
border: none;
outline: none;
color: #1f194c;
border-bottom: 1.5px solid #1f194c;
}
.search-container input:focus {
border-color: #5372f0;
}
.search-container button {
font-size: 1em;
border-radius: 2em;
background-color: #5372f0;
border: none;
outline: none;
color: #ffffff;
cursor: pointer;
}
#result {
color: #575a7b;
line-height: 2em;
}
#result img {
display: block;
max-width: 12.5em;
margin: auto;
}
#result h2 {
font-size: 1.25em;
margin: 0.8em 0 1.6em 0;
text-align: center;
text-transform: uppercase;
font-weight: 600;
letter-spacing: 0.05em;
color: #1f194c;
position: relative;
}
#result h2:before {
content: "";
position: absolute;
width: 15%;
height: 3px;
background-color: #5372f0;
left: 42.5%;
bottom: -0.3em;
}
#result h3 {
font-size: 1.1em;
font-weight: 600;
margin-bottom: 0.2em;
color: #1f194c;
}
#result ul {
margin-bottom: 1em;
margin-left: 1.8em;
display: grid;
grid-template-columns: auto auto;
}
#result li {
margin-bottom: 0.3em;
}
#result p {
text-align: justify;
font-weight: 400;
font-size: 0.95em;
}
.msg {
text-align: center;
}
@media screen and (max-width: 600px) {
.container {
font-size: 14px;
}
}
Lastly, we implement the functionality using Javascript. Now copy the code below and paste it into your script file.
let result = document.getElementById("result");
let searchBtn = document.getElementById("search-btn");
let url = "https://thecocktaildb.com/api/json/v1/1/search.php?s=";
let getInfo = () => {
let userInp = document.getElementById("user-inp").value;
if (userInp.length == 0) {
result.innerHTML = `<h3 class="msg">The input field cannot be empty</h3>`;
} else {
fetch(url + userInp)
.then((response) => response.json())
.then((data) => {
document.getElementById("user-inp").value = "";
console.log(data);
console.log(data.drinks[0]);
let myDrink = data.drinks[0];
console.log(myDrink.strDrink);
console.log(myDrink.strDrinkThumb);
console.log(myDrink.strInstructions);
let count = 1;
let ingredients = [];
for (let i in myDrink) {
let ingredient = "";
let measure = "";
if (i.startsWith("strIngredient") && myDrink[i]) {
ingredient = myDrink[i];
if (myDrink[`strMeasure` + count]) {
measure = myDrink[`strMeasure` + count];
} else {
measure = "";
}
count += 1;
ingredients.push(`${measure} ${ingredient}`);
}
}
console.log(ingredients);
result.innerHTML = `
<img src=${myDrink.strDrinkThumb}>
<h2>${myDrink.strDrink}</h2>
<h3>Ingredients:</h3>
<ul class="ingredients"></ul>
<h3>Instructions:</h3>
<p>${myDrink.strInstructions}</p>
`;
let ingredientsCon = document.querySelector(".ingredients");
ingredients.forEach((item) => {
let listItem = document.createElement("li");
listItem.innerText = item;
ingredientsCon.appendChild(listItem);
});
})
.catch(() => {
result.innerHTML = `<h3 class="msg">Please enter a valid input</h3>`;
});
}
};
window.addEventListener("load", getInfo);
searchBtn.addEventListener("click", getInfo);
📁 Download Source Code: https://www.codingartistweb.com
#html #css #javascript
1602401329
DevOps and Cloud computing are joined at the hip, now that fact is well appreciated by the organizations that engaged in SaaS cloud and developed applications in the Cloud. During the COVID crisis period, most of the organizations have started using cloud computing services and implementing a cloud-first strategy to establish their remote operations. Similarly, the extended DevOps strategy will make the development process more agile with automated test cases.
According to the survey in EMEA, IT decision-makers have observed a 129%* improvement in the overall software development process when performing DevOps on the Cloud. This success result was just 81% when practicing only DevOps and 67%* when leveraging Cloud without DevOps. Not only that, but the practice has also made the software predictability better, improve the customer experience as well as speed up software delivery 2.6* times faster.
3 Core Principle to fit DevOps Strategy
If you consider implementing DevOps in concert with the Cloud, then the
below core principle will guide you to utilize the strategy.
Guide to Remold Business with DevOps and Cloud
Companies are now re-inventing themselves to become better at sensing the next big thing their customers need and finding ways with the Cloud based DevOps to get ahead of the competition.
#devops #devops-principles #azure-devops #devops-transformation #good-company #devops-tools #devops-top-story #devops-infrastructure
1603177200
DevOps is supposed to help streamline the process of taking code changes and getting them to production for users to enjoy. But what exactly does it mean for the process to be “streamlined”? One way to answer this is to start measuring metrics.
Metrics give us a way to make sure our quality stays the same over time because we have numbers and key identifiers to compare against. Without any metrics being measured, you don’t have a way to measure improvements or regressions. You just have to react to them as they come up.
When you know the indicators that show what condition your system is in, it lets you catch issues faster than if you don’t have a steady-state to compare to. This also helps when you get ready for system upgrades. You’ll be able to give more accurate estimates of the number of resources your systems use.
After you’ve recorded some key metrics for a while, you’ll start noticing places you could improve your application or ways you can reallocate resources to where they are needed more. Knowing the normal operating state of your system’s pipeline is crucial and it takes time to set up a monitoring tool.
The main thing is that you decide to watch some metrics to get an idea of what’s going on when you start the deploy process. In the beginning, it might seem hard to figure out what the best metrics for a pipeline are.
You can conduct chaos engineering experiments to test different conditions and learn more about which metrics are the most important to your system. You can look at things like, time from build to deploy, number of bugs that get caught in different phases of the pipeline, and build size.
Thinking about what you should measure can be one of the harder parts of the effectiveness of the metrics you choose. When you’re considering metrics, look at what the most important results of your pipeline are.
Do you need your app to get through the process as quickly as possible, regardless of errors? Can you figure out why that sporadic issue keeps stopping the deploy process? What’s blocking you from getting your changes to production with confidence?
That’s how you’re going to find those key metrics quickly. Running experiments and looking at common deploy problems will show you what’s important early on. This is one of the ways you can make sure that your metrics are relevant.
#devops #devops-principles #devops-tools #devops-challenges #devops-adoption-challenges #devops-adoption #continuous-deployment #continuous-integration
1600351200
Once an industry term becomes popular, particularly in technology, it can be difficult to get an accurate definition. Everyone assumes that the basics are common knowledge and moves on. However, if your company has been discussing DevOps, or if you are interested in learning more about it, here are some basics you should know.
DevOps refers to the restructuring of the traditional software application cycle to support Agile development and continuous improvement/continuous delivery. Traditionally, the software was created in large-scale, monolithic bundles. New features and new releases were created in large packages and released in full-scale, infrequent, major deployments.
This structure is no longer effective in the modern business environment. Companies are under increasing pressure to be agile. They must respond rapidly to changes in the business environment to remain competitive. Software development needs to be completely changed as a process so that incremental improvements can be made frequently – ideally, several times per day.
However, changing a development lifecycle completely requires major changes – in people and culture, process, and enabling tooling – to be effective. DevOps was created by the breaking down of cycles between development and operations, combining two separate functions in application development. These changes intend to support agile, secure, continuous improvements, and frequent releases.
#devops #devops adoption #devops benefits #q& #a #devops goals #devops migration #devops questions
1602902280
DevOps improves software delivery speed and quality through a list of practices that pursue an agile mindset. The terms that first come to mind when you mention DevOps are continuous integration,continuous delivery and deployment , collaboration, automation, and monitoring.
DevOps means different things to different teams. Some teams are all about automation, while others do things manually and still consider that they are doing DevOps. Some consider it a culture and a mindset-shaper.
As DevOps revolves around continuous delivery and fast code shipping, it’s crucial to act quickly without any significant errors. That’s why it’s vital to track the DevOps metrics that can help you achieve this.
To succeed in DevOps, teams use many different tools. That’s why different DevOps metrics are essential for different dev teams.
So, before even beginning with DevOps, your team should determine what DevOps means for them. What is more, teams should also detect their biggest DevOps challenges. Then, it will be easier for them to decide which DevOps metrics they need to monitor more actively to improve and create a more quality software delivery process.
_Here are the critical DevOps metrics most teams find important: _
It is important to develop and sustain a competitive advantage to offer updates, new functionalities, and technical enhancements with greater quality and accuracy. The opportunity to increase delivery intensity contributes to increased flexibility and better adherence to evolving consumers’ requirements.
The aim should be to allow smaller deployments as frequently as possible. When deployments are smaller, software testing and deployment are much more comfortable.
Regularly measuring deployment frequency will offer greater visibility into which improvements were more successful and which segments require change. A rapid drop in frequency can indicate that other tasks or manual actions are disrupting the workflow. For sustainable growth and development, deployment frequency indicators that suggest minor yet constant changes are optimal.
Going one step further and making testing more manageable can measure both production and non-production deployments. This way, you’ll be able to determine the frequency of your deployments to QA and optimize for early and smaller deployments.
_Adding this metric is in Microtica’s roadmap. As Microtica provides a build and deployment timeline, we’re planning to add a feature to show you your build and deployment frequency. _
#knowledge #devops #devops automation #devops metrics #devops tools