Skip to content
Αρχική
Σχετικά με εμένα
Επικοινωνία
Playground
Search articles
×
🔍
LEARN · EXPERIMENT · CREATE
Code Playground
Write code, experiment, and see what happens.
● Ready
☀ Light editor
Reset
Clear
Copy code
▶ Run
■ Stop
Code editor
HTML
CSS
AngularJS
index.html
<main class="card" ng-app="helloApp" ng-controller="helloCtrl"> <p class="eyebrow">YOUR FIRST EXPERIMENT</p> <h1>{{ greeting }}</h1> <p>Change the message in the AngularJS tab.</p> <button ng-click="count = count + 1">Clicked {{ count }} times</button> </main>
style.css
body { font-family: system-ui, sans-serif; background: #eef7f7; padding: 32px; } .card { max-width: 520px; margin: 30px auto; padding: 32px; border-radius: 18px; background: white; box-shadow: 0 12px 35px #0f766e22; } .eyebrow { color: #0f9f93; letter-spacing: .15em; font-size: 12px; font-weight: 700; } button { background: #19c5b5; border: 0; border-radius: 8px; padding: 10px 16px; font-weight: 700; cursor: pointer; }
app.js · ANGULARJS 1.x
var app = angular.module('helloApp', []); app.controller('helloCtrl', function($scope) { $scope.greeting = "Hello, CodeLab! 👋"; $scope.count = 0; });
Live preview
OUTPUT
Preview runs in an isolated frame.
Loading editor…
