Test wiedzy programisty
Sprawdź swoje umiejętności programistyczne – rozwiąż test z 50 pytaniami!
Czy jesteś gotów zmierzyć się z wyzwaniem, które zweryfikuje Twój poziom zaawansowania w programowaniu? Rozwiązując nasz test składający się z 50 starannie dobranych pytań, sprawdzisz swoją wiedzę z różnych obszarów – od algorytmów i struktur danych po najlepsze praktyki kodowania. Test podzielony jest na sekcje.
Dlaczego warto?
- Dowiedz się, jak wypadasz w kluczowych obszarach programowania.
- Zidentyfikuj swoje mocne strony i znajdź obszary do poprawy.
- Porównaj swoje wyniki z innymi programistami.
Czego możesz się spodziewać?
- Różnorodnych pytań: od teorii po praktyczne scenariusze kodowania.
- Dynamicznego formatu, który dostosowuje się do Twojego poziomu.
- Natychmiastowego wyniku i szczegółowej analizy.
Kliknij na pole odpowiedzi w każdym pytaniu a następnie kliknij następne pytanie. Przycisk będzie aktywny tylko jeśli klikniesz w pole odpowiedzi. Przed przejściem do następnego pytania zostanie podświetlona na zielono prawidłowa odpowiedź, tak aby poinformować Cię czy wybrana odpowiedź była prawidłowa czy nie. Po skończeniu testu wyświetlą się wyniki. Masz 1 minutę 40 sekund na udzielenie odpowiedzi na każde pytanie o czym informuje odliczanie. Po tym czasie jeśli niczego nie wybierzesz aplikacja uzna że nie udzielono prawidłowej odpowiedzi i przejdzie do następnego pytania. Jeśli wybierzesz odpowiedź a licznik dojdzie do zera to przejdzie do następnego pytania przyjmując odpowiedź którą wybrałeś. W każdej chwili możesz zmienić swój wybór o ile jeszcze licznik nie doszedł do zera. Kolor paska postępu odzwierciedla czas pozostały do końca.
Nie zwlekaj – podnieś poprzeczkę i sprawdź, na ile jesteś gotowy na kolejne wyzwania w swojej karierze.
Rozpocznij test już teraz!
Wynik testu
Kod po stronie przeglądarki
<div id="app">
<div class="my-5">
<div class="row my-3">
<div class="col-md-6">
<label for="level" class="form-label">Poziom trudności testu</label>
<select class="form-select" id="level" v-bind:disabled="started" v-model="level">
<option value="beginner">początkujący</option>
</select>
</div>
</div>
<div class="row my-3">
<div class="col-12">
<button class="btn btn-primary" v-if="!started" v-on:click="startTest">Rozpocznij test</button>
</div>
</div>
<div class="d-flex justify-content-center" v-if="loading && firstLoad">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<h2 class="text-center" v-text="question.section" v-if="!done"></h2>
<h3 class="mt-3" v-text="question.question" v-if="!done"></h3>
<pre class="my-3 bg-light p-3" v-if="!done && (question.code != '')"><code v-text="question.code"></code></pre>
<div class="my-3" v-if="!done && (question.question != '')">
<div class="form-check">
<input class="form-check-input" type="radio" id="q1" value="A" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassA" for="q1" v-text="question.answers.A"></label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" id="q2" value="B" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassB" for="q2" v-text="question.answers.B"></label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" id="q3" value="C" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassC" for="q3" v-text="question.answers.C"></label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" id="q4" value="D" v-model="picked" v-on:change="enableButton"/>
<label class="form-check-label" v-bind:class="optionClassD" for="q4" v-text="question.answers.D"></label>
</div>
</div>
<div class="mt-4" v-if="running && !done">
<div class="d-flex">
<div class="progress me-auto w-75 mt-2" role="progressbar" aria-label="Pozostały czas" v-bind:aria-valuenow="countDownValue" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar" v-bind:class="countDownBg" v-bind:style="{width: countDownValue + '%'}" v-text="countDownText"></div>
</div>
<button type="button" class="btn btn-primary" v-on:click="nextQuestion" v-bind:disabled="buttonDisabled">
<span class="spinner-border spinner-border-sm" aria-hidden="true" v-show="loading"></span>
<span role="status">Idź dalej</span>
</button>
</div>
</div>
<div v-if="done">
<div class="alert alert-light">
<h5>Wynik testu</h5>
<div>
<p v-html="result"></p>
<div class="progress-bar" role="progressbar" aria-label="Wynik testu" v-bind:aria-valuenow="percent" aria-valuemin="0" aria-valuemax="100">
<div class="progress" v-bind:class="progressClass" v-bind:style="{width: percent + '%'}"></div>
</div>
<p class="mt-3" v-text="suggestion"></p>
</div>
</div>
</div>
</div>
</div>
<script>
var vm = null;
document.addEventListener('DOMContentLoaded', function() {
vm = new Vue({
el: '#app',
data: {
question: {
section: '',
question: '',
code: '',
answers: {
A: '',
B: '',
C: '',
D: ''
},
answer: ''
},
level: 'beginner',
picked: null,
index: 0,
max: 999999999,
result: '',
suggestion: '',
done: false,
buttonDisabled: false,
percent: 0,
progressClass: '',
validAnswer: null,
lock: false,
started: false,
running: false,
firstLoad: false,
loading: false,
//countdown
now: null,
countDownInterval: null,
countDownDate: null,
countDownText: '',
countDownBg: 'bg-success',
countDownValue: 0
},
methods: {
getOptionClass: function(opt)
{
return (this.validAnswer && (this.validAnswer === opt)) ? 'text-success fw-bold' : 'text-normal';
},
enableButton: function()
{
this.buttonDisabled = false;
},
countDown: function()
{
var self = this;
self.now = new Date().getTime();
var distance = self.countDownDate - self.now;
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.ceil((distance % (1000 * 60)) / 1000);
self.countDownText = minutes + "m " + seconds + "s";
self.countDownValue = minutes * 60 + seconds;
if (self.countDownValue < 25)
{
self.countDownBg = 'text-bg-danger';
}
else if ((self.countDownValue >= 25) && (self.countDownValue < 50))
{
self.countDownBg = 'text-bg-orange';
}
else if ((self.countDownValue >= 50) && (self.countDownValue < 75))
{
self.countDownBg = 'text-bg-warning';
}
else
{
self.countDownBg = 'text-bg-success';
}
if (distance <= 0)
{
clearInterval(self.countDownInterval);
self.countDownInterval = null;
self.countDownText = '';
self.countDownValue = 0;
//no answer
if (!self.picked)
{
self.picked = '0';
}
if (!self.lock)
{
self.nextQuestion();
}
}
},
startTest: function()
{
this.started = true;
this.firstLoad = true;
this.loading = true;
this.nextQuestion();
},
nextQuestion: function ()
{
var self = this;
self.buttonDisabled = true;
self.lock = true;
self.loading = true;
var data = {
token: '1f394f97f28d49a992160398df23860ecf38e88e',
level: self.level,
picked: self.picked,
index: self.index
};
axios.post(urlSite('public/ajax/app/exec/12'), data, {headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
.then(function (response) {
var data = response.data;
var done = data.meta.done;
if (done)
{
if (self.countDownInterval !== null)
{
clearInterval(self.countDownInterval);
self.countDownInterval = null;
self.countDownText = '';
self.countDownValue = 0;
}
self.progressClass = data.data.progress_class;
self.suggestion = data.data.suggestion;
setTimeout(function() {
self.done = true;
self.lock = false;
self.loading = false;
}, 2000);
}
if (self.picked)
{
self.index = data.data.index;
}
self.max = data.data.max;
self.result = data.data.result;
self.percent = data.data.percent;
self.validAnswer = data.data.valid_answer;
if (data.data.question)
{
setTimeout(function() {
self.validAnswer = null;
self.picked = null;
self.question = data.data.question;
self.countDownDate = new Date().getTime() + 100000;
if (self.countDownInterval === null)
{
self.countDownInterval = setInterval(self.countDown, 1000);
}
self.running = true;
self.lock = false;
self.firstLoad = false;
self.loading = false;
}, 2000);
}
}).catch(function(error) {
self.lock = false;
self.firstLoad = false;
self.loading = false;
BootstrapToast.show({title: 'Błąd', message: error.response.data.message, when: 'teraz', type: 'text-bg-danger'});
});
}
},
computed: {
optionClassA: function() { return this.getOptionClass('A'); },
optionClassB: function() { return this.getOptionClass('B'); },
optionClassC: function() { return this.getOptionClass('C'); },
optionClassD: function() { return this.getOptionClass('D'); }
}
});
});
</script>
Kod po stronie serwera
Uwaga
Kod na serwerze dla tej aplikacji jest kodem zamkniętym.